furyofthetimelords

theme 008 light

Jan 23rd, 2013
501
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 11.09 KB | None | 0 0
  1. <!-- theme 008 by laura @furyofthetimelords don't steal, don't use as a base and leave the credit where I put it -->
  2.  
  3. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  4.  
  5. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  6.  
  7. <head>
  8.  
  9. <link href='http://fonts.googleapis.com/css?family=Dancing+Script' rel='stylesheet' type='text/css'>
  10.  
  11. <script type="text/javascript">
  12. WebFontConfig = {
  13. google: { families: [ 'Dancing+Script::latin' ] }
  14. };
  15. (function() {
  16. var wf = document.createElement('script');
  17. wf.src = ('https:' == document.location.protocol ? 'https' : 'http') +
  18. '://ajax.googleapis.com/ajax/libs/webfont/1/webfont.js';
  19. wf.type = 'text/javascript';
  20. wf.async = 'true';
  21. var s = document.getElementsByTagName('script')[0];
  22. s.parentNode.insertBefore(wf, s);
  23. })(); </script>
  24.  
  25. <title>{Title}</title>
  26. <link rel="shortcut icon" href="{Favicon}">
  27. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  28.  
  29.  
  30. <meta name="color:background" content="#ffffff" />
  31. <meta name="color:navbar" content="#f7f7f7" />
  32. <meta name="color:sidebar" content="#eeeeee" />
  33. <meta name="color:description" content="#6b6c6d" />
  34. <meta name="color:text" content="#535455" />
  35. <meta name="color:link" content="#979696">
  36.  
  37. <meta name="image:sidebar img" content="" />
  38. <meta name="image:background" content="http://i50.tinypic.com/in969z.png" />
  39. <meta name="image:navbar bg" content="" />
  40.  
  41. <meta name="text:toptitle" content="" />
  42. <meta name="text:link1" content="" />
  43. <meta name="text:link1 URL" content="" />
  44. <meta name="text:link2" content="" />
  45. <meta name="text:link2 URL" content="" />
  46. <meta name="text:link3" content="" />
  47. <meta name="text:link3 URL" content="" />
  48. <meta name="text:link4" content="" />
  49. <meta name="text:link4 URL" content="" />
  50. <meta name="text:link5" content="" />
  51. <meta name="text:link5 URL" content="" />
  52. <meta name="text:link6" content="" />
  53. <meta name="text:link6 URL" content="" />
  54. <meta name="text:quote" content="" />
  55. <meta name="text:quote source" content=""/>
  56.  
  57. <style type="text/css">
  58.  
  59. @import url(http://fonts.googleapis.com/css?family=Dancing+Script);
  60.  
  61. body {
  62. background: {color:background};
  63. background-image: url('{image:background}');
  64. margin: 0;
  65. padding: 0;
  66. font-family: lucida;
  67. }
  68.  
  69. a{text-decoration:none;}
  70.  
  71.  
  72. a:link, a:active, a:visited{
  73. color:{color:link};
  74. text-decoration:none;
  75. }
  76.  
  77. a:hover{
  78. font-style:italic;
  79. color:{color:text};
  80. }
  81.  
  82. blockquote {
  83. border-left: 1px dashed {color:link};
  84. padding-left:3px;
  85. }
  86.  
  87.  
  88. #title {
  89. font-family:Dancing Script;
  90. color:{color:text};
  91. font-size:30px;
  92. font-style:bold;
  93. text-align:center;
  94. text-decoration:none;
  95. margin-bottom:10px;
  96. }
  97.  
  98. #subtitle {
  99. font-family:lucida;
  100. font-style:italic;
  101. text-transform:uppercase;
  102. font-size:10px;
  103. letter-spacing:3px;
  104. }
  105.  
  106. #quote {
  107. font-style:italic;
  108. font-size:10px;
  109. font-family:lucida;
  110. text-align:center;
  111. color:{color:description};
  112. }
  113.  
  114. #sidebar {
  115. position:fixed;
  116. height:100%;
  117. margin-left:300px;
  118. width:150px;
  119. padding:10px;
  120. padding-top:200px;
  121. background-color:{color:sidebar};
  122. }
  123.  
  124. #sidebar2 {
  125. position:fixed;
  126. height:100%;
  127. margin-left:0px;
  128. width:300px;
  129. padding-top:300px;
  130. padding-left:5px;
  131. background-color:{color:navbar};
  132. background-image: url('{image:navbar bg}');
  133. background-attachment:fixed;
  134. background-position:top left;
  135. background-repeat:no-repeat;
  136. }
  137.  
  138. .nav a{
  139. display:inline-block;
  140. color:{color:link};
  141. margin-bottom:5px;
  142. margin-left:30px;
  143. width:200px;
  144. height:10px;
  145. padding:20px;
  146. font-size:10px;
  147. text-align:center;
  148. background-color:{color:sidebar};
  149. text-transform:uppercase;
  150. transition-duration: 0.8s;
  151. -moz-transition-duration: 0.8s;
  152. -webkit-transition-duration: 0.8s;
  153. -o-transition-duration: 0.8s;
  154. }
  155.  
  156. .nav a:hover{
  157. color:{color:text};
  158. background-color:{color:navbar};
  159. }
  160.  
  161. .xtra a{
  162. display:inline-block;
  163. margin-bottom:7px;
  164. margin-left:3px;
  165. margin-top:10px;
  166. font-size:10px;
  167. height:10px;
  168. padding:3px;
  169. background-color:{color:navbar};
  170. color:{color:link};
  171. text-transform:uppercase;
  172. transition-duration: 0.8s;
  173. -moz-transition-duration: 0.8s;
  174. -webkit-transition-duration: 0.8s;
  175. -o-transition-duration: 0.8s;
  176. }
  177.  
  178. .xtra a:hover{
  179. background-color:{color:sidebar};
  180. color:{color:text};
  181. font-style:normal;
  182. margin-left:3px;
  183. font-size:10px;
  184. }
  185.  
  186. #sidebarpic img {
  187. margin-top:10px;
  188. margin-bottom:20px;
  189. width:100px;
  190. height:100px;;
  191. text-align:center;
  192. -moz-border-radius:50px;
  193. border-radius:50px;
  194. -o-border-radius:50px;
  195. -webkit-border-radius:50px;
  196. }
  197.  
  198. #description {
  199. width: 150px;
  200. font-size:11px;
  201. text-align:center;
  202. color:{color:description};
  203. font-family:{font:description};
  204. margin-bottom:10px;
  205. }
  206.  
  207. .icon img {
  208. border-radius:15px;
  209. -moz-border-radius:15px;
  210. -webkit-border-radius:15px;
  211. -o-border-radius:15px;
  212. padding-right:3px;
  213. float:left;
  214. margin-left:5px;
  215. }
  216.  
  217. #qtext {
  218. float:left;
  219. padding:5px;
  220. width:500px;
  221. background-color:{color:navbar};
  222. padding-left:5px;
  223. }
  224.  
  225.  
  226. #titlep {
  227. font-family:Dancing Script;
  228. color:{color:text};
  229. font-size:30px;
  230. text-align:center;
  231. text-decoration:none;
  232. margin-bottom:10px;
  233. }
  234.  
  235. #titleq {
  236. font-family:Dancing Script;
  237. color:{color:text};
  238. font-size:30px;
  239. font-style:italic;
  240. text-align:center;
  241. text-decoration:none;
  242. margin-bottom:10px;
  243. }
  244.  
  245. .titlel a{
  246. font-family:Dancing Script;
  247. font-size:30px;
  248. text-align:center;
  249. color:{color:link};
  250. }
  251.  
  252. .titlel a:hover{
  253. color:{color:text};
  254. }
  255.  
  256. #audiodesc {
  257. font-family:arial;
  258. background-color:{color:sidebar};
  259. padding:5px;
  260. float:right;
  261. margin-right:250px;
  262. }
  263.  
  264. #audioplayer {
  265. width:30px;
  266. height:30px;
  267. overflow:hidden;
  268. opacity: 0.7;
  269. filter:alpha(opacity=70);
  270. -moz-opacity: 0.7;
  271. -khtml-opacity: 0.7;
  272. position:absolute;
  273. margin-top:40px;
  274. margin-bottom:40px;
  275. margin-left:40px;
  276. margin-right:40px;
  277. }
  278.  
  279. #info {
  280. display:block;
  281. padding:5px;
  282. border-top: 1px dashed {color:link};
  283. background-color:{color:sidebar};
  284. width:500px;
  285. }
  286.  
  287. #entry {
  288. font-size:10px;
  289. margin-right: 150px;
  290. margin-top:40px;
  291. float: right;
  292. text-align: center;
  293. width:500px;
  294. }
  295.  
  296. #post {
  297. font-size:10px;
  298. padding: 5px;
  299. width: 500px;
  300. color:{color:text};
  301. text-align: justify;
  302. }
  303.  
  304. {CustomCSS}
  305. </style>
  306.  
  307. <style> .my-like { cursor:pointer; display:inline-block; vertical-align:top; } .my-liked, .my-like:hover { color: red; cursor:pointer; display:inline-block; vertical-align:top; } </style> <script> window.onload = function () { document.body.insertAdjacentHTML( 'beforeEnd', '<iframe id="my-like-frame" style="display:none;"></iframe>' ); document.addEventListener( 'click', function ( event ) { var myLike = event.target; if( myLike.className.indexOf( 'my-like' ) > -1 ) { var frame = document.getElementById( 'my-like-frame' ), liked = ( myLike.className == 'my-liked' ), command = liked ? 'unlike' : 'like', reblog = myLike.getAttribute( 'data-reblog' ), id = myLike.getAttribute( 'data-id' ), oauth = reblog.slice( -8 ); frame.src = 'http://www.tumblr.com/' + command + '/' + oauth + '?id=' + id; liked ? myLike.className = 'my-like' : myLike.className = 'my-liked'; }; }, false ); }; </script>
  308.  
  309. </head>
  310.  
  311. <body>
  312.  
  313. <div id="sidebar">
  314. <center>
  315. <div id="sidebarpic"><a href="/"><img src="{image:sidebar img}"/></a></div>
  316. <div id="description">{block:Description}{Description}{/block:Description}</div>
  317. <center>
  318. {block:PreviousPage}<a href="{PreviousPage}"><font-size="12">«</font></a>{/block:PreviousPage} {block:NextPage} <a href="{NextPage}"><font-size="12">»</font></a>{/block:NextPage}
  319. <div class="xtra">{block:ifLink1}<a href="{text:link1 URL}">{text:link1}</a>{/block:ifLink1} {block:ifLink2}<a href="{text:link2 URL}">{text:link2}</a>{/block:ifLink2} {block:ifLink3}<a href="{text:link3 URL}">{text:link3}</a>{/block:ifLink3} {block:ifLink4}<a href="{text:link4 URL}">{text:link4}</a>{/block:ifLink4} {block:ifLink5}<a href="{text:link5 URL}">{text:link5}</a>{/block:ifLink5} {block:ifLink6}<a href="{text:link6 URL}">{text:link6}</a>{/block:ifLink6}</div>
  320. </center>
  321. {block:ifQuote}<div id="quote"><p>{text:quote}<br><strong>-- {text:quote source}</strong></p</div>{/block:ifQuote}
  322. </div>
  323. </div>
  324. <div id="sidebar2">
  325. <div id="subtitle">{text:toptitle}</div>
  326. <div id="title">{Title}</div></center>
  327. <div class="nav">
  328. <a href="/">home</a>
  329. <a href="/ask">ask</a>
  330. <a href="/archive">past</a>
  331. <a href="http://furyofthetimelords.tumblr.com">credit</a>
  332. </div>
  333. </div>
  334.  
  335.  
  336.  
  337. <div id="entry">
  338. {block:Posts}
  339. <div id="post">
  340.  
  341. {block:Text}
  342. <div id="titlep">{Title}</div>
  343. {Body}
  344. {/block:Text}
  345.  
  346. {block:Quote}<div id="titleq">“{Quote}”</div> <h2>— {Source}</h2>{/block:Quote}
  347.  
  348. {block:Link}<a href="{URL}" class="link" {Target}> <div id="titlep">{Name}</div></a>
  349. {block:Description}<P>{Description}</p>{/block:Description}{/block:Link}
  350.  
  351. {block:Photo}<center>{LinkOpenTag}<img src="{PhotoURL-500}" alt="{PhotoAlt}"/>{LinkCloseTag}</center>{block:Caption}{Caption}{/block:Caption}{/block:Photo}
  352. {block:Photoset}<center>{Photoset-500}</center>{block:Caption}{Caption}{/block:Caption}{/block:Photoset}
  353.  
  354. {block:Chat}{block:Title}<div id="titlep">{Title}</div><br>{/block:Title}{block:Lines}{block:Label}<b>{Label}</b>{/block:Label} {Line}<br>{/block:Lines}{/block:Chat}
  355. {block:Video}{Video-500}{block:Caption}{Caption}{/block:Caption}{/block:Video}
  356.  
  357. {block:Answer}
  358. <div id="qtext">
  359. <div class="icon"><img src="{AskerPortraitURL-30}"></div><b>{Asker}</b> asked:<br>
  360. {Question}</div>
  361. <br>
  362. <br>
  363. <br>
  364. {Answer}
  365. {/block:Answer}
  366.  
  367. {block:Audio}<div id= "audioplayer"><center>{AudioPlayerWhite}<center></div>
  368. {block:AlbumArt}<img src="{AlbumArtURL}" width="100">{/block:AlbumArt}<div id="audiodesc">{block:TrackName}<strong>song:</strong> {TrackName}{/block:TrackName} <br>{block:Artist}<strong>arist:</strong> {Artist}{/block:Artist} <br></strong>plays:</strong> {FormattedPlayCount}</div>
  369. {block:Caption}{Caption}{/block:Caption}{/block:Audio}
  370.  
  371. <div id="info"><a href="{Permalink}">{12Hour}:{Minutes} {CapitalAmPm} on {ShortMonth} {DayOfMonth} {Year}</a>{/block:Date}{block:NoteCount} • {NoteCount} {/block:NoteCount} • <div class="my-like" data-reblog="{ReblogURL}" data-id="{PostID}" title="Like">like</div> {block:RebloggedFrom} • <a href="{ReblogParentURL}">via</a>
  372. {block:ContentSource} / <a href="{SourceURL}">source</a>{block:ContentSource}{/block:RebloggedFrom}<br>
  373. {block:HasTags}{block:Tags}#<a href="{TagURL}">{Tag}</a> {/block:Tags}{/block:HasTags}</div></div><br>
  374. {/block:Posts}
  375.  
  376. {block:PostNotes}{PostNotes}{/block:PostNotes}
  377.  
  378. </div>
  379.  
  380. </body>
  381.  
  382. </html>
Advertisement
Add Comment
Please, Sign In to add comment