bangyixing

Theme #40 - Don't Wanna Love You (Ver. 2)

Oct 29th, 2013
161
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 12.73 KB | None | 0 0
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2.  
  3. <!--
  4. ᴛʜᴇᴍᴇ #40: ᴅᴏɴ’ᴛ ᴡᴀɴɴᴀ ʟᴏᴠᴇ ʏᴏᴜ
  5. ᴅᴇsɪɢɴᴇᴅ ᴀɴᴅ ᴄᴏᴅᴇᴅ ʙʏ ᴀɴᴅʀᴇᴀ @ ᴍʟɪᴋʙᴏʏ
  6. ᴘʟᴇᴀsᴇ ᴅᴏɴ'ᴛ ʀᴇᴍᴏᴠᴇ ᴛʜᴇ ᴄʀᴇᴅɪᴛs. ᴛʜᴀɴᴋ ʏᴏᴜ.
  7. -->
  8.  
  9. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  10.  
  11. <head>
  12.  
  13. <title>{Title}</title>
  14. <link rel="shortcut icon" href="{Favicon}">
  15. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  16.  
  17. <!--Default Variables-->
  18. <!--Colors-->
  19.  
  20. <meta name="color:Background" content="#ffffff"/>
  21. <meta name="color:Title" content="#474545"/>
  22. <meta name="color:Border" content="#000000"/>
  23. <meta name="color:Sidebar Border" content="#000000"/>
  24. <meta name="color:Link" content="#000000"/>
  25. <meta name="color:Sidelink" content="#fafafa"/>
  26. <meta name="color:Link Border" content="#eeeeee"/>
  27. <meta name="color:Scrollbar" content="#fbfbfb"/>
  28. <meta name="color:Hover" content="#cfcfcf"/>
  29. <meta name="color:Description" content="#727272"/>
  30. <meta name="color:Asker" content="#fafafa"/>
  31. <meta name="color:Quote" content="#fafafa"/>
  32. <meta name="color:Info Border" content="#fafafa"/>
  33. <meta name="color:Hover" content="#cfcfcf"/>
  34. <meta name="color:Text" content="#000000"/>
  35.  
  36. <!--Images-->
  37.  
  38. <meta name="image:Sidebar" content="http://static.tumblr.com/d1195208f45117f07a85c652a2268144/czllhpn/5WBmvfvoa/tumblr_static_untitled-1.jpg"/>
  39.  
  40. <!--Links-->
  41.  
  42. <meta name="text:Link1" content="/" />
  43. <meta name="text:Link1 Title" content="link" />
  44. <meta name="text:Link2" content="/" />
  45. <meta name="text:Link2 Title" content="link" />
  46. <meta name="text:Link3" content="/" />
  47. <meta name="text:Link3 Title" content="link" />
  48. <meta name="text:Link4" content="/" />
  49. <meta name="text:Link4 Title" content="link" />
  50. <meta name="text:Link5" content="/" />
  51. <meta name="text:Link5 Title" content="link" />
  52.  
  53. <!--Titles-->
  54.  
  55. <meta name="text:Title" content="my tears flows like river" />
  56.  
  57. <!--Fonts-->
  58.  
  59. <link href='http://fonts.googleapis.com/css?family=Inconsolata' rel='stylesheet' type='text/css'>
  60. <link href='http://fonts.googleapis.com/css?family=Roboto:100' rel='stylesheet' type='text/css'>
  61.  
  62. <!--qTip-->
  63.  
  64. <script language="JavaScript" src="http://dl.dropbox.com/u/3173073/GothicDarkness/qTip.js" type="text/JavaScript"></script>
  65.  
  66. <!--Click-->
  67.  
  68. <script type="text/javascript">
  69. function unhide(divID) {
  70. var item = document.getElementById(divID);
  71. if (item) {
  72. item.className=(item.className=='hidden')?'unhidden':'hidden'; }
  73. }
  74. </script>
  75.  
  76. <style type="text/css">
  77.  
  78. ::-webkit-scrollbar-thumb:vertical {
  79. background: {color:Border};
  80. height: 80px;
  81. }
  82.  
  83. ::-webkit-scrollbar {
  84. height: 10px;
  85. width: 3px;
  86. background: {color:Scrollbar};
  87. }
  88.  
  89. body {
  90. font-family:'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif;
  91. font-size:10px;
  92. text-align:justify;
  93. letter-spacing:1px;
  94. line-height:140%;
  95. background:{color:Background};
  96. color:{color:Text};
  97. cursor: url(http://img69.imageshack.us/img69/7673/cursorw.png), progress;
  98. }
  99.  
  100. a {
  101. text-decoration:none;
  102. outline:none;
  103. -moz-outline-style:none;
  104. color:{color:Text};
  105. -webkit-transition: all 0.5s ease;
  106. -moz-transition: all 0.5s ease;
  107. -o-transition: all 0.5s ease;
  108. }
  109.  
  110. img {
  111. border:none;
  112. }
  113.  
  114. blockquote blockquote {
  115. padding-left:5px;
  116. border-left:1px solid;
  117. }
  118.  
  119. h1 {
  120. font-size:24px;
  121. text-transform:lowercase;
  122. font-style:none;
  123. font-weight:bold;
  124. line-height:140%;
  125. text-align:center;
  126. font-family:Trebuchet MS;
  127. color:{color:Title};
  128. }
  129.  
  130. a:hover {
  131. color: {color:Hover};
  132. }
  133.  
  134. small{
  135. font-size:9px;
  136. line-height:140%;
  137. }
  138.  
  139. big {
  140. font-size:12px;
  141. line-height:140%;
  142. }
  143.  
  144. b, strong{
  145. color:{color:Text};
  146. }
  147. i, em {
  148. color:{color:Text};
  149. }
  150. p{
  151. margin-top:5px;
  152. margin-bottom:5px;
  153. }
  154.  
  155. blockquote {
  156. padding:0px;
  157. padding-left:5px;
  158. margin:5px;
  159. border-left:1px solid {color:Border};
  160. }
  161.  
  162. blockquote img {
  163. max-width:200px;
  164. }
  165.  
  166. .audio{width:25px;padding:5px;position:absolute;opacity:1;margin-left:200px;margin-top:-45px;overflow:hidden;}
  167. .audioplay{height:50px;width:500px;background-color:{color:Text};}
  168. .cover{width:50px;height:50px;position:absolute;margin-left:140px;}
  169. .cover img{width:50px;}
  170. .audioinfo{font-size:7px;text-align:center;padding:5px;width:490px;margin-top:2px;text-transform:uppercase;letter-spacing:1px;background-color:{color:Text};color:{color:Background};}
  171.  
  172. .entries{
  173. padding:2px;
  174. width:500px;
  175. padding:5px;
  176. margin:5px;
  177. background:{color:Background};
  178. }
  179.  
  180. #posts{
  181. width:500px;
  182. margin-left:350px;
  183. padding-left:15px;
  184. padding-right:15px;
  185. padding-top:35px;
  186. margin-top:0px;
  187. padding:5px;
  188. }
  189.  
  190. #quote {
  191. padding:10px;
  192. margin-bottom:5px;
  193. background:{color:Quote};
  194. font-family:Courier;
  195. font-size:12px;
  196. font-style:none;
  197. letter-spacing:1px;
  198. -webkit-border-radius:2px;
  199. -moz-border-radius:2px;
  200. border-radius:2px;
  201. }
  202.  
  203. #chat {
  204. text-transform:uppercase;
  205. font-family:'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif;
  206. }
  207.  
  208. #website {
  209. font-family:Arial;
  210. font-style:italic;
  211. text-align:right;
  212. font-size:12px;
  213. color:{color:Text};
  214. }
  215.  
  216. #title {
  217. font-size:10px;
  218. position:fixed;
  219. margin-left:100px;
  220. margin-top:165px;
  221. font-family:Roboto;
  222. font-style:none;
  223. text-align:center;
  224. width:200px;
  225. letter-spacing:0px;
  226. text-transform:uppercase;
  227. color:{color:Text};
  228. }
  229.  
  230. #sidebarimage img{
  231. width:200px;
  232. height:170px;
  233. position:fixed;
  234. margin-left:100px;
  235. padding:0px;
  236. margin-top:185px;
  237. }
  238.  
  239. #description {
  240. font-size:10px;
  241. width:190px;
  242. height:70px;
  243. font-family:'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif;
  244. text-transform:none;
  245. position:fixed;
  246. text-align:center;
  247. font-style:none;
  248. line-height:10px;
  249. margin-left:100px;
  250. margin-top:390px;
  251. letter-spacing:-1px;
  252. opacity:1;
  253. padding:5px;
  254. border-bottom:1px solid {color:Info Border};
  255. border-top:1px solid {color:Info Border};
  256. color:{color:Description};
  257. -moz-transition-duration:1s;
  258. -webkit-transition-duration:1s;
  259. -o-transition-duration:1s;
  260. }
  261.  
  262. #links {
  263. font-size:11px;
  264. position:fixed;
  265. margin-left:100px;
  266. margin-top:355px;
  267. font-family:Inconsolata;
  268. padding:5px;
  269. font-style:none;
  270. text-align:center;
  271. width:190px;
  272. opacity:1;
  273. letter-spacing:1px;
  274. text-transform:lowercase;
  275. -moz-transition-duration:0.5s;
  276. -webkit-transition-duration:0.5s;
  277. -o-transition-duration:0.5s;
  278. }
  279.  
  280. #links a {
  281. display:inline-block;
  282. width:auto;
  283. padding:6px;
  284. text-align:center;
  285. padding:0px 5px;
  286. line-height:25px;
  287. margin-right:3px;
  288. margin-bottom:2px;
  289. color:{color:Link};
  290. }
  291.  
  292. #links a:hover {
  293. color:{color:Hover};
  294. -moz-transition-duration:0.7s;
  295. -webkit-transition-duration:0.7s;
  296. -o-transition-duration:0.7s;
  297. }
  298.  
  299. #more {
  300. font-size:8px;
  301. position:fixed;
  302. margin-left:95px;
  303. margin-top:456px;
  304. font-family:Arial;
  305. padding:5px;
  306. padding-top:15px;
  307. font-style:none;
  308. text-align:right;
  309. line-height:40%;
  310. width:190px;
  311. opacity:1;
  312. letter-spacing:1px;
  313. text-transform:uppercase;
  314. -moz-transition-duration:0.5s;
  315. -webkit-transition-duration:0.5s;
  316. -o-transition-duration:0.5s;
  317. }
  318.  
  319. #more a {
  320. display:block;
  321. width:200px;
  322. text-align:center;
  323. line-height:25px;
  324. margin-right:3px;
  325. margin-bottom:2px;
  326. color:{color:Link};
  327. background:{color:Sidelink};
  328. }
  329.  
  330. #more a:hover {
  331. color:{color:Link};
  332. background:{color:Background};
  333. -moz-transition-duration:0.7s;
  334. -webkit-transition-duration:0.7s;
  335. -o-transition-duration:0.7s;
  336. }
  337.  
  338. #question img {
  339. float:left;
  340. margin-right:11px;
  341. padding:5px;
  342. border:1px solid {color:Info Border};
  343. }
  344.  
  345. #qTip {
  346. padding:3px;
  347. width:auto;
  348. display: none;
  349. text-align: center;
  350. position:fixed;
  351. font-size:8px;
  352. text-transform:uppercase;
  353. font-family:Helvetica;
  354. background:{color:Background};
  355. color: {color:Text};
  356. font-style:none;
  357. letter-spacing: 0px;
  358. }
  359.  
  360. #qTip:first-letter {
  361. font-weight:bold;
  362. font-style:italic;
  363. color: {color:Text};
  364. }
  365.  
  366. .pagination {
  367. margin: 30px 0 0 0;
  368. font-size: 10px;
  369. font-family:Inconsolata;
  370. text-transform:uppercase;
  371. margin-left:170px;
  372. letter-spacing:9px;
  373. }
  374.  
  375. #info {
  376. text-align:left;
  377. margin-top:5px;
  378. margin-bottom:6px;
  379. font-family:'Inconsolata';
  380. padding-top:5px;
  381. text-transform:uppercase;
  382. font-style:none;
  383. letter-spacing:0px;
  384. font-size:10px;
  385. line-height:135%;
  386. }
  387.  
  388. #info a:hover{
  389. text-decoration: none;
  390. color: {color:Hover};
  391. }
  392.  
  393. #tags {
  394. font-size:10px;
  395. margin-top:0px;
  396. font-family:'Inconsolata';
  397. }
  398.  
  399. #tags a {
  400. text-decoration: none;
  401. padding:1px;
  402. color: {color:Text};
  403. }
  404.  
  405. #tags a:hover{
  406. text-decoration: none;
  407. color: {color:Hover};
  408. }
  409.  
  410. #notes {
  411. font-family:'Inconsolata';
  412. text-transform:uppercase;
  413. font-size:10px;
  414. }
  415.  
  416. #credit {
  417. font-family:Trebuchet MS;
  418. font-size:9px;
  419. letter-spacing:1px;
  420. float:right;
  421. position:fixed;
  422. bottom:15px;
  423. right:10px;
  424. }
  425.  
  426. #credit a {
  427. color:{color:Info Border};
  428. padding:5px;
  429. text-transform:uppercase;
  430. background:{color:Background};
  431. border:1px solid {color:Info Border};
  432. }
  433.  
  434. #credit a:hover {
  435. color:{color:Background};
  436. text-transform:uppercase;
  437. font-style:none;
  438. background:{color:Text};
  439. }
  440.  
  441. .hidden {display: none;}
  442. .unhidden {display: block;}
  443.  
  444. .hidden {visibility: hidden;}
  445. .unhidden {visibility: visible;}
  446.  
  447. {CustomCSS}</style></head><body>
  448.  
  449. <div id="title">{text:Title}</div>
  450.  
  451. <div id="sidebarimage"><img src="{image:Sidebar}"></div>
  452.  
  453. <div id="links">
  454. <a href="/">home</a>
  455. <a href="/ask">ask</a>
  456. <a href="/archive">past</a>
  457. <a href="http://mlikboy.tumblr.com/">©</a>
  458. </div>
  459.  
  460. <div id="more">
  461. <a href="javascript:unhide('displaybx');">navigation</a>
  462. <div id="displaybx" class="hidden">{block:ifLink1}<a href="{text:Link1}">{text:Link1 Title}</a>{/block:ifLink1}
  463. {block:ifLink2}<a href="{text:Link2}">{text:Link2 Title}</a>{/block:ifLink2}
  464. {block:ifLink3}<a href="{text:Link3}">{text:Link3 Title}</a>{/block:ifLink3}
  465. {block:ifLink4}<a href="{text:Link4}">{text:Link4 Title}</a>{/block:ifLink4}
  466. {block:ifLink5}<a href="{text:Link5}">{text:Link5 Title}</a>{/block:ifLink5}
  467. </div>
  468. </div>
  469.  
  470. <div id="description">{Description}</div>
  471.  
  472. <div id="posts">
  473. {block:Posts}
  474. <div class="entries">
  475.  
  476. {block:Photo}<img src="{PhotoURL-500}">
  477. {block:Caption}{Caption}{/block:Caption}
  478. {/block:Photo}
  479.  
  480. {block:Photoset}{Photoset-500}
  481. {block:Caption}{Caption}{/block:Caption}
  482. {/block:Photoset}
  483.  
  484. {block:Text}<h1>{block:Title}{Title}{/block:Title}</h1>{Body}{/block:Text}
  485.  
  486. {block:Quote}<div id="quote">❝{Quote}</i>❞{block:Source} — {Source}</div>{/block:Source}{/block:Quote}
  487.  
  488. {block:Link}<div id="website"><a href="{URL}" {Target}>{Name}</a></div>{block:Description}{Description}{/block:Description}{/block:Link}
  489.  
  490. <div id="chat">
  491. {block:Chat}
  492. {block:Title}
  493. <h1>{Title}</h1>
  494. {/block:Title}
  495. {block:Lines}
  496. <blockquote>{block:Label}<b>{Label}</b>{/block:Label} -
  497. {Line}</blockquote><br>
  498. {/block:Lines}{/block:Chat}
  499. </div>
  500.  
  501. {block:Audio}
  502. <div class="audioplay">
  503. <div class="cover"><img src="http://static.tumblr.com/jn9hrij/20Ul2zzsr/albumart.jpg"></div>
  504. {block:AlbumArt}<div class="cover"><img src="{AlbumArtURL}"></div>{/block:AlbumArt}</div>
  505. <div class="audio">{AudioPlayerBlack}</div>
  506. <div class="audioinfo">{block:TrackName}{TrackName}{/block:TrackName} {block:Artist}— {Artist}{/block:Artist}{block:Album} ({Album}){/block:Album}</div>
  507. {Caption}
  508. {/block:Audio}
  509.  
  510. {block:Video}
  511. {Video-500}
  512. {block:Caption}{Caption}{/block:Caption}
  513. {/block:Video}
  514.  
  515. {block:Answer}<div id="question"><img src="{AskerPortraitURL-48}"></div> <div style="text-transform:uppercase;
  516. font-style:italic;
  517. font-size:9px;">{Question} — <b>{Asker}</b><br><br><br><br><br></div>
  518. {Answer}<br>{/block:Answer}
  519.  
  520. {block:Date}<div id="info"> {block:RebloggedFrom} <a href="{ReblogParentURL}">via </a> ‧ {/block:RebloggedFrom} {block:ContentSource} <a href="{SourceURL}">source</a> — {/block:ContentSource}{block:RebloggedFrom} <a href="{ReblogParentURL}" target="_blank"></a> {/block:RebloggedFrom} with <a href="{Permalink}">{NoteCountWithLabel}</a>{/block:NoteCount}
  521. <a href="{Permalink}" style="float:right; background-color:{color:Info Background}; padding:3px; color:{color:Background};">{TimeAgo}</a>
  522. {/block:Date}</div>
  523. {block:HasTags}
  524. <div id="tags">
  525. {block:Tags} #<a href="{TagURL}">{Tag}</a>{/block:Tags}</div>
  526. {/block:HasTags}
  527. <div id="notes">
  528. {block:PostNotes}{PostNotes}{/block:PostNotes}
  529. </div>
  530. </div>
  531. {/block:Posts}
  532.  
  533. <div class="pagination">
  534. {block:PreviousPage}
  535. <a href="{PreviousPage}">«</a>
  536. {/block:PreviousPage}
  537. {block:JumpPagination length="5"}
  538. {block:CurrentPage}
  539. <span class="current_page">{PageNumber}</span>
  540. {/block:CurrentPage}
  541.  
  542. {block:JumpPage}
  543. <a href="{URL}">{PageNumber}</a>
  544. {/block:JumpPage}
  545. {/block:JumpPagination}
  546. {block:NextPage}
  547. <a href="{NextPage}">»</a>
  548. {/block:NextPage}
  549. </div>
  550. {/block:Pagination}
  551. </div>
  552.  
  553. <div id="credit"><a href="http://mlikboy.tumblr.com/">mb</a></div>
  554.  
  555. </body>
  556. </html>
Advertisement
Add Comment
Please, Sign In to add comment