sherloeckchen

theme #13 alternative

Apr 6th, 2013
514
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 13.79 KB | None | 0 0
  1. <!DOCTYPE html>
  2. <html lang="en">
  3.  
  4. <head>
  5. <title>{Title}</title>
  6.  
  7. <link rel="shortcut icon" href="{Favicon}" />
  8. <link rel="alternate" type="application/rss+xml" href="{RSS}" />
  9. <meta name="description" content="{MetaDescription}" />
  10.  
  11. <link href='http://fonts.googleapis.com/css?family=Playfair+Display:400,700,400italic,700italic|Old+Standard+TT:400,700,400italic|Alice|Vidaloka|Arapey:400italic,400' rel='stylesheet' type='text/css'>
  12.  
  13. <meta name="color:links" content=""/>
  14. <meta name="image:header" content=""/>
  15. <meta name="if:longtitle" content="1"/>
  16. <meta name="if:titlebackgroundwhite" content="1"/>
  17. <meta name="if:headergrayscale" content="1"/>
  18. <meta name="text:link1" content=""/>
  19. <meta name="text:link1url" content=""/>
  20. <meta name="text:link2" content=""/>
  21. <meta name="text:link2url" content=""/>
  22. <meta name="text:link3" content=""/>
  23. <meta name="text:link3url" content=""/>
  24. <meta name="text:link4" content=""/>
  25. <meta name="text:link4url" content=""/>
  26.  
  27. <script type="text/javascript"
  28. src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>
  29.  
  30. </head>
  31.  
  32. <style type="text/css">
  33.  
  34. ::-webkit-scrollbar-thumb:vertical{
  35. background-color:black;
  36. }
  37.  
  38. ::-webkit-scrollbar-thumb:horizontal{
  39. background-color:black;
  40. }
  41.  
  42. ::-webkit-scrollbar{
  43. height:5px;
  44. width:5px;
  45. background-color:white;
  46. }
  47.  
  48. body{
  49. background-color:white;
  50. font-family:times, serif;
  51. font-size:10px;
  52. letter-spacing:0px;
  53. color:black;
  54. text-align:justify;
  55. }
  56.  
  57. a, a:active, a:visited{
  58. text-decoration:none;
  59. color:{color:links};
  60. -webkit-transition:0.5s ease-in;
  61. -moz-transition:0.5s ease-in;
  62. -o-transition:0.5s ease-in;
  63. transition:0.5s ease-in;
  64. }
  65.  
  66. #con{
  67. width:500px;
  68. margin:0px auto 0px;
  69. }
  70.  
  71. #header{
  72. width:600px;
  73. height:200px;
  74. margin-left:-50px;
  75. margin-bottom:100px;
  76. margin-top:-8px;
  77. background:#212121 url('{image:header}') no-repeat bottom;
  78. {block:ifheadergrayscale}-webkit-filter:grayscale(1);{/block:ifheadergrayscale}
  79. }
  80.  
  81. #header .w{
  82. width:606px;
  83. margin-left:-3px;
  84. margin-top:60px;
  85. }
  86.  
  87. #header .h{
  88. {block:ifnottitlebackgroundwhite}color:white;{/block:ifnottitlebackgroundwhite}
  89. {block:iftitlebackgroundwhite}color:black;{/block:iftitlebackgroundwhite}
  90. cursor:default;
  91.  
  92. {block:iflongtitle}
  93. width:273px;
  94. padding:6px 10px 4px;
  95. font-family:'vidaloka';
  96. text-transform:uppercase;
  97. font-size:15px;
  98. line-height:20px;
  99. text-align:center;
  100. font-style:;
  101. {/block:iflongtitle}
  102.  
  103. {block:ifnotlongtitle}
  104. padding:7px 20px 5px 5px;
  105. font-size:35px;
  106. letter-spacing:-1px;
  107. font-weight:normal;
  108. font-style:italic;
  109. text-transform:uppercase;
  110. font-family:'vidaloka';
  111. {/block:ifnotlongtitle}
  112. }
  113.  
  114. #header .box{
  115. padding:4px 10px 5px;
  116. overflow:auto;
  117. max-height:42px;
  118. text-align:center;
  119. {block:iflongtitle}
  120. width:283px;
  121. {/block:iflongtitle}
  122. }
  123.  
  124. #header .bottom{
  125. text-align:center;
  126. font-size:7px;
  127. letter-spacing:1px;
  128. text-transform:uppercase;
  129. margin-top:25px;
  130. }
  131.  
  132. #header .bottom a{
  133. color:white;
  134. margin:0px 10px 0px;
  135. border-bottom:0px;
  136. padding:5px;
  137. }
  138.  
  139. #header .bottom a:hover{
  140. color:transparent;
  141. }
  142.  
  143. .pagination{
  144. position:fixed;
  145. bottom:0px;
  146. width:500px;
  147. background-color:white;
  148. padding:10px 0px 10px;
  149. text-align:center;
  150. font-family:;
  151. letter-spacing:1px;
  152. font-size:9px;
  153. opacity:0.7;
  154. -webkit-transition:0.6s ease-in;
  155. }
  156.  
  157. .pagination:hover{
  158. opacity:1;
  159. }
  160.  
  161. .pagination a{
  162. margin:0px 6px 0px;
  163. padding:1px 3px 1px;
  164. border:1px solid transparent;
  165. }
  166.  
  167. .pagination a.page{
  168. color:black;
  169. }
  170.  
  171. .pagination a.page:hover{
  172. color:#f2f2f2;
  173. }
  174.  
  175. .pagination a.arrow{
  176. font-size:8px;
  177. color:black;
  178. }
  179.  
  180. .pagination span.current{
  181. margin:0px 6px 0px;
  182. padding:1px 3px 1px;
  183. color:{color:links};
  184. }
  185.  
  186. /* POSTS */
  187.  
  188. h2{
  189. text-align:center;
  190. font-weight:normal;
  191. text-transform:uppercase;
  192. font-size:9px;
  193. letter-spacing:1px;
  194. margin:0px 0px 10px;
  195. }
  196.  
  197. h3{
  198. text-align:center;
  199. font-weight:normal;
  200. margin:0px 0px 75px;
  201. text-transform:uppercase;
  202. font-size:8px;
  203. letter-spacing:1px;
  204. }
  205.  
  206. .post{
  207. width:500px;
  208. background-color:white;
  209. border:0px solid black;
  210. {block:IndexPage}margin-bottom:150px;{/block:IndexPage}
  211. {block:PermalinkPage}margin-bottom:10px;{/block:PermalinkPage}
  212. }
  213.  
  214. .op{
  215. {block:IndexPage}opacity:1;{/block:IndexPage}
  216. -webkit-transition:0.5s ease-in;
  217. }
  218.  
  219. .op:hover{
  220. opacity:1;
  221. }
  222.  
  223. .post h1{
  224. text-align:center;
  225. margin:0px 0px 10px;
  226. font-size:20px;
  227. letter-spacing:-1px;
  228. font-style:italic;
  229. }
  230.  
  231. span.more{font-family:cambria !important;}
  232.  
  233. /* QUOTES */
  234.  
  235. .postquote{
  236. display:block;
  237. width:350px;
  238. margin:0px auto 20px;
  239. line-height:15px;
  240. text-align:center;
  241. font-style:italic;
  242. font-size:9px;
  243. letter-spacing:0px;
  244. word-spacing:2px;
  245. text-transform:uppercase;
  246. }
  247.  
  248. .quotesource{
  249. text-align:right;
  250. margin-top:-8px;
  251. }
  252.  
  253. .quotesource span{
  254. background-color:white;
  255. padding-left:10px;
  256. }
  257.  
  258. .quoteborder{
  259. border-bottom:3px double #f2f2f2;
  260. }
  261.  
  262. /* AUDIO POSTS */
  263.  
  264. .musicplayer{
  265. width:27px;
  266. height:27px;
  267. overflow:hidden;
  268. z-index:2;
  269. display:block;
  270. background-color:black;
  271. margin:38px 0px 0px 180px;
  272. position:absolute;
  273. opacity:1;
  274. -webkit-transition: all 0.7s ease-in-out;
  275. -moz-transition: all 0.7s ease-in-out;
  276. -o-transition: all 0.7s ease-in-out;
  277. }
  278.  
  279. .audio{
  280. position:absolute;
  281. width:398px;
  282. height:100px;
  283. background-color:black;
  284. margin-left:102px;
  285. }
  286.  
  287. .covers{
  288. width:100px;
  289. height:100px;
  290. }
  291.  
  292. .audioimg{
  293. width:100px;
  294. height:100px;
  295. position:absolute;
  296. }
  297.  
  298. .audioimg img{
  299. float:left;
  300. opacity:1;
  301. width:100px;
  302. }
  303.  
  304. .audioinfo{
  305. display:none;
  306. font-size:11px;
  307. text-transform:uppercase;
  308. margin-bottom:1px;
  309. margin-left:201px;
  310. height:65px;
  311. display:block;
  312. width:299px;
  313. text-align:center;
  314. background-color:white;
  315. padding-top:35px;
  316. letter-spacing:1px;
  317. }
  318.  
  319. /* ASK */
  320.  
  321. .question{
  322. margin-bottom:10px;
  323. background-color:black;
  324. color:white;
  325. width:480px;
  326. padding:10px;
  327. min-height:30px;
  328. }
  329.  
  330. .question img{
  331. float:left;
  332. border-right:10px solid transparent;
  333. border-bottom:5px solid transparent;
  334. }
  335.  
  336. /* POST INFO */
  337.  
  338. .postinfo{
  339. width:150px;
  340. margin-left:520px;
  341. position:absolute;
  342. padding:2px 10px 2px 7px;
  343. text-transform:uppercase;
  344. font-family:;
  345. font-size:7px;
  346. letter-spacing:1px;
  347. opacity:0;
  348. -webkit-transition:0.5s ease-in;
  349. -moz-transition:0.5s ease-in;
  350. -o-transition:0.5s ease-in;
  351. transition:0.5s ease-in;
  352. }
  353.  
  354. .post:hover .postinfo{
  355. opacity:1;
  356. }
  357.  
  358. .postinfo a.info, a:visited.info, a:active.info{
  359. color:black;
  360. }
  361.  
  362. .permainfo{
  363. text-align:right;
  364. margin-top:30px;
  365. border-top:1px solid #f2f2f2;
  366. padding-top:10px;
  367. text-transform:uppercase;
  368. font-family:;
  369. font-size:7px;
  370. letter-spacing:1px;
  371. line-height:10px;
  372. margin-bottom:60px;
  373. }
  374.  
  375. .tags{
  376. margin-top:5px;
  377. {block:IndexPage}text-align:left;font-size:8px;{/block:IndexPage}
  378. {block:PermalinkPage}text-align:right;font-size:8px;text-transform:uppercase;letter-spacing:0px;{/block:PermalinkPage}
  379. }
  380.  
  381. .tags a.tags, a:visited.tags, a:active.tags{
  382. color:black;
  383. {block:IndexPage}display:block;margin:2px 0px 2px;{/block:IndexPage}
  384. {block:PermalinkPage}margin:0px 0px 0px 10px;{/block:PermalinkPage}
  385. }
  386.  
  387. .tags a:hover.tags{
  388. color:{color:links};
  389. }
  390.  
  391. ol.notes{list-style-type:none;width:500px;margin-left:-40px;font-size:8px;text-transform:uppercase;line-height:10px;}
  392. ol.notes li.note{padding:5px;width:490px;margin-bottom:7px;border-bottom:1px solid #f2f2f2;padding-bottom:10px;}
  393. ol.notes li.note img.avatar{height:15px;float:left;margin-top:-3px;}
  394. ol.notes li.note span.action{margin-left:10px;}
  395. ol.notes li.note blockquote{border-left:2px solid #202020;padding-left:5px;margin-left:35px;}
  396.  
  397. #theme{
  398. position:fixed;
  399. bottom:10px;
  400. right:10px;
  401. -webkit-border-radius:100px;
  402. padding:3px 4px 2px;
  403. text-transform:uppercase;
  404. -webkit-transition:0.6s ease-in;
  405. cursor:default;
  406. font-size:8px;
  407. }
  408.  
  409. #theme:hover{
  410. background-color:{color:links};
  411. color:white;
  412. }
  413.  
  414. </style>
  415. <body><div id="con">
  416.  
  417. <div class=”source”>{block:ContentSource}<a href=”{SourceURL}”>{lang:Source}:{block:SourceLogo}
  418. <img src=”{BlackLogoURL}” width=”{LogoWidth}” height=”{LogoHeight}” alt=”{SourceTitle}” />
  419. {/block:SourceLogo}{block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo}</a>
  420. {/block:ContentSource}</div>
  421.  
  422. <div id="header">. <div class="w">
  423.  
  424. <table style="width:100%;"><tr>
  425. <td style="{block:iftitlebackgroundwhite}background-color:white;{/block:iftitlebackgroundwhite}height:40px"> <div class="h">{title}</div> </td>
  426. <td style="background-color:white"> <div class="box">{description}</div> </td>
  427. </tr></table>
  428.  
  429. <div class="bottom">
  430. <a href="/">home</a>
  431. <a href="/ask">message</a>
  432. {block:iflink1}<a href="{text:link1url}">{text:link1}</a>{/block:iflink1}
  433. {block:iflink2}<a href="{text:link2url}">{text:link2}</a>{/block:iflink2}
  434. {block:iflink3}<a href="{text:link3url}">{text:link3}</a>{/block:iflink3}
  435. {block:iflink4}<a href="{text:link4url}">{text:link4}</a>{/block:iflink4}
  436. </div>
  437.  
  438. </div></div>
  439.  
  440. {block:TagPage}
  441. <h3>{block:Pagination}{TotalPages} pages of {/block:Pagination}posts tagged with <u>{Tag}</u></h3>
  442. {/block:TagPage}
  443.  
  444. {block:Posts}
  445.  
  446. <div class="post">
  447.  
  448.  
  449.  
  450.  
  451. {block:Quote}
  452. <div class="postquote">{Quote}</div>
  453. {block:Source}<div class="quoteborder"> </div>
  454. <div class="quotesource"><span>{Source}</span></div>{/block:Source}
  455. {/block:Quote}
  456.  
  457. {block:Photo}
  458. <div class="op"><a href="{block:IndexPage}{Permalink}{/block:IndexPage}{block:PermalinkPage}{PhotoURL-HighRes}{/block:PermalinkPage}"><img src="{PhotoURL-500}" /></a></div>
  459. {Caption}
  460. {/block:Photo}
  461.  
  462. {block:Photoset}
  463. <div class="op">{Photoset-500}</a></div>
  464. {Caption}
  465. {/block:Photoset}
  466.  
  467. {block:Link}
  468. <h2><a href="{url}">{name}</a></h2>{block:Description}{Description}{/block:Description}
  469. {/block:Link}
  470.  
  471. {block:Chat}
  472. {block:Title}<h2>{Title}</h2>{/block:Title}
  473. {block:Lines}<div style="margin-bottom:4px;">{block:Label}<span style="text-transform: uppercase; font-family:'playfair display'; font-size:8px;"> {Label}</span>{/block:Label}&nbsp;&nbsp;{Line}<br></div>{/block:Lines}
  474. {/block:Chat}
  475.  
  476. {block:Audio}
  477. <div class="audio"><div class="musicplayer">{AudioPlayerBlack}</div></div>
  478. <div class="covers"><div class="audioimg"><img src="http://static.tumblr.com/jn9hrij/20Ul2zzsr/albumart.jpg"></div>{block:AlbumArt}<div class="audioimg"><img src="{AlbumArtURL}"></div>{/block:AlbumArt}</div>
  479. {Caption}
  480. {/block:Audio}
  481.  
  482. {block:Text}
  483. {block:Title}<h2>{Title}</h2>{/block:Title}{Body}{block:More}<a href="{Permalink}">More <span class="more">→</span></a>{/block:More}
  484. {/block:Text}
  485.  
  486. {block:Video}
  487. {Video-500}
  488. {Caption}
  489. {/block:Video}
  490.  
  491. {block:Answer}
  492. <div class="question"><a href="{AskerURL}"><img src="{AskerPortraitURL-30}" /></a>
  493. {Question}</div>
  494.  
  495. {Answer}
  496. {/block:Answer}
  497.  
  498. {block:IndexPage}{block:Date}<div style="margin-top:25px;opacity:0.8;text-transform:uppercase;font-size:8px;">
  499. <a style="color:black" href="{Permalink}">{TimeAgo}{block:NoteCount}&nbsp; ∙ &nbsp;{NoteCount}{/block:NoteCount}</a>
  500.  
  501. {block:HasTags}<br>{block:Tags}<a style="color:black;margin-right:10px" href="{TagURL}">{Tag}</a>{/block:Tags}{/block:HasTags}
  502. </div>{/block:Date}{/block:IndexPage}
  503.  
  504. </div>
  505.  
  506. {block:PermalinkPage}
  507.  
  508. {block:Date}<div class="permainfo">
  509.  
  510. {Month} {DayOfMonth}{DayOfMonthSuffix}, {Year}&nbsp; ∙ &nbsp;{12Hour}:{Minutes}{AmPm}{block:NoteCount}&nbsp; ∙ &nbsp;{NoteCountWithLabel}{/block:NoteCount}<br />
  511.  
  512. {block:RebloggedFrom}via <a href="{ReblogParentURL}">{ReblogParentName}</a>&nbsp; ∙ &nbsp;from <a href="{ReblogRootURL}">{ReblogRootName}</a>{block:ContentSource}&nbsp; ∙ &nbsp;<a title="{SourceTitle}" href="{SourceURL}">{block:NoSourceLogo}©{/block:NoSourceLogo}{block:SourceLogo}<img src="{BlackLogoURL}" width="{LogoWidth}" height="{LogoHeight}" />{/block:SourceLogo}</a>{/block:ContentSource}
  513. {/block:RebloggedFrom}
  514.  
  515. {block:HasTags}<div class="tags">{block:Tags}<a class="tags" href="{TagURL}">{Tag}</a>{/block:Tags}</div>{/block:HasTags}
  516.  
  517. </div>{/block:Date}
  518.  
  519. {block:PostNotes}{PostNotes}{/block:PostNotes}
  520. {/block:PermalinkPage}
  521.  
  522. {/block:Posts}
  523.  
  524. {block:Pagination}
  525. <div class="pagination">
  526. {block:PreviousPage}<a class="arrow" href="{PreviousPage}">←</a>{/block:PreviousPage}
  527. {block:JumpPagination length="5"}
  528. {block:CurrentPage}<span class="current">{PageNumber}</span>{/block:CurrentPage}
  529. {block:JumpPage}<a class="page" href="{URL}">{PageNumber}</a>{/block:JumpPage}{/block:JumpPagination}
  530. {block:NextPage}<a class="arrow" href="{NextPage}">→</a>{/block:NextPage}
  531. {/block:Pagination}
  532.  
  533. </div>
  534.  
  535. <a href="http://crimical.tumblr.com/"><div id="theme">t.</div></a>
  536.  
  537. </div></body>
  538. </html>
Advertisement
Add Comment
Please, Sign In to add comment