Advertisement
sherloeckchen

theme #12

Mar 18th, 2013
4,652
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 9.36 KB | None | 0 0
  1. <!DOCTYPE html>
  2. <html lang="en">
  3.  
  4. <head>
  5. <title>{Title}</title>
  6. <link rel="shortcut icon" href="{Favicon}" />
  7. <link rel="alternate" type="application/rss+xml" href="{RSS}" />
  8. <meta name="description" content="{MetaDescription}" />
  9.  
  10. <meta name="image:sidebar" content=""/>
  11. <meta name="color:links" content=""/>
  12. <meta name="if:sidebartop" content=""/>
  13. <meta name="if:sidebarbottom" content="1"/>
  14. <meta name="color:sidebarfont" content="#ffffff"/>
  15. <meta name="text:link1" content=""/>
  16. <meta name="text:link1url" content="/"/>
  17. <meta name="text:link2" content=""/>
  18. <meta name="text:link2url" content="/"/>
  19. <meta name="text:link3" content=""/>
  20. <meta name="text:link3url" content="/"/>
  21.  
  22. <style type="text/css">
  23.  
  24. ::-webkit-scrollbar-thumb:vertical{
  25. background-color:black;
  26. }
  27.  
  28. ::-webkit-scrollbar-thumb:horizontal{
  29. background-color:black;
  30. }
  31.  
  32. ::-webkit-scrollbar{
  33. height:4px;
  34. width:4px;
  35. background-color:white;
  36. }
  37.  
  38. body{
  39. background-color:white;
  40. font-family:times, serif;
  41. font-size:10px;
  42. letter-spacing:0px;
  43. color:black;
  44. text-align:justify;
  45. }
  46.  
  47. a, a:active, a:visited{
  48. text-decoration:none;
  49. -webkit-transition:0.5s ease-in;
  50. color:{color:links};
  51. }
  52.  
  53. a:hover{
  54. color:black;
  55. }
  56.  
  57. /* sidebar */
  58.  
  59. #side{
  60. opacity:0.9;
  61. width:220px;
  62. position:fixed;
  63. top:0px;
  64. bottom:0px;
  65. left:80px;
  66. background-image:url('{image:sidebar}');
  67. background-position:bottom;
  68. background-repeat:no-repeat;
  69. }
  70.  
  71. .con{
  72. {block:ifsidebarbottom}bottom:30px;{/block:ifsidebarbottom}
  73. {block:ifsidebartop}top:50px;{/block:ifsidebartop}
  74. color:{color:sidebarfont};
  75. width:180px;
  76. position:fixed;
  77. margin-left:20px;
  78. text-align:center;
  79. }
  80.  
  81. .con a{
  82. color:{color:sidebarfont};
  83. }
  84.  
  85. .con h1{
  86. font-style:italic;
  87. font-size:11px;
  88. font-weight:normal;
  89. letter-spacing:1px;
  90. margin-bottom:15px;
  91. text-transform:uppercase;
  92. }
  93.  
  94. .con .links{
  95. margin-bottom:10px;
  96. font-size:7px;
  97. letter-spacing:1px;
  98. text-transform:uppercase;
  99. }
  100.  
  101. .con .links a{
  102. margin:0px 5px 0px;
  103. }
  104.  
  105. .con .links a:hover{
  106. color:transparent;
  107. }
  108.  
  109. /* posts */
  110.  
  111. #posts{
  112. width:500px;
  113. margin:80px 0px 60px 500px;
  114. }
  115.  
  116. .post{
  117. width:500px;
  118. margin-bottom:90px;
  119. }
  120.  
  121. .post h1{
  122. text-align:center;
  123. font-size:10px;
  124. font-family:cambria;
  125. text-transform:uppercase;
  126. font-weight:normal;
  127. }
  128.  
  129. span.more{font-family:cambria !important;}
  130.  
  131. /* QUOTES */
  132.  
  133. .postquote{
  134. padding:10px;
  135. display:block;
  136. height:auto;
  137. width:300px;
  138. margin:0px auto 0px;
  139. line-height:15px;
  140. text-align:center;
  141. text-transform:uppercase;
  142. font-size:9px;
  143. letter-spacing:1px;
  144. }
  145.  
  146. /* AUDIO POSTS */
  147.  
  148. .musicplayer{
  149. width:27px;
  150. height:27px;
  151. overflow:hidden;
  152. z-index:2;
  153. display:block;
  154. background-color:black;
  155. margin:38px 0px 0px 180px;
  156. position:absolute;
  157. opacity:1;
  158. -webkit-transition: all 0.7s ease-in-out;
  159. -moz-transition: all 0.7s ease-in-out;
  160. -o-transition: all 0.7s ease-in-out;
  161. }
  162.  
  163. .audio{
  164. position:absolute;
  165. width:398px;
  166. height:100px;
  167. background-color:black;
  168. margin-left:102px;
  169. }
  170.  
  171. .covers{
  172. width:100px;
  173. height:100px;
  174. }
  175.  
  176. .audioimg{
  177. width:100px;
  178. height:100px;
  179. position:absolute;
  180. }
  181.  
  182. .audioimg img{
  183. float:left;
  184. opacity:1;
  185. width:100px;
  186. }
  187.  
  188. .audioinfo{
  189. display:none;
  190. font-size:11px;
  191. text-transform:uppercase;
  192. margin-bottom:1px;
  193. margin-left:201px;
  194. height:65px;
  195. display:block;
  196. width:299px;
  197. text-align:center;
  198. background-color:white;
  199. padding-top:35px;
  200. letter-spacing:1px;
  201. }
  202.  
  203. /* ASK */
  204.  
  205. .question{
  206. margin-bottom:10px;
  207. background-color:black;
  208. color:white;
  209. width:480px;
  210. padding:10px;
  211. min-height:30px;
  212. }
  213.  
  214. .question img{
  215. float:left;
  216. border-right:10px solid transparent;
  217. border-bottom:5px solid transparent;
  218. }
  219.  
  220. /* info */
  221.  
  222. .perma{
  223. margin-top:15px;
  224. border-top:1px solid #f2f2f2;
  225. padding-top:7px;
  226. font-family:cambria;
  227. font-size:8px;
  228. text-transform:uppercase;
  229. text-align:right;
  230. opacity:0.8;
  231. line-height:13px;
  232. }
  233.  
  234. .perma a{
  235. color:black;
  236. }
  237.  
  238. .perma img{
  239. float:right;
  240. width:16px;
  241. margin-top:-2px;
  242. margin-left:7px;
  243. }
  244.  
  245. .via{
  246. {block:IndexPage}display:none;{/block:IndexPage}
  247. }
  248.  
  249. ol.notes{list-style-type:none;width:500px;margin-left:-40px;font-family:cambria;font-size:8px;text-transform:uppercase;line-height:10px;}
  250. ol.notes li.note{padding:5px;width:490px;margin-bottom:7px;border-bottom:1px solid #f2f2f2;padding-bottom:10px;}
  251. ol.notes li.note img.avatar{height:15px;float:left;margin-top:-3px;}
  252. ol.notes li.note span.action{margin-left:10px;}
  253. ol.notes li.note blockquote{border-left:2px solid #202020;padding-left:5px;margin-left:35px;}
  254.  
  255. #theme{
  256. position:fixed;
  257. bottom:10px;
  258. right:10px;
  259. -webkit-border-radius:100px;
  260. padding:3px 4px 2px;
  261. text-transform:uppercase;
  262. -webkit-transition:0.6s ease-in;
  263. cursor:default;
  264. font-size:8px;
  265. }
  266.  
  267. #theme:hover{
  268. background-color:{color:links};
  269. color:white;
  270. }
  271.  
  272. .pagination{
  273. text-align:center;
  274. margin-top:90px;
  275. font-size:8px;
  276. text-transform:uppercase;
  277. letter-spacing:1px;
  278. }
  279.  
  280. .pagination a{
  281. margin:0px 10px 0px;
  282. font-style:normal;
  283. color:black;
  284. }
  285.  
  286. </style>
  287.  
  288. <body>
  289.  
  290. <div class=”source”>{block:ContentSource}<a href=”{SourceURL}”>{lang:Source}:{block:SourceLogo}
  291. <img src=”{BlackLogoURL}” width=”{LogoWidth}” height=”{LogoHeight}” alt=”{SourceTitle}” />
  292. {/block:SourceLogo}{block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo}</a>
  293. {/block:ContentSource}</div>
  294.  
  295. <div id="side">
  296. <div class="con">
  297. <h1><a href="/">{title}</a></h1>
  298. <div class="links">
  299. <a href="/ask">message</a>
  300. {block:iflink1}<a href="{text:link1url}">{text:link1}</a>{/block:iflink1}
  301. {block:iflink2}<a href="{text:link2url}">{text:link2}</a>{/block:iflink2}
  302. {block:iflink3}<a href="{text:link3url}">{text:link3}</a>{/block:iflink3}
  303. </div>
  304. {description}
  305. </div>
  306. </div>
  307.  
  308.  
  309. <div id="posts">
  310.  
  311. {block:Posts}
  312. <div class="post">
  313.  
  314. {block:Quote}
  315. <div class="postquote">{Quote}</div>
  316. {block:Source}<div style="text-align:right;opacity:0.7">—{Source}</div>{/block:Source}
  317. {/block:Quote}
  318.  
  319. {block:Photo}
  320. <a href="{block:IndexPage}{Permalink}{/block:IndexPage}{block:PermalinkPage}{PhotoURL-HighRes}{/block:PermalinkPage}"><img width="500px" src="{PhotoURL-500}" /></a>
  321. {Caption}
  322. {/block:Photo}
  323.  
  324. {block:Photoset}
  325. {Photoset-500}
  326. {Caption}
  327. {/block:Photoset}
  328.  
  329. {block:Link}
  330. <h1><a href="{url}">{name}</a></h1>{block:Description}{Description}{/block:Description}
  331. {/block:Link}
  332.  
  333. {block:Chat}
  334. {block:Title}<h1>{Title}</h1>{/block:Title}
  335. {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}
  336. {/block:Chat}
  337.  
  338. {block:Audio}
  339. <div class="audio"><div class="musicplayer">{AudioPlayerBlack}</div></div>
  340. <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>
  341. {Caption}
  342. {/block:Audio}
  343.  
  344. {block:Text}
  345. {block:Title}<h1>{Title}</h1>{/block:Title}{Body}{block:More}<a href="{Permalink}">More <span class="more">→</span></a>{/block:More}
  346. {/block:Text}
  347.  
  348. {block:Video}
  349. {Video-500}
  350. {Caption}
  351. {/block:Video}
  352.  
  353. {block:Answer}
  354. <div class="question"><a href="{AskerURL}"><img src="{AskerPortraitURL-30}" /></a>
  355. {Question}</div>
  356.  
  357. {Answer}
  358. {/block:Answer}
  359.  
  360. {block:Date}<div class="perma">
  361. {block:IndexPage}
  362. <div style="float:left"><a href="{Permalink}">{NoteCount}</a></div>
  363. {block:HasTags}{block:Tags}<a style="margin-left:7px" href="{TagURL}">{Tag}</a>{/block:Tags}{/block:HasTags}
  364. {/block:IndexPage}
  365.  
  366. {block:PermalinkPage}<center>
  367. {TimeAgo}{block:NoteCount} | {NoteCountWithLabel}{/block:NoteCount}<br>
  368. {block:RebloggedFrom}via <a href="{ReblogParentURL}">{ReblogParentName}</a> | from <a href="{ReblogRootURL}">{ReblogRootName}</a>{/block:RebloggedFrom}
  369. {block:HasTags}<br>
  370. {block:Tags}<a style="margin:0px 4px 0px" href="{TagURL}">{Tag}</a>{/block:Tags}{/block:HasTags}
  371. </center>{/block:PermalinkPage}
  372. </div>{/block:Date}
  373.  
  374. </div>
  375.  
  376. {block:PermalinkPage}{PostNotes}{/block:PermalinkPage}
  377.  
  378. {/block:Posts}
  379.  
  380. {block:Pagination}
  381. <div class="pagination">
  382. {block:PreviousPage}<a href="{PreviousPage}">←</a>{/block:PreviousPage} {CurrentPage} of {TotalPages}
  383. {block:NextPage}<a href="{NextPage}">→</a>{/block:NextPage}
  384. </div>
  385. {/block:Pagination}
  386.  
  387. </div>
  388.  
  389. <a href="http://crimical.tumblr.com/"><div id="theme">t.</div></a>
  390.  
  391. </body>
  392. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement