API tools faq
paste
furyofthetimelords

theme 019

furyofthetimelords
Dec 12th, 2013
221
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 11.03 KB | None | 0 0
raw download clone embed print report
  1. <!-- theme 019 by laura @furyofthetimelords. keep the credit and don't steal anything and we'll be cool -->
  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. <title>{Title}</title>
  10. <link rel="shortcut icon" href="{Favicon}">
  11. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  12.  
  13.  
  14. <meta name="color:background" content="#ffffff" />
  15. <meta name="color:post" content="#181919" />
  16. <meta name="color:sidebar" content="#1b2022" />
  17. <meta name="color:description" content="#445b63" />
  18. <meta name="color:text" content="#222e39" />
  19. <meta name="color:link" content="#5e8b99" />
  20.  
  21. <meta name="text:link1" content="" />
  22. <meta name="text:link1 URL" content="" />
  23. <meta name="text:link2" content="" />
  24. <meta name="text:link2 URL" content="" />
  25. <meta name="text:link3" content="" />
  26. <meta name="text:link3 URL" content="" />
  27.  
  28. <meta name="image:sidebar img" content="" />
  29. <meta name="image:background" content="" />
  30.  
  31. <style type="text/css">
  32.  
  33. body {
  34. background: {color:background};
  35. background-image: url('{image:background}');
  36. margin: 0;
  37. padding: 0;
  38. font-family: calibri;
  39. }
  40.  
  41. a{text-decoration:none;}
  42.  
  43. a:link, a:active, a:visited{
  44. color:{color:link};
  45. text-decoration:none;
  46. font-style:italic;
  47. transition-duration: 0.8s;
  48. -moz-transition-duration: 0.8s;
  49. -webkit-transition-duration: 0.8s;
  50. -o-transition-duration: 0.8s;
  51. }
  52.  
  53. a:hover{
  54. color:{color:text};
  55. }
  56.  
  57. blockquote {
  58. border-left:5px solid {color:post};
  59. padding-left:5px;
  60. }
  61.  
  62. small {
  63. font-size:8px;
  64. }
  65.  
  66. big {
  67. font-size:11px;
  68. }
  69.  
  70. pre {
  71. width:495px;
  72. overflow:auto;
  73. }
  74.  
  75. code {
  76. width:495px;
  77. overflow:auto;
  78. }
  79.  
  80. ::-webkit-scrollbar-thumb:vertical {background-color:{color:sidebar};height:100px;}
  81.  
  82. ::-webkit-scrollbar-thumb:horizontal {background-color:{color:sidebar};height:10px !important;}
  83.  
  84. ::-webkit-scrollbar { height:10px;width:10px; background-color:#fff;}
  85.  
  86. #title {
  87. font-family:calibri;
  88. color:{color:text};
  89. font-size:18px;
  90. font-style:italic;
  91. text-align:center;
  92. text-decoration:none;
  93. }
  94.  
  95.  
  96. #sidebar {
  97. position:fixed;
  98. margin-left:150px;
  99. height:100%;
  100. width:200px;
  101. padding:5px;
  102. background-color:{color:sidebar};
  103. }
  104.  
  105.  
  106. #sidebarpic img {
  107. margin-top:200px;
  108. margin-bottom:20px;
  109. max-width:100px;
  110. height:auto;
  111. text-align:center;
  112. border-radius:50px;
  113. -moz-border-radius:50px;
  114. -webkit-border-radius:50px;
  115. -o-border-radius:50px;
  116. }
  117.  
  118. #description {
  119. margin-bottom:2px;
  120. width: 150px;
  121. font-size:11px;
  122. padding:5px;
  123. text-align:justify;
  124. color:{color:description};
  125. background-color:{color:background};
  126. font-family:calibri;
  127. }
  128.  
  129. .linky a{
  130. display:inline-block;
  131. font-size:11px;
  132. padding:2px;
  133. background-color:{color:background};
  134. }
  135.  
  136. .linky a:hover {
  137. background-color:{color:post};
  138. }
  139.  
  140. .jump_page {
  141. padding: 2px 4px;
  142. background-color: {color:background};
  143. color:{color:post};
  144. font-family:calibri;
  145. font-size:11px;
  146. text-decoration:none;
  147. }
  148.  
  149. .current_page, .jump_page:hover {
  150. padding: 2px 4px;
  151. background-color: {color:post};
  152. color: {color:background};
  153. font-family:calibri;
  154. font-size:11px;
  155. text-decoration:none;
  156. }
  157.  
  158. .question {
  159. width:490px;
  160. padding:10px;
  161. background-color:{color:sidebar};
  162. color:{color:description};
  163. }
  164.  
  165. #player {
  166. width:40px;
  167. height:40px;
  168. overflow:hidden;
  169. position:absolute;
  170. margin-left:40px;
  171. margin-top:35px;
  172. opacity: 0.7;
  173. filter:alpha(opacity=70);
  174. -moz-opacity: 0.7;
  175. -khtml-opacity: 0.7;
  176. }
  177.  
  178. #audi img{
  179. margin-left:-100px;
  180. float:left;
  181. width:100px;
  182. height:100px;
  183. margin-right:5px;
  184. background-color:{color:border};
  185. }
  186.  
  187. #audip img{
  188. float:left;
  189. width:100px;
  190. height:100px;
  191. margin-right:5px;
  192. background-color:{color:border};
  193. }
  194.  
  195. #audiod {
  196. background-color:{color:post};
  197. width:400px;
  198. margin-left:100px;
  199. height:100px;
  200. text-transform:uppercase;
  201. font-size:15px;
  202. }
  203.  
  204. .chat ul {
  205. list-style: none;
  206. margin: 0;
  207. padding: 0;
  208. }
  209.  
  210. .chat li {
  211. color:{color:text};
  212. padding: 2px;
  213. }
  214.  
  215. .chat .odd {
  216. background-color:{color:post};
  217. color:{color:description};
  218. }
  219.  
  220. .chat .even {
  221. background-color:{color:background};
  222. }
  223.  
  224. #entry {
  225. font-size:11px;
  226. margin-right: 290px;
  227. margin-top:40px;
  228. float: right;
  229. text-align: justify;
  230. font-family:arial;
  231. width:500px;
  232. }
  233.  
  234. #post {
  235. font-size:10px;
  236. padding: 5px;
  237. width: 500px;
  238. color:{color:text};
  239. text-align: justify;
  240. }
  241.  
  242. #info {
  243. padding:2px;
  244. color:{color:description};
  245. }
  246.  
  247. #nott {
  248. display:inline-block;
  249. padding:3px;
  250. background-color:{color:post};
  251. color:{color:description};
  252. }
  253.  
  254. #fade {
  255. display: none;
  256. background: {color:post};
  257. position: fixed;
  258. left: 0;
  259. top: 0;
  260. width: 100%;
  261. height: 100%;
  262. opacity: .80;
  263. z-index: 9999;
  264. }
  265.  
  266. .popup_block{
  267. display: none;
  268. background: #FFFFFF;
  269. padding: 20px;
  270. float: left;
  271. position: fixed;
  272. top: 50%;
  273. left: 50%;
  274. z-index: 99999;
  275. }
  276.  
  277. img.btn_close {
  278. float: right;
  279. margin: -55px -55px 0 0;
  280. }
  281.  
  282. *html #fade {
  283. position: absolute;
  284. }
  285.  
  286. *html .popup_block {
  287. position: absolute;
  288. }
  289.  
  290. .terms a{
  291. display:inline-block;
  292. width:100px;
  293. padding:10px;
  294. text-transform:uppercase;
  295. background-color:{color:sidebar};
  296. }
  297.  
  298. .terms a:hover {
  299. background-color:{color:post};
  300. }
  301.  
  302. {CustomCSS}
  303. </style>
  304. <script type="text/javascript"
  305. src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>
  306.  
  307. <script>
  308.  
  309.  
  310.  
  311. $(document).ready(function() {
  312.  
  313. //
  314.  
  315.  
  316.  
  317. //When you click on a link with class of poplight and the href starts with a #
  318.  
  319. $('a.poplight[href^=#]').click(function() {
  320.  
  321. var popID = $(this).attr('rel'); //Get Popup Name
  322.  
  323. var popURL = $(this).attr('href'); //Get Popup href to define size
  324.  
  325.  
  326.  
  327. //Pull Query & Variables from href URL
  328.  
  329. var query= popURL.split('?');
  330.  
  331. var dim= query[1].split('&');
  332.  
  333. var popWidth = dim[0].split('=')[1]; //Gets the first query string value
  334.  
  335.  
  336.  
  337. //Fade in the Popup and add close button
  338.  
  339. $('#' + popID).fadeIn().css({ 'width': Number( popWidth ) }).prepend('<a href="#" class="close"><img src="http://tiny.cc/closeimg" class="btn_close" title="Close Window" alt="Close" /></a>');
  340.  
  341.  
  342. //Define margin for center alignment (vertical horizontal) - we add 80px to the height/width to accomodate for the padding and border width defined in the css
  343.  
  344. var popMargTop = ($('#' + popID).height() + 80) / 2;
  345.  
  346. var popMargLeft = ($('#' + popID).width() + 80) / 2;
  347.  
  348.  
  349.  
  350. //Apply Margin to Popup
  351.  
  352. $('#' + popID).css({
  353.  
  354. 'margin-top' : -popMargTop,
  355.  
  356. 'margin-left' : -popMargLeft
  357.  
  358. });
  359.  
  360.  
  361.  
  362. //Fade in Background
  363.  
  364. $('body').append('<div id="fade"></div>'); //Add the fade layer to bottom of the body tag.
  365.  
  366. $('#fade').css({'filter' : 'alpha(opacity=80)'}).fadeIn(); //Fade in the fade layer - .css({'filter' : 'alpha(opacity=80)'}) is used to fix the IE Bug on fading transparencies
  367.  
  368.  
  369.  
  370. return false;
  371.  
  372. });
  373.  
  374.  
  375.  
  376. //Close Popups and Fade Layer
  377.  
  378. $('a.close, #fade').live('click', function() { //When clicking on the close or fade layer...
  379.  
  380. $('#fade , .popup_block').fadeOut(function() {
  381.  
  382. $('#fade, a.close').remove(); //fade them both out
  383.  
  384. });
  385.  
  386. return false;
  387.  
  388. });
  389.  
  390.  
  391.  
  392.  
  393.  
  394. });
  395.  
  396. </script>
  397. </head>
  398.  
  399. <body>
  400.  
  401. <div id="sidebar">
  402. <center>
  403. <div id="sidebarpic"><img src="{image:sidebar img}"/></div>
  404. <div class="linky"><a href="/">index</a> <a href="/faq1">ask</a> <a href="#?w=450" rel="nav" class="poplight">nav</a> <a href="/archive">past</a> <a href="http://furyofthetimelords.tumblr.com">code</a></div>
  405. <div id="description">{block:Description}{Description}{/block:Description}</div>
  406. <br>
  407. <center>
  408. {block:Pagination}
  409. {block:PreviousPage}<a href="{PreviousPage}" class="jump_page">&laquo;</a>{/block:PreviousPage}
  410. {block:JumpPagination length="5"}
  411. {block:CurrentPage}<span class="current_page">{PageNumber}</span>{/block:CurrentPage}
  412. {block:JumpPage}<a class="jump_page" href="{URL}">{PageNumber}</a>{/block:JumpPage}{/block:JumpPagination}
  413. {block:NextPage}<a href="{NextPage}" class="jump_page">&raquo;</a>{/block:NextPage}
  414. {/block:Pagination}
  415. </center></div>
  416.  
  417.  
  418. <div id="nav" class="popup_block">
  419. <p><center><div class="terms">{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}</div>
  420. </div>
  421.  
  422.  
  423. <div id="entry">
  424. {block:Posts}
  425. <div id="post">
  426.  
  427. {block:Text}<div id="title">{Title}</div>{Body}{/block:Text}
  428.  
  429. {block:Quote}<div id="title">“{Quote}”</div> <h2>— {Source}</h2>{/block:Quote}
  430.  
  431. {block:Link}<a href="{URL}" class="link" {Target}> <h2>{Name}</h2></a>
  432. {block:Description}<P>{Description}</p>{/block:Description}{/block:Link}
  433.  
  434. {block:Photo}<center>{LinkOpenTag}<img src="{PhotoURL-500}" alt="{PhotoAlt}"/>{LinkCloseTag}</center>{block:Caption}{Caption}{/block:Caption}{/block:Photo}
  435. {block:Photoset}<center>{Photoset-500}</center>{block:Caption}{Caption}{/block:Caption}{/block:Photoset}
  436.  
  437. {block:Chat}
  438. {block:Title}<div class="title">{Title}</div>{/block:Title}<br>
  439. <div class="chat">
  440. <ul>
  441. {block:Lines}<li class="{Alt}">{block:Label} {Label} {/block:Label}{Line}</li>{/block:Lines}
  442. </ul>
  443. </div>
  444. {/block:Chat}
  445.  
  446. {block:Video}{Video-500}{block:Caption}{Caption}{/block:Caption}{/block:Video}
  447.  
  448. {block:Answer}
  449. <div class="question">
  450. <b>{Asker}</b> asked:<br>
  451. {Question}</div>{Answer}
  452. {/block:Answer}
  453.  
  454.  
  455.  
  456. {block:Audio}<div id="audip"><img src="http://fc08.deviantart.net/fs71/f/2011/185/f/9/no_cover_itunes_by_stainless2-d3kxnbe.png"></div><span class="audio">{block:AlbumArt}<div id="audi"><image src="{AlbumArtURL}" width="100"></div>{/block:AlbumArt}
  457. <div id= "player">{AudioPlayerBlack}</div> <div id="audiod"><center>{block:TrackName}<strong>{TrackName}</strong>{/block:TrackName} {block:Artist}<br><em>{Artist}</em>{/block:Artist} {block:PlayCount}<br>{PlayCount} {/block:PlayCount}</div></center></span>
  458. {block:Caption}{Caption}{/block:Caption}
  459. {/block:Audio}
  460.  
  461. <div id="info"><div id="nott"><a href="{Permalink}">{TimeAgo}</a>{/block:Date}{block:NoteCount} + <a href="{Permalink}">{NoteCount}</a> {/block:NoteCount}{block:RebloggedFrom} + <a href="{ReblogParentURL}">via</a>
  462. {block:ContentSource} / <a href="{SourceURL}">origin</a>{block:ContentSource}{/block:RebloggedFrom}</div><br>
  463. {block:HasTags}{block:Tags}#<a href="{TagURL}">{Tag}</a> {/block:Tags}{/block:HasTags}</div></div><br>
  464. {/block:Posts}
  465.  
  466. {block:PostNotes}{PostNotes}{/block:PostNotes}
  467.  
  468. </div>
  469.  
  470. </body>
  471.  
  472. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Public Pastes
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!