API tools faq
paste
Advertisement
thematchgirl

Theme 16

thematchgirl
May 30th, 2014
223
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 14.51 KB | None | 0 0
raw download clone embed print report
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml">
  3. <head>
  4. <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
  5. <title>{title}</title>
  6. <link rel="shortcut icon" href="{Favicon}">
  7. <link href='http://fonts.googleapis.com/css?family=Wire+One' rel='stylesheet' type='text/css'>
  8. {block:ifTwoColumn}<script type="text/javascript" src="http://static.tumblr.com/d0qlne1/DiAl6ekb7/jquery-1.4.2.min.js"></script>
  9. <script src="http://static.tumblr.com/twte3d7/H8Glm663z/masonry.js"></script>
  10. <script type="text/javascript">
  11. $(window).load(function () {
  12. $('#content').masonry({
  13. itemSelector : ".post",
  14. },
  15. function() { $('#content').masonry({ appendedContent: $(this) }); }
  16. );
  17. });
  18. </script>{/block:ifTwoColumn}
  19.  
  20. <meta name="color:background" content="#fbfbfb" />
  21. <meta name="color:text" content="#666666" />
  22. <meta name="color:link" content="#cccccc" />
  23. <meta name="color:sidebar" content="#cccccc" />
  24. <meta name="color:sidebar links bg" content="#ffffff" />
  25. <meta name="color:sidebar links" content="#666666" />
  26. <meta name="color:description bg" content="#f8f8f8" />
  27. <meta name="color:description" content="#666666" />
  28. <meta name="color:posts" content="#ffffff" />
  29. <meta name="color:blockquote" content="#f8f8f8" />
  30. <meta name="color:blockquote text" content="#666666" />
  31. <meta name="color:ask quote text" content="#666666" />
  32. <meta name="color:ask quote" content="#f4f4f4" />
  33. <meta name="color:ask quote border" content="#7d7d7d" />
  34. <meta name="color:chat 1 label" content="#333333" />
  35. <meta name="color:chat 2 label" content="#7d7d7d" />
  36. <meta name="color:chat 1 bg" content="#f4f4f4" />
  37. <meta name="color:chat 2 bg" content="#ffffff" />
  38. <meta name="color:chat 1 bg" content="#7d7d7d" />
  39. <meta name="color:chat 2 bg" content="#666666" />
  40. <meta name="color:chat border" content="#cccccc" />
  41. <meta name="color:music info bg" content="#7d7d7d" />
  42. <meta name="color:music info" content="#ffffff" />
  43.  
  44. <meta name="image:background" content="http://25.media.tumblr.com/tumblr_m37lmqN7UD1rsx5i6o5_250.png" />
  45. <meta name="image:sidebar" content="http://vorfreude.co.vu/wp-content/themes/vorfreude/sidebar.png" />
  46.  
  47. <meta name="text:Link1" content="" />
  48. <meta name="text:Link1URL" content=""/>
  49. <meta name="text:Link2" content="" />
  50. <meta name="text:Link2URL" content=""/>
  51. <meta name="text:Link3" content="" />
  52. <meta name="text:Link3URL" content=""/>
  53. <meta name="text:Link4" content="" />
  54. <meta name="text:Link4URL" content=""/>
  55.  
  56. <meta name="if:Grayscale" content="1" />
  57. <meta name="if:TwoColumn" content="1" />
  58.  
  59. </head>
  60.  
  61. <style>
  62.  
  63. body {
  64. background:url({image:background}) {color:background};
  65. font-family:Cambria;
  66. font-size:12px;
  67. text-align:justify;
  68. color:{color:text};
  69. cursor:crosshair;
  70. }
  71.  
  72. a {
  73. color:{color:link};
  74. text-transform:uppercase;
  75. text-decoration:none;
  76. font-size:10px;
  77. }
  78.  
  79. a:hover {
  80. color:{color:text};
  81. font-style:italic;
  82. }
  83.  
  84. #sidebar {
  85. position:fixed;
  86. top:0;
  87. left:0;
  88. height:100%;
  89. width:350px;
  90. background:url({image:sidebar}) {color:sidebar};
  91. background-size:100% 100%;
  92. }
  93.  
  94. #link {
  95. background:rgba(255,255,255,.6);
  96. width:90%;
  97. margin-top:75%;
  98. display:block;
  99. padding:10px;
  100. }
  101.  
  102. .link {
  103. background:{color:sidebar links bg};
  104. text-align:center;
  105. text-transform:uppercase;
  106. font-family:wire one;
  107. width:95%;
  108. display:block;
  109. font-size:20px;
  110. color:{color:sidebar links};
  111. padding:2.5%;
  112. }
  113.  
  114. .more {
  115. background:{color:sidebar links bg};
  116. text-align:center;
  117. text-transform:uppercase;
  118. font-family:wire one;
  119. width:95%;
  120. display:block;
  121. font-size:20px;
  122. color:{color:sidebar links};
  123. padding:2.5%;
  124. overflow:hidden;
  125. height:22px;
  126. -webkit-transition:all 1s ease-in-out;
  127. -moz-transition:all 1s ease-in-out;
  128. -o-transition:all 1s ease-in-out;
  129. -ms-transition:all 1s ease-in-out;
  130. transition:all 1s ease-in-out;
  131. }
  132.  
  133. .more:hover {
  134. height:160px;
  135. }
  136.  
  137. .desc {
  138. font-family:cambria;
  139. max-height:90px;
  140. font-style:none;
  141. text-transform:none;
  142. font-size:11px;
  143. padding:10px;
  144. background:{color:description bg};
  145. color:{description};
  146. -webkit-transition:all 1s ease-in-out;
  147. -moz-transition:all 1s ease-in-out;
  148. -o-transition:all 1s ease-in-out;
  149. -ms-transition:all 1s ease-in-out;
  150. transition:all 1s ease-in-out;
  151. text-align:justify;
  152. }
  153.  
  154. .more .link {
  155. padding:5px;
  156. font-size:15px;
  157. -webkit-transition:all 1s ease-in-out;
  158. -moz-transition:all 1s ease-in-out;
  159. -o-transition:all 1s ease-in-out;
  160. -ms-transition:all 1s ease-in-out;
  161. transition:all 1s ease-in-out;
  162. }
  163.  
  164. .more:hover .link {
  165. background:{color:description bg};
  166. color:{description};
  167. }
  168.  
  169. #content {
  170. margin-left:375px;
  171. width:1000px;
  172. margin-bottom:25px;
  173. margin-top:25px;
  174. }
  175.  
  176. .post {
  177. background:{color:posts};
  178. {block:indexpage}width:400px;{/block:indexpage}
  179. {block:permalinkpage}width:500px;{/block:permalinkpage}
  180. {block:ifTwoColumn}float:left;{/block:ifTwoColumn}
  181. {block:indexpage}opacity:.8;{/block:indexpage}
  182. {block:permalinkpage}opacity:1;{/block:permalinkpage}
  183. margin:10px 10px 5px 5px;
  184. padding:20px;
  185. }
  186. .post:hover {
  187. opacity:1;
  188. }
  189.  
  190. img, .html_photoset {
  191. max-width:100%;
  192. {block:ifGrayscale}filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale"); /* Firefox 10+, Firefox on Android */
  193. filter: gray; /* IE6-9 */
  194. -webkit-filter: grayscale(100%); /* Chrome 19+, Safari 6+, Safari 6+ iOS */
  195. -webkit-transition:all 1s ease-in-out;
  196. -moz-transition:all 1s ease-in-out;
  197. -o-transition:all 1s ease-in-out;
  198. -ms-transition:all 1s ease-in-out;
  199. transition:all 1s ease-in-out;{/block:ifGrayscale}
  200. }
  201.  
  202. .post:hover img, .post:hover .html_photoset {
  203. filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'1 0 0 0 0, 0 1 0 0 0, 0 0 1 0 0, 0 0 0 1 0\'/></filter></svg>#grayscale");
  204. -webkit-filter: grayscale(0%);
  205. }
  206.  
  207. h2 {
  208. font-size:25px;
  209. background:{color:posts};
  210. color:{color:text};
  211. text-transform:uppercase;
  212. border-left:5px solid {color:text};
  213. border-bottom:1px solid{color:text};
  214. padding-left:5px;
  215. font-family:wire one;
  216. margin:0px;
  217. margin-bottom:10px;
  218. }
  219.  
  220. .date {
  221. font-family:wire one;
  222. background:{color:text};
  223. color:{color:posts};
  224. padding-right:5px;
  225. font-size:15px;
  226. text-transform:uppercase;
  227. text-align:right;
  228. margin-top:10px;
  229. }
  230. .date a {
  231. color:#fff;
  232. font-size:15px;
  233. }
  234.  
  235. {block:NotReblog} .isi:first-letter {
  236. background:{color:text};
  237. color:{color:posts};
  238. font-size:22px;
  239. width:22px;
  240. height:25px;
  241. text-align:center;
  242. font-style:italic;
  243. font-weight:700;
  244. text-transform:uppercase;
  245. float:left;
  246. margin:3px;
  247. padding:12px;
  248. }{/block:NotReblog}
  249.  
  250. blockquote, pre {
  251. font-family:georgia;
  252. font-style:italic;
  253. background:{color:blockquote};
  254. color:{color:blockquote text};
  255. padding:5px;
  256. }
  257.  
  258. pre {
  259. font-family:consolas;
  260. word-break:break-word;
  261. }
  262.  
  263. ::-moz-selection,::selection {
  264. background:{color:text};
  265. color:{color:posts};
  266. }
  267.  
  268. .pagination {
  269. display:block;
  270. margin-left:375px;
  271. width:960px;
  272. margin-bottom:50px;
  273. }
  274.  
  275. .pagination .next_entries {
  276. float:right;
  277. font-size:15px;
  278. background:{color:posts};
  279. color:{color:text};
  280. padding:5px;
  281. }
  282.  
  283. .pagination .previous_entries {
  284. float:left;
  285. font-size:15px;
  286. background:{color:posts};
  287. color:{color:text};
  288. padding:5px;
  289. }
  290.  
  291. .quote, .ask {
  292. font-size:15px;
  293. padding:15px;
  294. border-bottom:1px dashed {color:ask quote border};
  295. text-align:right;
  296. background:{color:ask quote};
  297. color:{color:ask quote text};
  298. }
  299.  
  300. .chat ul {
  301. list-style: none;
  302. margin:0px;
  303. margin-left:-40px;
  304. }
  305.  
  306. .odd b {
  307. color:{color:chat 1 label};
  308. }
  309.  
  310. .even b {
  311. color:{color:chat 2 label};
  312. }
  313.  
  314. .chat .odd {
  315. background:{color:chat 1 bg};
  316. color:{color:chat 1 text};
  317. padding:10px;
  318. border-bottom:1px solid {color:chat border};
  319. margin:0px;
  320. }
  321.  
  322. .chat .even {
  323. padding:10px;
  324. background:{color:chat 2 bg};
  325. color:{color:chat 2 text};
  326. border-bottom:1px solid {color:chat border};
  327. margin:0px;
  328. }
  329.  
  330. .first {
  331. font-size:50px;
  332. color:{color:posts};
  333. float:left;
  334. }
  335.  
  336. .sourced, .username {
  337. text-align:right;
  338. padding:5px;
  339. margin-bottom:10px;
  340. }
  341.  
  342. .muse img {
  343. border:5px solid {color:music info bg};
  344. margin-right:10px;
  345. width:100px;
  346. }
  347.  
  348. .audio {
  349. position:absolute;
  350. background:#ffffff;
  351. width:25px;
  352. height:25px;
  353. padding:37.5px;
  354. padding-left:10px;
  355. padding-right:65px;
  356. overflow:hidden;
  357. opacity:.5;
  358. display:block;
  359. margin-top:5px;
  360. margin-left:5px;
  361. z-index:10000;
  362. }
  363.  
  364. .music {
  365. height:100px;
  366. padding:5px;
  367. text-align:center;
  368. background{color:music info bg};
  369. font-size:20px;
  370. color:{color:music info};
  371. }
  372.  
  373. #notes {
  374. background-color: {color:blockquote};
  375. color:{color:blockquote color};
  376. padding:10px;
  377. display:block;
  378. }
  379.  
  380. ::-webkit-scrollbar-thumb:vertical {
  381. height:12px;
  382. border:2px solid {color:background};
  383. background-color:{color:text};
  384. }
  385.  
  386. ::-webkit-scrollbar-thumb:horizontal {
  387. background-color:{color:background};
  388. }
  389.  
  390. ::-webkit-scrollbar {
  391. width:12px;
  392. height:7px;
  393. border:5px solid {color:background};
  394. background-color:{color:text};
  395. }
  396.  
  397. #credit {
  398. padding:5px;
  399. background:{color:text};
  400. color:{color:posts};
  401. position:fixed;
  402. right:0;
  403. bottom:0;
  404. transition: all 0.8s ease-out;
  405. -o-transition: all 0.8s ease-out;
  406. -webkit-transition: all 0.8s ease-out;
  407. -moz-transition: all 0.8s ease-out;
  408. text-shadow:none;
  409. border-radius:10px 0 0 0;
  410. }
  411.  
  412. #credit a {
  413. color:{color:posts};
  414. text-shadow:none;
  415. }
  416.  
  417. </style>
  418. <body>
  419.  
  420. <div id="sidebar">
  421. <center><div id="link">
  422. <a class="link" href='/'><strong style="font-size:30px;font-style:italic">{Title}</strong><br /></a>
  423. <div class="desc">{description}</div>
  424.  
  425. <a class="link" href='/ask'>Message</a>
  426. <a class="link" href='/archive'>Archive</a>
  427. <a class="link" href='/archive'>Mobile</a>
  428. {block:iflink1}<div class="more">
  429. More Links<br />
  430. <div><a class="link" href="{text:Link1URL}" title="{text:Link1}" >{text:Link1}</a></div>{/block:iflink1}
  431. {block:iflink2}<div><a class="link" href="{text:Link2URL}" title="{text:Link2}" >{text:Link2}</a></div>{/block:iflink2}
  432. {block:iflink3}<div><a class="link" href="{text:Link3URL}" title="{text:Link3}" >{text:Link3}</a></div>{/block:iflink3}
  433. {block:iflink4}<div><a class="link" href="{text:Link4URL}" title="{text:Link4}" >{text:Link4}</a></div>{/block:iflink4}
  434. </div>
  435. </div></center>
  436. </div>
  437.  
  438. <div id="content">
  439. {block:posts}
  440. <div class="post">
  441. {block:Text}
  442. {block:Title}<a href="{Permalink}"><h2>{Title}</h2></a>{/block:Title}
  443. <section class="isi">
  444. {Body}
  445. </section>
  446. {/block:Text}
  447.  
  448. {block:Quote}
  449. <div class="quote"><span class="first">“</span>{Quote}</div>
  450. <div class="sourced">— {Source}</div>
  451. {/block:Quote}
  452.  
  453. {block:Link}
  454. <a href="{URL}"><h2>{Name} »</h2></a>
  455. {block:Description}<section class="isi">{Description}</section>{/block:Description}
  456. {/block:Link}
  457.  
  458. {block:Photo}
  459. {block:IndexPage}<center><div class="photo"><a href="{PhotoURL-HighRes}"><img src="{PhotoURL-400}" alt=""></a></div></center>{/block:IndexPage}
  460. {block:PermalinkPage}<center><div class="photo"><a href="{PhotoURL-HighRes}"><img src="{PhotoURL-500}" alt=""></a></div></center>{/block:PermalinkPage}
  461. {block:Caption}<section class="isi">{Caption}</section>{/block:Caption}
  462. {/block:Photo}
  463.  
  464. {block:Photoset}
  465. {block:indexpage}<center>{Photoset-400}</center>{/block:indexpage}
  466. {block:permalinkpage}<center>{Photoset-500}</center>{/block:permalinkpage}
  467. {block:Caption}<section class="isi">{Caption}</section>{/block:Caption}
  468. {/block:Photoset}
  469.  
  470. {block:Chat}
  471. {block:Title}<a href="{Permalink}"><h2>{Title}</h2></a>{/block:Title}
  472. <div class="chat">
  473. <ul>
  474. {block:Lines}
  475. <li class="{Alt}">{block:Label}<b>{Label}</b> {/block:Label}{Line}</li>
  476. {/block:Lines}
  477. </ul>
  478. </div>
  479. {/block:Chat}
  480.  
  481. {block:Video}
  482. {block:indexpage}<center>{Video-400}</center>{/block:indexpage}
  483. {block:permalinkpage}<center>{Video-500}</center>{/block:permalinkpage}
  484. {block:Caption}<section class="isi">{Caption}</section>{/block:Caption}
  485. {/block:Video}
  486.  
  487. {block:Answer}
  488. <div class="ask">{question}</div>
  489. <div class="username">{Asker} <img src="{AskerPortraitURL-128}" width="30px" align="right"></div>
  490. {Answer}
  491. {/block:Answer}
  492.  
  493. {block:Audio}
  494. <div class="muse">
  495. <div class="audio">
  496. {AudioPlayerWhite}
  497. </div>
  498. {block:AlbumArt}
  499. <img src="{AlbumArtURL}" width="100px" height="100px" align="left">
  500. {/block:AlbumArt}
  501.  
  502. <div class="music">
  503. <br/>
  504. {block:TrackName}<em><strong>{TrackName}</strong></em>{/block:TrackName} {block:Artist}<br/>
  505. <span style="font-size:16px">{Artist}</span>{/block:Artist}
  506. </div>
  507. </div>
  508. {/block:Audio}
  509.  
  510. <div class="date">
  511. {block:Date}<a href="{permalink}">{ShortMonth} {DayOfMonthWithZero}</a> <b>|</b>{/block:Date}{block:HasTags}
  512. {block:Tags} <a href="{TagURL}">{tag}</a>,{/block:Tags} <b>|</b>{/block:HasTags} {block:NoteCount} <a href="{permalink}">{NoteCountWithLabel}</a>{/block:NoteCount} </div>
  513.  
  514.  
  515. {block:PostNotes}
  516. <div id="notes">
  517. {PostNotes}
  518. </div>
  519. {/block:PostNotes}
  520.  
  521. </div>
  522.  
  523. {/block:posts}
  524.  
  525.  
  526. </div>
  527. {block:Pagination}<div class="pagination">{block:PreviousPage}<a class="previous_entries" href="{PreviousPage}">« Previous Page</span>{/block:PreviousPage} {block:NextPage}<a class="next_entries" href="{NextPage}">Next Page »</a>{/block:NextPage}</div>{/block:Pagination}
  528.  
  529. <div class="topp">
  530. <a href="javascript:;" id="scrollToTop">▲</a>
  531. </div>
  532.  
  533. <a href="http://thematchgirl.tumblr.com" title="theme maker"><div id="credit">❊ TMG</div></a>
  534.  
  535. </body>
  536. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement
Public Pastes
Advertisement
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!