API tools faq
paste
furyofthetimelords

theme 016

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