Advertisement
sighthemes

Theme Four; By Spencer

Dec 1st, 2013
1,078
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 16.66 KB | None | 0 0
  1. <!--
  2.  
  3. New theme 4 by Spencer (sighthemes)
  4. Keep the credit
  5. Or you will be reported
  6.  
  7. Do not steal or steal parts of the coding
  8. I worked very hard and it would be very disrespectful
  9.  
  10. Make sure your posts per page is set at 15 or the infinite scroll won't work! (Customize > Advanced > Posts per page > 15 > Save)
  11.  
  12. -->
  13.  
  14. <html lang="en">
  15. <!DOCTYPE html PUBLIC"-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  16. <html xmlns="http://www.w3.org/1999/xhtml">
  17. <head>
  18. <script language="JavaScript" src="http://dl.dropbox.com/u/3173073/GothicDarkness/qTip.js"type="text/JavaScript"></script>
  19.  
  20. <style>
  21. div#qTip {
  22. padding:1px;
  23. padding-right:2px;
  24. padding-left:3px;
  25. height: 10px;
  26. margin-top:12px;
  27. font-family:consolas;
  28. font-size:8px;
  29. display: none;
  30. text-align: center;
  31. position: absolute;
  32. line-height: 12px;
  33. letter-spacing:1px;
  34. text-transform:uppercase;
  35. z-index: 999999999999;
  36. background:#fff;
  37. color:#555;
  38. border:1px solid #eee;
  39. font-style: oblique;
  40. }
  41. </style>
  42.  
  43. <script type="text/javascript">
  44. <!--
  45.  
  46. // Disable Right Click Script
  47.  
  48. function IE(e)
  49. {
  50. if (navigator.appName == "Microsoft Internet Explorer" && (event.button == "2" || event.button == "3"))
  51. {
  52. return false;
  53. }
  54. }
  55. function NS(e)
  56. {
  57. if (document.layers || (document.getElementById && !document.all))
  58. {
  59. if (e.which == "2" || e.which == "3")
  60. {
  61. return false;
  62. }
  63. }
  64. }
  65. document.onmousedown=IE;document.onmouseup=NS;document.oncontextmenu=new Function("return false");
  66.  
  67. //-->
  68. </script>
  69.  
  70.  
  71. <script type="text/javascript"
  72. src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>
  73.  
  74. <!--DEFAULT VARIABLES-->
  75. <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
  76. <meta name="color:background" content="#fff"/>
  77. <meta name="color:link" content="#777"/>
  78. <meta name="color:text" content="#777"/>
  79. <meta name="color:textpermalinks" content="#ccccccc"/>
  80. <meta name="color:scrollbar" content="#ccc">
  81. <meta name="color:hover" content="#fff"/>
  82. <meta name="image:sidebar" content="1"/>
  83. <meta name="image:background" content="1"/>
  84.  
  85. <meta name="text:Custom Link One Title" content= >
  86. <meta name="text:Custom Link One" content="http://" />
  87. <meta name="text:Custom Link Two Title" content= >
  88. <meta name="text:Custom Link Two" content="http://" />
  89. <meta name="text:Custom Link Three Title" content= >
  90. <meta name="text:Custom Link Three" content="http://" />
  91. <meta name="text:Custom Link Four Title" content= >
  92. <meta name="text:Custom Link Four" content="http://" />
  93. <meta name="text:Custom Link Five Title" content= >
  94. <meta name="text:Custom Link Five" content="http://" />
  95. <meta name="text:Custom Link Six" content="http://" />
  96. <meta name="text:Custom Link Six Title" content= >
  97.  
  98.  
  99.  
  100. <style type="text/css">
  101.  
  102.  
  103. iframe#tumblr_controls { white-space:nowrap; -webkit-filter: invert(100%); -moz-filter: invert(100%); -o-filter: invert(100%); -ms-filter: invert(100%); filter: invert(100%); opacity:.2;transition: .8s ease-in-out; -webkit-transition: .8s ease-in-out;-moz-transition: .8s ease-in-out;-o-transition: .8s ease-in-out; }
  104.  
  105. ::-webkit-scrollbar-thumb{
  106. background-color: {color:scrollbar};
  107. border: 2px solid #ffffff;
  108. height:5px;
  109. -moz-border-radius: 20px;
  110. border-radius: 20px;
  111. }
  112.  
  113. ::-webkit-scrollbar {
  114. height:5px;
  115. width:9px;
  116. background-color: #aaaaaa;
  117. border: 4px solid #fff;
  118. }
  119.  
  120. ::selection {
  121. background: #fff;
  122. }
  123.  
  124. ::-moz-selection {
  125. background: #fff;
  126. }
  127.  
  128.  
  129. p {
  130. margin:0px;
  131. margin-top:5px;
  132. }
  133.  
  134.  
  135. body {
  136. padding: 0px;
  137. margin: 0px;
  138. color:{color:text};
  139. font-family:calibri;
  140. font-size:10px;
  141. line-height:100%;
  142. text-normal;
  143. text-align:left;
  144. background-color: {color:Background};
  145. background-image:url({image:Background});
  146. background-attachment: fixed;
  147. background-repeat: repeat;
  148. }
  149.  
  150.  
  151.  
  152. a:link, a:active, a:visited{
  153. text-decoration: none;
  154. -webkit-transition: color 0.3s ease-out;
  155. -moz-transition: color 0.3s ease-out;
  156. transition: color 0.3s ease-out;
  157. color:{color:link};
  158. }
  159.  
  160. a:hover {
  161. text-decoration: none;
  162. font-style:;
  163. color: {color:Hover};
  164. }
  165.  
  166. div#center{
  167. margin:auto;
  168. position:relative;
  169. width:1000px;
  170. background-color:;
  171. overflow:auto;
  172. overflow-y:hidden;
  173. }
  174.  
  175. .entry {
  176. float:left;
  177. opacity:.75;
  178. padding: 10px;
  179. background: #fff;
  180. border:1px solid #f2f2f2;
  181. padding-bottom: 8px;
  182. border-radius: 5px;
  183. width:170px;
  184. margin:12px;
  185. margin-bottom:16px;
  186. {/block:indexpage}
  187. {block:permalinkpage}
  188. width: 500px;
  189. padding:10px;
  190. padding-bottom:5px;
  191. border-radius:5px;
  192. background-color:#fff;
  193. border:1px solid #efefef;
  194. {/block:permalinkpage}
  195. display: block;
  196. position: relative;
  197. }
  198.  
  199. .entry img{
  200. {block:permalinkpage}
  201. width: 500px;
  202. {/block:permalinkpage}
  203. -webkit-transition: opacity 0.7s linear;-webkit-transition: all 0.5s ease-out;-moz-transition: all 0.5s ease-out;transition: all 0.5s ease-out;
  204. border-radius: 5px;
  205. }
  206.  
  207. .entry img:hover {
  208. -webkit-transition: opacity 0.7s linear;opacity: 1;-webkit-transition: all 0.5s ease-out;-moz-transition: all 0.5s ease-out;transition: all 0.5s ease-out;
  209. }
  210.  
  211. .entry .perma{
  212. width:auto;
  213. height:auto;
  214. margin-left:8px;
  215. position: absolute;
  216. line-height: 16px;
  217. overflow:hidden;
  218. text-align:center;
  219. bottom:15px;
  220. background:white;
  221. word-spacing:1px;
  222. opacity: 0.0;
  223. -webkit-transition: all 0.5s ease-out;-moz-transition: all 0.5s ease-out;transition: all 0.5s ease-out; -webkit-transition: all 0.5s ease-in-out;
  224. -moz-transition: all 0.5s ease-in-out;
  225. transition: all 0.5s ease-in-out;
  226. z-index:999;
  227. border-radius:5px;
  228. padding-left:2px;
  229. padding-right:3px;
  230. }
  231.  
  232. .entry:hover .perma{
  233. overflow:visible;
  234. opacity:0.9;
  235. }
  236.  
  237. .permalinktext{
  238. display: block;
  239. font:calibri;
  240. font-size:10px;
  241. line-height:2px;
  242. letter-spacing:1px;
  243. height: 7px;
  244. text-transform:uppercase;
  245. text-align: right;
  246. border-radius: 3px;
  247. background: {color:textpermalinks};
  248. margin: 2px;
  249. margin-top:5px;
  250. border:1px solid #eee;
  251. padding-top:6px;
  252. }
  253.  
  254. .permalinktext a{
  255. color: #777;
  256. }
  257.  
  258. #posts {
  259. margin-top: 13px
  260. padding-top:0px;
  261. {block:ifbanner}
  262. margin-top: 35px;
  263. {/block:ifbanner}
  264. width:800px;
  265. margin-left: 180px;
  266. {block:permalinkpage}
  267. width: 500px;
  268. background-color:;
  269. border-left:0px solid #eee;
  270. border-right:0px solid #eee;
  271. margin-left:300px;
  272. {/block:permalinkpage}
  273. }
  274.  
  275. #sidebar{
  276. position:fixed !important;
  277. width:150px;
  278. background:white;
  279. height:auto;
  280. margin-top:160px;
  281. margin-left:0px;
  282. text-align:center;
  283. padding:6px;
  284. border:1px solid #f2f2f2;
  285. padding-bottom:4px;
  286. -webkit-filter:grayscale(40%);
  287. box-shadow: 0 0 11px rgba(255, 255, 255, 1);
  288. border-radius:5px;
  289. opacity:1;
  290. z-index:2;
  291. -webkit-transition: opacity 0.7s linear;-webkit-transition: all 0.5s ease-out;-moz-transition: all 0.5s ease-out;transition: all 0.5s ease-out;
  292. }
  293.  
  294. #audio {
  295. width:200px;
  296. height:auto;
  297. min-height:60px;
  298. padding-bottom:0px;
  299. }
  300.  
  301. .cover {
  302. position:absolute;
  303. z-index:1;
  304. width:60px;
  305. height:60px;
  306. }
  307.  
  308. .cover img {
  309. float:left;
  310. width:60px;
  311. height:60px;
  312. }
  313.  
  314. .playbox {
  315. opacity:0.6;
  316. width:27px;
  317. height:30px;
  318. overflow:hidden;
  319. position:absolute;
  320. z-index:1000;
  321. margin-left:17px;
  322. margin-top:17px;
  323. text-align:center;
  324. }
  325.  
  326. .info {
  327. margin-left:73px;
  328. margin-top:4px;
  329. line-height:14px;
  330. }
  331.  
  332. #creds{
  333. position:fixed;
  334. width:33px;
  335. bottom:-12px;
  336. right:2px;
  337. padding: 2px;
  338. font-family:consolas;
  339. font-size:8px;
  340. text-transform:uppercase;
  341. letter-spacing:1px;
  342. -webkit-transition: all .7s ease;
  343. -moz-transition: all .7s ease;
  344. -o-transition: all .7s ease;
  345. transition: all .7s ease;
  346. }
  347.  
  348. #creds:hover{
  349. bottom:0px;
  350. -webkit-transition: all .7s ease;
  351. -moz-transition: all .7s ease;
  352. -o-transition: all .7s ease;
  353. transition: all .7s ease;
  354. }
  355.  
  356. askk{
  357. font-size:9px;
  358. text-transform:uppercase;
  359. letter-spacing:1px;
  360. color:#73ac69;
  361. }
  362.  
  363. @font-face { font-family: "dixel"; src: url('http://static.tumblr.com/jdjsstr/8ovm78cbb/pf_arma_five_1_.ttf'); }
  364.  
  365. .title{
  366. line-height: 12px;
  367. color:{color:link};
  368. font-family: calibri;
  369. font-size: 12px;
  370. font-style: italic;
  371. text-transform: uppercase;
  372. font-weight: normal;
  373. }
  374.  
  375. .permalink{
  376. text-transform: normal;
  377. display: block;
  378. text-align: right;
  379. text-decoration: none;
  380. }
  381.  
  382. /*I RECCOMMEND TO NOT TOUCH ANY OF THIS*/
  383. #infscr-loading{
  384. bottom: -70px;
  385. position: absolute;
  386. left: 50%;
  387. margin-left:-8px;
  388. width:16px;
  389. height:11px;
  390. overflow:hidden;
  391. margin-bottom: 50px;
  392. }
  393.  
  394. #postnotes{
  395. text-align: justify;}
  396.  
  397. #postnotes blockquote{
  398. border: 0px;}
  399.  
  400. blockquote{
  401. padding:0px 0px 2px 5px;
  402. margin:5px 5px 5px 5px;
  403. border-left: 2px solid {color:blogtitle};
  404. }
  405.  
  406. blockquote p, ul{
  407. margin:0px;
  408. padding:0px;
  409. }
  410.  
  411. a img{border: 0px;}
  412.  
  413.  
  414. ul, ol, li{list-style:none; margin-top:5px; padding:0px;}
  415.  
  416. .user_1 .label, .user_2 .label, .user_3 .label, .user_4 .label, .user_5 .label, .user_6 .label,
  417. .user_7 .label, .user_8 .label, .user_9 .label {color:{color:text};}
  418.  
  419. .notes img{width:10px; position:relative; top:3px;}
  420. <--ses-->
  421. small{font-size: 90%;}
  422.  
  423. {CustomCSS}
  424.  
  425. </style>
  426.  
  427. {block:IndexPage}
  428. <script type="text/javascript" src="http://static.tumblr.com/dbek3sy/iBElrgjim/jquerymasonry.js"></script>
  429. <script type="text/javascript" src="http://static.tumblr.com/dbek3sy/Qyblrgjfn/jqueryinfintescroll.js"></script>
  430.  
  431. <script type="text/javascript">
  432. $(window).load(function(){
  433. var $wall = $('#posts');
  434. $wall.imagesLoaded(function(){
  435. $wall.masonry({
  436. itemSelector: '.entry, .entry_photo',
  437. isAnimated : false
  438. });
  439. });
  440.  
  441. $wall.infinitescroll({
  442. navSelector : '#pagination',
  443. nextSelector : '#pagination a',
  444. itemSelector : '.entry, .entry_photo',
  445. bufferPx : 2000,
  446. debug : false,
  447. errorCallback: function() {
  448. $('#infscr-loading').fadeOut('normal');
  449. }},
  450. function( newElements ) {
  451. var $newElems = $( newElements );
  452. $newElems.hide();
  453. $newElems.imagesLoaded(function(){
  454. $wall.masonry( 'appended', $newElems,{isAnimated: false}, function(){$newElems.fadeIn('slow');} );
  455. });
  456. }); $('#posts').show(500);
  457. });
  458. </script>
  459.  
  460.  
  461. {/block:IndexPage}
  462.  
  463.  
  464. <title>{title}</title>
  465.  
  466. <link rel="shortcut icon" href="{Favicon}" />
  467. <meta name="viewport" content="width=820" />
  468. </head>
  469.  
  470. <body>
  471. <BODY onselectstart="return false;" ondragstart="return false;">
  472. <div class="wrapper">
  473. <div class="header">
  474. </div>
  475.  
  476. <div id="cage">
  477. <div id="center">
  478.  
  479.  
  480.  
  481. <!--STUFF THAT GOES INTO THE SIDEBAR-->
  482. <div id="sidebar">
  483. <center>
  484. <a href="/"><img src="{image:sidebar}" style=" width: 150px;border-radius:5px;"></a>
  485. <p>
  486. {description}
  487. <p>
  488. <select onChange="location=this.options[this.selectedIndex].value;" style=" font-family: consolas; font-size: 10px; text-transform: uppercase; color:#777; border: 1px solid #c2c1c1; background-color: {color:textpermalinks}; margin-bottom:2px; -webkit-appearance: none;text-align:center;margin-top:1px; -moz-border-radius:6px; -webkit-border-radius: 6px; border-radius: 6px; "> <option value="">navigation +</option> <option value="{text:Custom Link One}">{text:Custom Link One Title}</option> <option value="{text:Custom Link Two}">{text:Custom Link Two Title}</option> <option value="{text:Custom Link Three}">{text:Custom Link Three Title}</option> <option value="{text:Custom Link Four}">{text:Custom Link Four Title}</option> <option value="{text:Custom Link Five}">{text:Custom Link Five Title}</option> <option value="{text:Custom Link Six}">{text:Custom Link Six Title}</option> <option value="http://sighthemes.tumblr.com">theme</option> </select></form>
  489. </center>
  490. </div>
  491. <!------------------------------------->
  492.  
  493.  
  494. <div class="left">
  495. <div id="posts">
  496. {block:Posts}
  497. <div class="entry">
  498.  
  499. {block:Text}{block:Title}<span class="title">{Title}</span>{/block:Title}<span class="body">{Body}</span><div class="permalinktext">
  500. <center> <a href="{reblogurl}">reblog</a> with <a href="{permalink}">{notecountwithlabel}</a> </center></div>
  501. {/block:Text}
  502.  
  503. {block:Link}<a href="{URL}" class="title">{Name}</a>{block:Description}<div class="body">{Description}</div>{/block:Description} <div class="permalinktext">
  504. <center> <a href="{reblogurl}">reblog</a> with <a href="{permalink}">{notecountwithlabel}</a> </center></div>{block:Link}
  505.  
  506. {block:Answer}
  507. <div style="margin: 2px 2px 2px 2px; min-height:auto; padding: 3px; background-color: {color:background}; border:1px solid #ddd; border-radius:4px;">
  508. <askk><b>{Asker}</b></askk>: {Question}</div>
  509. <div style="padding: -1px 5px -1px 5px; background: transparent;"><center>{Answer}</center></div>
  510. <div class="permalinktext">
  511. <center> <a href="{reblogurl}">reblog</a> with <a href="{permalink}">{notecountwithlabel}</a> </center></div>{/block:Answer}
  512.  
  513. {block:Photo}
  514. {block:IndexPage}
  515. <center>
  516. <div class="perma">
  517. <a href="{reblogurl}">reblog </a> / <a href="{permalink}">{notecountwithlabel}</a></div>
  518. <div class="photo"><a href="{permalink}"><img class="photo" src="{PhotoURL-HighRes}" alt="{PhotoAlt}" width="100%"/></a></div>
  519. {/block:IndexPage}
  520. {block:PermalinkPage}
  521. {LinkOpenTag}<div class="photo"><a href="{permalink}"><img class="photo" src="{PhotoURL-HighRes}" alt="{PhotoAlt}" width="100%"/></a></div>
  522.  
  523. {LinkCloseTag}
  524. {/block:PermalinkPage}
  525. {/block:Photo}
  526.  
  527. {block:Photoset}
  528. <center>
  529. {block:IndexPage}
  530. <div class="perma">
  531. <a href="{reblogurl}">reblog </a> / <a href="{permalink}">{notecountwithlabel}</a></div>
  532. <div style="width: 220px; overflow-x:hidden;overflow-y:hidden;">{Photoset-250}</div>
  533. {/block:IndexPage}
  534. </center>
  535. <center>{block:PermalinkPage}<div style="width: auto; overflow-x:hidden;overflow-y:hidden;">{Photoset-500}{/block:PermalinkPage}</center>
  536. {/block:Photoset}
  537.  
  538. {block:Quote}<span class="title">"{Quote}"</span> — {block:Source}<b>{Source}</b>{/block:Source}<br><div class="permalinktext">
  539. <center> <a href="{reblogurl}">reblog</a> with <a href="{permalink}">{notecountwithlabel}</a> </center></div>{/block:Quote}
  540.  
  541. {block:Chat}{block:Title}<span class="title">{Title}</span>{/block:Title}
  542. <ul class="chat">
  543. {block:Lines}
  544. <li class="user_{UserNumber}">
  545. {block:Label}
  546. <span class="label">{Label}</span>
  547. {/block:Label}
  548.  
  549. {Line}
  550. </li>
  551. {/block:Lines}
  552. <div class="permalinktext">
  553. <center> <a href="{reblogurl}">reblog</a> with <a href="{permalink}">{notecountwithlabel}</a> </center></div>
  554. {/block:Chat}
  555.  
  556. {block:Audio}
  557. <div id="audio"><div class="cover"><img src="http://static.tumblr.com/k9utpfa/tcom8wpif/default_cover_m.jpg"></div>{block:AlbumArt}<div class="cover"><img src="{AlbumArtURL}"></div>{/block:AlbumArt}<div class="playbox">{block:AudioPlayer}{AudioPlayerWhite}{/block:AudioPlayer}</div><div class="info"><b>Artist:</b> <span{block:Artist} style="display:none;"{/block:Artist}>Unknown</span>{block:Artist}{Artist}{/block:Artist}<br><b>Title:</b> <span{block:TrackName} style="display:none;"{/block:TrackName}>Unknown</span>{block:TrackName}{TrackName}{/block:TrackName}<br><b>Album:</b> <span{block:Album} style="display:none;"{/block:Album}>Unknown</span>{block:Album}{Album}{/block:Album}{block:PlayCount}<br><b>Plays:</b> {FormattedPlayCount}{/block:PlayCount}</div></div>
  558. {block:IndexPage}
  559. <div class="permalinktext">
  560. <center> <a href="{reblogurl}">reblog</a> with <a href="{permalink}">{notecountwithlabel}</a> </center></div>
  561. {/block:IndexPage}
  562. {/block:Audio}
  563.  
  564. {block:Video}
  565. <center>
  566. {block:IndexPage}
  567. <div class="perma">
  568. {Month} {DayOfMonth} with <a href="{permalink}">{notecountwithlabel}</a> - <a href="{reblogurl}">reblog</a>
  569. </div>
  570. <div style="width: 220px; overflow-x:hidden;overflow-y:hidden;">{Video-250}</div>
  571. {/block:IndexPage}
  572. </center>
  573. <center>{block:PermalinkPage}<div style="width: 450px; overflow-x:hidden;overflow-y:hidden;">{Video-500}{/block:PermalinkPage}</center>
  574. {block:Video}
  575.  
  576.  
  577. {block:PostNotes}<div align="left">{caption}</div>
  578. <center>
  579.  
  580. {block:NoteCount}{NoteCountWithLabel}<br>{/block:NoteCount}
  581.  
  582. {block:HasTags}
  583. tags: {block:Tags}<a href="{TagURL}">{Tag}. </a>{/block:Tags}<br> {/block:HasTags}
  584. {block:RebloggedFrom}
  585. reblogged from <a href="{ReblogParentURL}">{ReblogParentName}</a><br>
  586. posted by <a href="{ReblogRootURL}">{ReblogRootName}</a>
  587.  
  588. {/block:RebloggedFrom}
  589. </center></span>
  590. <br>
  591. <div id="postnotes">{PostNotes}</div><br>
  592.  
  593. <center>{block:ContentSource}
  594. <br><a href="{SourceURL}">
  595. {lang:Source}:
  596. {block:SourceLogo}
  597. <img src="{BlackLogoURL}" width="{LogoWidth}"
  598. height="{LogoHeight}" alt="{SourceTitle}" />
  599. {/block:SourceLogo}
  600. {block:NoSourceLogo}
  601. {SourceLink}
  602. {/block:NoSourceLogo}
  603. </a>
  604. {/block:ContentSource}</center>
  605.  
  606. {/block:PostNotes}
  607. </div>
  608. {/block:Posts}
  609. </div></div>
  610.  
  611. {block:IndexPage}
  612. {block:Pagination}
  613. <div id="pagination">
  614. {block:NextPage}
  615. <a id="nextPage" href="{NextPage}"></a>
  616. {/block:NextPage}
  617. {block:PreviousPage}
  618. <a href="{PreviousPage}"></a>
  619. {/block:PreviousPage}
  620. </div>
  621. {/block:Pagination}
  622. {/block:IndexPage}
  623. </body>
  624. <div style="position:fixed; bottom:0px; right:0px; padding: 2px;"> <a href="http://sighthemes.tumblr.com" title="Theme by SighThemes"><img src="http://24.media.tumblr.com/tumblr_me8dpnQQwD1r83eo0o1_400.png" style="width:33px;"></a></div>
  625. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement