Advertisement
bakerrstreet

Theme no.2 (Sweet Reactor)

May 28th, 2012
1,715
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 13.30 KB | None | 0 0
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="utf-8" />
  5. <title>{Title}</title>
  6. <link rel="shortcut icon" href="{Favicon}">
  7. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  8. {block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}
  9.  
  10.  
  11. <!--CUSTOMIZABLE-->
  12. <meta name="color:background" content="#f8f4d7"/>
  13. <meta name="color:post" content="#f5d0bd"/>
  14. <meta name="color:tags" content="#fcdece"/>
  15. <meta name="color:tags bg" content="#fafafa"/>
  16. <meta name="color:text" content="#b49999"/>
  17. <meta name="color:link" content="#9e7676"/>
  18. <meta name="color:link hover" content="#000000"/>
  19. <meta name="color:sidebar" content="#f5d0bd"/>
  20. <meta name="color:description" content="#f8f8f8"/>
  21. <meta name="color:border" content="#ec9a85"/>
  22. <meta name="color:side links" content="#3a3938"/>
  23. <meta name="color:main links" content="#f1edcd"/>
  24. <meta name="color:link1" content="#f4e5e1"/>
  25. <meta name="color:link2" content="#ec9a85"/>
  26. <meta name="color:link3" content="#f5c285"/>
  27. <meta name="color:link4" content="#f5d0bd"/>
  28. <meta name="color:scrollbar" content="#f0c9b8"/>
  29. <meta name="color:scrollbg" content="#ebe5cf"/>
  30. <!--image-->
  31. <meta name="image:background" content=""/>
  32. <meta name="image:sidebar" content=""/>
  33. <!--text-->
  34. <meta name="text:Link1 Url" content="" />
  35. <meta name="text:Link1 Title" content="" />
  36. <meta name="text:Link2 Url" content="" />
  37. <meta name="text:Link2 Title" content="" />
  38. <meta name="text:Link3 Url" content="" />
  39. <meta name="text:Link3 Title" content="" />
  40. <meta name="if:SidebarBorder" content="1">
  41.  
  42.  
  43. <link rel="stylesheet" type="text/css" href="http://fonts.googleapis.com/css?family=Dawning+of+a+New+Day">
  44. <link rel="stylesheet" type="text/css" href="http://fonts.googleapis.com/css?family=Gloria+Hallelujah">
  45. <style type="text/css">
  46. ::-webkit-scrollbar {width: 10px; height:auto; background:{color:scrollbg}}
  47. ::-webkit-scrollbar-corner {background:{color:scrollbg}}
  48. ::-webkit-scrollbar-button:vertical {height:4px; display: block; background:{color:scrollbar}}
  49. ::-webkit-scrollbar-button:horizontal {width: 7px; height: 4px; display: block; background:{color:scrollbar}}
  50. ::-webkit-scrollbar-thumb:vertical {background:{color:scrollbar}; border-top: 1px solid {color:scrollbg}; border-bottom: 1px solid {color:scrollbg}}
  51. ::-webkit-scrollbar-thumb:horizontal {background: {color:scrollbg}; border: 0px solid {color:scrollbg}}
  52. ::-webkit-scrollbar-thumb {background: {color:scrollbar}; border-top: 0pt solid {color:scrollbg}; border-bottom: 0pt solid {color:scrollbg}}
  53. ::-webkit-scrollbar-thumb:hover {background: {color:scrollbar}; cursor:url(http://i53.tinypic.com/zycxmw.png), auto}
  54. ::-webkit-scrollbar-track-piece {background: {color:scrollbg}; border-top: 1pt solid {color:scrollbg}; border-bottom: 1pt solid {color:scrollbg}; width:4pt;}
  55.  
  56.  
  57. body {
  58. font-family: 'helvetica neue', 'helvetica', arial;
  59. font-size:10px;
  60. color: {color:text};
  61. background-color:{color:background};
  62. background-image:url({image:Background});
  63. background-position:center top;
  64. background-repeat: repeat;
  65. background-attachment:fixed;
  66. }
  67.  
  68. a, a:active, a:visited{color:{color:link}; text-decoration: none; -webkit-transition: all 0.2s linear; -moz-transition: all 0.2s linear; transition: all 0.2s linear;}
  69. a:hover { color:{color:link hover};-webkit-transition: all 0.2s linear; -moz-transition: all 0.2s linear; transition: all 0.2s linear;}
  70. blockquote{padding:0px 5px 0px 10px; margin:0px; border-left:2px solid {color:border};}
  71. blockquote img{display:block; max-width:250px;}
  72. blockquote blockquote{position:relative; left:6px; margin:-5px; padding:0px 5px 0px 10px}
  73. b, strong{color: {color:links};}
  74.  
  75. #entry {
  76. width:500px;
  77. left:600px;
  78. position:absolute;
  79. top: 20px;
  80. font-style:;
  81. bo
  82.  
  83. }
  84.  
  85. #post {
  86. line-height:9px;
  87. width:500px;
  88. padding:10px;
  89. text-align:justify;
  90. background-color:{color:post};
  91. margin-bottom:0px;
  92. }
  93.  
  94.  
  95. #notes {
  96. text-align:center;
  97. font-size:8px;
  98. width:80px;
  99. height:30px;
  100. position:absolute;
  101. right:-120px;
  102. padding:10px;
  103. font-family: 'Gloria Hallelujah';
  104. opacity:0;
  105. transition: all 0.7s ease-in-out 0s; -webkit-transition: all 0.7s ease-in-out 0s; -moz-transition: all 0.7s ease-in-out 0s; -o-transition: all 0.7s ease-in-out 0s; box-transition: all 0.7s ease-in-out 0s;
  106. }
  107.  
  108. #post:hover #notes {opacity:1; transition: all 0.7s ease-in-out 0s; -webkit-transition: all 0.7s ease-in-out 0s; -moz-transition: all 0.7s ease-in-out 0s; -o-transition: all 0.7s ease-in-out 0s; box-transition: all 0.7s ease-in-out 0s;}
  109.  
  110. #post .title{
  111. text-align:center;
  112. letter-spacing: 2;
  113. color: {color:title};
  114. font-size: 25px;
  115. line-height: 23px;
  116. font-family: 'bebas';
  117. }
  118.  
  119. #tags {
  120. color:{color:tags};
  121. width:500px;
  122. height:auto;
  123. padding:5px 10px;
  124. font-size:8px;
  125. line-height:9px;
  126. margin-bottom:20px;
  127. background-color:{color:tags bg};
  128. }
  129.  
  130. #tags a {color:{color:tags}; margin-right:5px;}
  131.  
  132. #sidebar {
  133. width:230px;
  134. height:230px;
  135. position:fixed;
  136. left:300px;
  137. top:200px;
  138. border-radius: 250px;
  139. -moz-border-radius: 250px;
  140. -o-border-radius: 250px;
  141. box-border-radius: 250px;
  142. overflow:hidden;
  143. background-color:{color:sidebar};
  144. text-align:center;
  145. padding: 10px;
  146. }
  147.  
  148. #description {
  149. width:220px;
  150. height:220px;
  151. line-height:10px;
  152. position: relative;
  153. overflow:hidden;
  154. {block:IfSidebarBorder}
  155. border: 5px dashed {color:border};
  156. {/block:IfSidebarBorder}
  157. {block:IfNotSidebarBorder}
  158. border: 5px dashed {color:sidebar};
  159. {/block:IfNotSidebarBorder}
  160. text-align:center;
  161. border-radius: 250px;
  162. -moz-border-radius: 250px;
  163. -o-border-radius: 250px;
  164. box-border-radius: 250px;
  165.  
  166. }
  167.  
  168. #description .description {
  169. width: 200px;
  170. height:120px;
  171. position:absolute;
  172. top:0px;
  173. left:0px;
  174. padding: 50px 10px;
  175. text-align:center;
  176. opacity:0;
  177. background-color:{color:description};
  178. border-radius: 250px;
  179. -moz-border-radius: 250px;
  180. -o-border-radius: 250px;
  181. box-border-radius: 250px; transition: all 0.7s ease-in-out 0s; -webkit-transition: all 0.7s ease-in-out 0s; -moz-transition: all 0.7s ease-in-out 0s; -o-transition: all 0.7s ease-in-out 0s; box-transition: all 0.7s ease-in-out 0s;
  182. }
  183.  
  184. #description:hover .description {
  185. opacity:0.8;transition: all 0.7s ease-in-out 0s; -webkit-transition: all 0.7s ease-in-out 0s; -moz-transition: all 0.7s ease-in-out 0s; -o-transition: all 0.7s ease-in-out 0s; box-transition: all 0.7s ease-in-out 0s;}
  186.  
  187. #description .picture {
  188. width:220px;
  189. height:220px;
  190. position:absolute;
  191. top:0px;
  192. left:0px;
  193. overflow:hidden;
  194. border-radius: 250px;
  195. -moz-border-radius: 250px;
  196. -o-border-radius: 250px;
  197. box-border-radius: 250px;
  198. }
  199.  
  200. #description .picture img {
  201. border-radius: 250px;
  202. -moz-border-radius: 250px;
  203. -o-border-radius: 250px;
  204. box-border-radius: 250px;
  205. }
  206.  
  207. #link {
  208. width:250px;
  209. height:30px;
  210. position: fixed;
  211. top:475px;
  212. left:300px;
  213. background-color: {color:main links};
  214. }
  215. #link .link {
  216. width:25px;
  217. float:right;
  218. height:30px;
  219. text-align:center;
  220. transition: all 0.7s ease-in-out 0s; -webkit-transition: all 0.7s ease-in-out 0s; -moz-transition: all 0.7s ease-in-out 0s; -o-transition: all 0.7s ease-in-out 0s; box-transition: all 0.7s ease-in-out 0s;
  221. }
  222.  
  223. #link .link:hover {width:100px; transition: all 0.7s ease-in-out 0s; -webkit-transition: all 0.7s ease-in-out 0s; -moz-transition: all 0.7s ease-in-out 0s; -o-transition: all 0.7s ease-in-out 0s; box-transition: all 0.7s ease-in-out 0s;}
  224. #link .link:hover .text {opacity:1; transition: all 0.7s ease-in-out 0s; -webkit-transition: all 0.7s ease-in-out 0s; -moz-transition: all 0.7s ease-in-out 0s; -o-transition: all 0.7s ease-in-out 0s; box-transition: all 0.7s ease-in-out 0s;}
  225.  
  226. #link .text {
  227. color:{color:side links};
  228. font-size:14px;
  229. font-family: 'Gloria Hallelujah';
  230. opacity:0;
  231. bottom:5px;
  232. transition: all 0.7s ease-in-out 0s; -webkit-transition: all 0.7s ease-in-out 0s; -moz-transition: all 0.7s ease-in-out 0s; -o-transition: all 0.7s ease-in-out 0s; box-transition: all 0.7s ease-in-out 0s;
  233. }
  234.  
  235.  
  236.  
  237. #askbox {
  238. color:{color:link};
  239. position:relative;
  240. width:480px;
  241. height:auto;
  242. padding:10px 10px 0px 10px;
  243. background-color:{color:tags bg};
  244. border-radius: 20px;
  245. -moz-border-radius: 20px;
  246. -o-border-radius: 20px;
  247. box-border-radius: 20px;
  248. }
  249.  
  250. #askbox .asker {
  251. width:440px;
  252. height:35px;
  253. font-size:25px;
  254. padding: 10px 10px 0px 10px;
  255. position:relative;
  256. margin-bottom:0px;
  257. font-family: 'Dawning of a New Day';
  258. }
  259.  
  260.  
  261. #askbox .question {
  262. width:460px;
  263. position:relative;
  264. height:auto;
  265. text-align:center;
  266. padding:10px;
  267. margin-top:-10px;
  268. border-top:1px solid {color:border};
  269. }
  270.  
  271. #askbox .icon {
  272. position:absolute;
  273. height:25px;
  274. width:25px;
  275. top:10px;
  276. right:20px;
  277. }
  278.  
  279. .audio img {
  280. width: 40px;
  281. height: 40px;
  282. float: left;
  283. margin-right: 5px;
  284. }
  285.  
  286. .player {
  287. background-color: #fff;
  288. height: 27px;
  289. margin-left: 45px;
  290. }
  291.  
  292. @font-face {
  293. font-family: "bebas";
  294. src: url('http://static.tumblr.com/rmj06l2/N0vlwxkt8/bebaslp.otf');
  295. }
  296.  
  297. #navigation {
  298. width:auto;
  299. height:auto;
  300. position:fixed;
  301. top:520px;
  302. left:420px;
  303. font-size:18px;
  304. }
  305.  
  306. </style>
  307. </head>
  308. <body>
  309. <div id="sidebar">
  310. <div id="description">
  311. <div class="picture"><img src="{image:sidebar}"></div>
  312. <div class="description">{block:Description}{Description}{/block:Description}</div>
  313. </div>
  314. </div>
  315.  
  316. <div id="link">
  317. <!--If you want to add new links, put it here at the top of the rest. Just copy one line and paste it on top.-->
  318. <div class="link" style="background-color:{color:link1}"><a href="{text:Link3 Url}" class="text">{text:Link3 Title}</a></div>
  319. <div class="link" style="background-color:{color:link4}"><a href="{text:Link2 Url}" class="text">{text:Link2 Title}</a></div>
  320. <div class="link" style="background-color:{color:link3}"><a href="{text:Link1 Url}" class="text">{text:Link1 Title}</a></div>
  321. <div class="link" style="background-color:{color:link2}"><a href="/ask" class="text">ask</a></div>
  322. <div class="link" style="background-color:{color:link1}"><a href="/" class="text">home</a></div>
  323. </div>
  324. <div id="navigation">
  325. {block:PreviousPage}<a href="{PreviousPage}">Β«</a>{/block:PreviousPage}
  326. {block:NextPage}<a href="{NextPage}">Β»</a>{/block:NextPage}
  327. </div>
  328.  
  329. <div id="entry">
  330. {block:Posts}
  331. <div id="post">
  332.  
  333. <div id="notes">
  334. {block:NoteCount}<a href="{Permalink}" style="font-size:14px;">{NoteCountWithLabel}</a>{/block:NoteCount}<br>
  335. {block:RebloggedFrom}<a href="{ReblogParentURL}">from</a> | {/block:RebloggedFrom}{block:ContentSource}<a href="{SourceURL}">originally</a>{/block:ContentSource}
  336. </div>
  337.  
  338. <!--TITLE-->
  339. {block:Title}<div class="title">{Title}</div>{/block:Title}
  340. {block:Text}{Body}{/block:Text}
  341.  
  342. <!--QUOTE-->
  343. {block:Quote}<div class="title">"{Quote}"</div>{/block:Quote}
  344. {block:Source}<div style="text-align:right; font-stlye:italic;">β€” {Source}</div>{/block:Source}
  345.  
  346. <!--LINK-->
  347. {block:Link}<a href="{URL}" class="title">{Target}{Name}&nbsp;</a>
  348. {block:Description}{Description}{/block:Description}{/block:Link}
  349.  
  350. <!--PHOTO-->
  351. {block:Photo}
  352. <img src="{PhotoURL-500}" alt="{PhotoAlt}"/>
  353. {block:Caption}{Caption}{/block:Caption}
  354. {/block:Photo}
  355.  
  356. <!--PHOTOSETS-->
  357. {block:Photoset}{Photoset-500}{block:Caption}{Caption}{/block:Caption}{/block:Photoset}
  358.  
  359. <!--CHAT-->
  360. {block:Chat}
  361. {block:Title}{Title}{/block:Title}
  362. {block:Lines}
  363. {block:Label}<b>{Label}</b>{/block:Label}
  364. {Line}<br />
  365. {/block:Lines}<br />
  366. {/block:Chat}
  367.  
  368. <!--VIDEO-->
  369. {block:Video}{Video-400}{block:Caption}{Caption}{/block:Caption}{/block:Video}
  370.  
  371. <!--AUDIO-->
  372. {block:Audio}
  373. {block:AlbumArt}
  374. <div class="audio"><img src="{AlbumArtURL}" alt=""></div>
  375. {/block:AlbumArt}
  376. <div class="player">{AudioPlayer}</div>
  377. {block:TrackName}{TrackName} - {/block:TrackName}{block:Artist}<i>{Artist}</i> | {/block:Artist}<b>{FormattedPlayCount}</b> plays
  378. {block:IfShowCaptions}{block:Caption}<br />{Caption}{/block:Caption}{/block:IfShowCaptions}
  379. {block:IfNotShowCaptions}{block:PermalinkPage}{block:Caption}<br />
  380. {Caption}
  381. {/block:Caption}{/block:PermalinkPage}{/block:IfNotShowCaptions}
  382. {/block:Audio}
  383.  
  384. <!--ANSWER-->
  385. {block:Answer}<div id="askbox">
  386. <div class="icon"><img src="{AskerPortraitURL-24}" style="border-radius: 20px; -moz-border-radius: 20px;"></div>
  387. <div class="asker">{Asker} asked:</div>
  388. <div class="question">{Question}</div>
  389. </div>
  390. {Answer}
  391. {/block:answer}
  392.  
  393. </div>
  394. <div id="tags">{block:HasTags}tags:{block:Tags}<a href="{TagUrl}">#{Tag}</a>{/block:Tags}{/block:HasTags}</div>
  395. {block:PermalinkPage}{block:PostNotes}{PostNotes}{/block:PostNotes}</div>{/block:PermalinkPage}
  396. {/block:Posts}
  397. </div>
  398.  
  399. <div style="position:fixed; bottom:5px; left:5px; font-size:10px; font-family:'Gloria Hallelujah'; text-algin:center; line-height:9px"><a href="http://bakerrstreet.tumblr.com/">theme by:<br>Shaira</a></div>
  400.  
  401. </body>
  402. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement