Advertisement
sunrisen

apathy theme

May 20th, 2014
6,223
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 16.02 KB | None | 0 0
  1. <!--
  2.  
  3. APATHY THEME CREATED BY DECADE (SUNRISENTHEMES)
  4. RELEASED 20-05-2014
  5. _ ___ __ _ _ ___
  6. | \ | / /_\ | \ |
  7. | | |--- | | | | | |---
  8. |__/ |___ \___ | | |__/ |___
  9.  
  10. FIND MORE THEMES BY DECADE AT SUNRISENTHEMES OR HOTLAYOUTS
  11.  
  12. -->
  13. <html lang="en">
  14. <head>
  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 prefix="og: http://ogp.me/ns# fb: http://ogp.me/ns/fb# blog: http://ogp.me/ns/blog#">
  18. <script type="text/javascript"
  19. src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>
  20. <link href='http://fonts.googleapis.com/css?family=Source+Sans+Pro|Oxygen|Fredoka+One|Open+Sans|Alegreya+Sans' rel='stylesheet' type='text/css'>
  21.  
  22. <title>{Title}</title>
  23.  
  24. <link rel="shortcut icon" href="{Favicon}">
  25.  
  26. <meta name="color:background" content="#ffffff"/>
  27. <meta name="color:text" content="#000000"/>
  28. <meta name="color:link" content="#000000"/>
  29. <meta name="color:hover" content="#cccccc"/>
  30. <meta name="color:permalink" content="#cccccc"/>
  31.  
  32. <meta name="image:background" content=""/>
  33.  
  34. <meta name="if:image fade" content="1"/>
  35. <meta name="if:one column" content="0"/>
  36.  
  37. <meta name="text:link one" content=""/>
  38. <meta name="text:link one title" content=""/>
  39. <meta name="text:link two" content=""/>
  40. <meta name="text:link two title" content=""/>
  41. <meta name="text:link three" content=""/>
  42. <meta name="text:link three title" content=""/>
  43. <meta name="text:link four" content=""/>
  44. <meta name="text:link four title" content=""/>
  45. <meta name="text:link five" content=""/>
  46. <meta name="text:link five title" content=""/>
  47.  
  48. <style type="text/css">
  49.  
  50. #tumblr_controls{
  51. position:fixed !important;
  52. -webkit-filter: invert(100%) ;
  53. }
  54.  
  55. ::-webkit-scrollbar-thumb{
  56. background-color: {color:text};
  57. border: 2px solid {color:background};
  58. height:auto;
  59. -moz-border-radius: 10px;
  60. border-radius: 10px;
  61. }
  62.  
  63. ::-webkit-scrollbar {
  64. height:auto;
  65. width:9px;
  66. background-color: #999999;
  67. border: 4px solid {color:background};
  68. }
  69.  
  70. body{
  71. margin:0px;
  72. background-repeat: repeat;
  73. background-attachment:fixed;
  74. background-color:{color:background};
  75. background-image:url('{image:background}');
  76. {block:indexpage}
  77. background-position:400px 0px;
  78. {/block:indexpage}
  79. font-size: 11px;
  80. font-family: open sans;
  81. line-height:9px;
  82. text-transform:lowercase;
  83. color: {color:text};
  84. }
  85.  
  86. a:link, a:active, a:visited{
  87. color: {color:link};
  88. text-decoration: none;
  89. padding-bottom:1px;
  90. -webkit-transition-duration:.2s;
  91. }
  92.  
  93. a:hover{
  94. color: {color:hover};
  95. }
  96.  
  97. .entry {
  98. margin:30px;
  99. padding: 0px;
  100. float:left;
  101. padding-bottom:0px;
  102. background-color:white;
  103. margin-bottom:30px;
  104. {block:IndexPage}
  105. width:250px;
  106. {/block:IndexPage}
  107. {block:PermalinkPage}
  108. width:500px;
  109. padding-top:5px;
  110. margin-top:30px;
  111. {/block:PermalinkPage}
  112. font-family:calibri;
  113. font-size: 12px;
  114. letter-spacing:0px;
  115. text-transform:lowercase;
  116. line-height:14px;
  117. color:{color:text};
  118. z-index:1;
  119. overflow:hidden;
  120. }
  121. .entry img{max-width:100%;}
  122. .photo a, .photo a:hover{background:none;border:none;}
  123.  
  124. #posts {
  125. width:620px;
  126. {block:ifonecolumn}
  127. width:310px;
  128. {/block:ifonecolumn}
  129. margin-top:0px;
  130. padding-top:10px;
  131. padding-bottom:0px;
  132. padding-right:0px;
  133. padding-left:0px;
  134. margin-left:20px;
  135. background:none;
  136. {block:permalinkpage}
  137. width:550px;
  138. {/block:permalinkpage}
  139. z-index:0;
  140. }
  141.  
  142. #infscr-loading{
  143. bottom: -10px;
  144. position: absolute;
  145. left: 50%;
  146. margin-left:0px;
  147. width:16px;
  148. height:16px;
  149. overflow:hidden;
  150. margin-bottom: 50px;
  151. }
  152.  
  153. .img{{block:indexpage}{block:ifimagefade}opacity:.8;{/block:ifimagefade}{/block:indexpage}-webkit-transition-duration:.7s;/*-webkit-filter:grayscale(0%);*/}
  154.  
  155. .img:hover, .entry:hover .img{opacity:1;/*-webkit-filter:grayscale(100%);*/}
  156.  
  157. .title{
  158. font-family:consolas;
  159. font-size: 9px;
  160. font-weight:normal;
  161. line-height:7px;
  162. letter-spacing:1px;
  163. text-transform:uppercase;
  164. }
  165.  
  166. blockquote{
  167. padding:0px 0px 2px 5px;
  168. margin:2px 0px 2px 1px;
  169. border-left: 1px solid #cccccc;}
  170. blockquote p, ul{margin:0px; padding:0px;}
  171.  
  172. .chat .line{
  173. background-color:#ffffff;
  174. margin: 0 0 1px;
  175. padding: 5px;
  176. }
  177. .chat .line.odd{
  178. background-color:#e3e3e3;
  179. }
  180.  
  181. .label {font-weight:bold; color:{color:text}}
  182.  
  183. a img{border: 0px;}
  184.  
  185. .p { padding-top: 5px; }
  186. .ol, ul { margin-left: 10px; padding: 5px; }
  187. .ul { list-style-type: square; }
  188.  
  189. .albumart { margin-bottom: 0px; }
  190. .albumart img, .audio embed { width: 55px; padding-right: 5px;}
  191. .notes img{width:20px; position:left; top:5px;border-radius:100px;}
  192. .notes{line-height:17px;text-transform:uppercase;font-family:consolas;font-size:9px;letter-spacing:1px;text-align:left;}
  193.  
  194. .ig{opacity:.9;-webkit-transition-duration:.8s;}.ig:hover, .entry:hover .ig{opacity:1;}
  195.  
  196. #s-m-t-tooltip{
  197. box-shadow:1px 1px 3px rgba(0,0,0,.1);
  198. max-width:270px;
  199. margin-top:7px;
  200. margin-left:7px;
  201. padding-left:4px;
  202. padding-right:4px;
  203. border:none;
  204. border-radius:0px;
  205. z-index:1000;
  206. background-color:#ffffff;
  207. color:#000000;
  208. font-family:source sans pro;
  209. z-index:1000000009;
  210. font-size:8px;
  211. letter-spacing:1px;
  212. font-style:normal;
  213. text-transform:uppercase;
  214. line-height:15px;
  215. box-shadow:3px 3px 0px #cccccc;
  216. border:1px solid #aaaaaa;
  217. }
  218.  
  219. .perma{
  220. font-family: consolas;
  221. border:1px solid #fff;
  222. padding: 3px 6px;
  223. margin-top: 0px;
  224. letter-spacing:1px;
  225. font-size: 8px;
  226. text-transform:uppercase;
  227. line-height: 8px;
  228. text-align:left;
  229. margin-bottom:5px;
  230. }
  231.  
  232. #sidebar{
  233. position:fixed;
  234. margin-top:0px;
  235. z-index:1000000009;
  236. height:auto;
  237. width:80px;
  238. top:25%;
  239. margin-left:660px;
  240. {block:ifonecolumn}
  241. margin-left:350px;
  242. {/block:ifonecolumn}
  243. padding-top:0px;
  244. padding-bottom:30px;
  245. background:none;
  246. color:black;
  247. font-family:consolas;
  248. font-size:9px;letter-spacing:1px;text-transform:uppercase;-webkit-transition-duration:1s;
  249. text-align:right;
  250.  
  251. }
  252. #sidebar a{color:black;}
  253.  
  254. .hear {width:36px;height:36px;padding:5px;overflow:hidden;position:absolute;z-index:9999;margin:-150px 0 0 107px;background-color:#000000;-moz-border-radius: 30px;-webkit-border-radius: 30px;border-radius: 30px;
  255. }
  256.  
  257. .hear .player {width:26px;height:26px;overflow:hidden;position:absolute;margin:5px 0 0 5px;background-color:#000000;-moz-border-radius: 30px;
  258. }
  259.  
  260. .blogtitle{text-align:left;font-size:10px;font-family:arial;padding:5px;line-height:10px;text-transform:lowercase;border:1px solid #000000;width:80px;}
  261. .description{text-align:left;font-size:10px;font-family:arial;padding:5px;padding-top:5px;text-transform:lowercase;line-height:12px;border:1px solid #000000;width:100px;padding:5px;margin-top:13px;}
  262. .links{padding:5px;font-family:arial;font-size:10px;text-transform:lowercase;font-style:italic;border:1px solid #000000;text-align:left;width:80px;margin-top:13px;position:relative;}
  263. .linear{margin-left:660px;{block:ifonecolumn}margin-left:350px;{/block:ifonecolumn}height:100%;width:1px;background:black;margin-top:0px;position:fixed;z-index:1000000000009;}
  264.  
  265. .photoperm{text-align:center;font-family:arial;font-size:9px;text-transform:uppercase;border:1px solid #888888;border-radius:3px;margin-top:5px;margin-bottom:5px;}
  266. .photoperm a{color:#555555;text-decoration:none;}
  267.  
  268. .corner{width:0px;height:0px;background:none;position:absolute;right:-30px;margin-top:-30px;border:15px solid {color:background};border-left:15px solid {color:permalink};border-bottom:15px solid {color:permalink};opacity:1; -webkit-transform:scale(0.0);-moz-transform:scale(0.0); -o-transform:scale(0.0); -webkit-transition:all .5s ease-out;-moz-transition:all .5s ease-out;transition:all .5s ease-out;}
  269.  
  270. .entry:hover .corner{opacity:1;margin-top:-1px;right:-1px;-webkit-transform:scale(1.0); -moz-transform:scale(1.0); -o-transform:scale(1.0);-webkit-transition:all .5s ease-out;-moz-transition:all .5s ease-out;transition:all .5s ease-out;
  271. }
  272.  
  273. .links_list{width:auto;}.links_title{width:80px;}
  274.  
  275. {CustomCSS}
  276. </style>
  277. <script type="text/javascript" src="http://static.tumblr.com/3ikgvxs/0TGl4zgpu/jquery.min.js"></script>
  278. <script type="text/javascript">
  279. $(document).ready(function(){
  280. $(".description").hide();
  281. $(".links_title").click(function(){
  282. $(this).next(".description").slideToggle('medium');
  283. }); }); </script>
  284. {block:IndexPage}
  285. <script type="text/javascript" src="http://static.tumblr.com/dbek3sy/iBElrgjim/jquerymasonry.js"></script>
  286. <script type="text/javascript" src="http://static.tumblr.com/dbek3sy/Qyblrgjfn/jqueryinfintescroll.js"></script>
  287. <script type="text/javascript">
  288. $(window).load(function () {
  289. var $content = $('#posts');
  290. $content.masonry({itemSelector: '.entry'}),
  291. $content.infinitescroll({
  292. navSelector : 'div#pagination',
  293. nextSelector : 'div#pagination a#nextPage',
  294. itemSelector : '.entry',
  295. loading: {
  296. finishedMsg: '',
  297. img: 'http://static.tumblr.com/apahx90/gbVmpo84y/ajax-loader-1.gif'
  298. },
  299. bufferPx : 600,
  300. debug : false,
  301. },
  302. // call masonry as a callback.
  303. function( newElements ) {
  304. var $newElems = $( newElements );
  305. $newElems.hide();
  306. // ensure that images load before adding to masonry layout
  307. $newElems.imagesLoaded(function(){
  308. $content.masonry( 'appended', $newElems, true, function(){$newElems.fadeIn(1300);} );
  309. });
  310. });
  311. });
  312. </script>
  313. {/block:IndexPage}
  314. <meta name="viewport" content="width=800" />
  315.  
  316. </head><body>
  317. <div class="linear"></div>
  318. <div id="sidebar">
  319. <div class="links_list">
  320. <span class="links_title"><div class="blogtitle">{title}</div></span>
  321. <div class="description">{description}</div></div>
  322. <div class="links">
  323. / <a href="/">home</a><br>
  324. {block:iflinkonetitle}/ <a href="{text:link one}">{text:link one title}</a><br>{/block:iflinkonetitle}
  325. {block:iflinktwotitle}/ <a href="{text:link two}">{text:link two title}</a><br>{/block:iflinktwotitle}
  326. {block:iflinkthreetitle}/ <a href="{text:link three}">{text:link three title}</a><br>{/block:iflinkthreetitle}
  327. {block:iflinkfourtitle}/ <a href="{text:link four}">{text:link four title}</a><br>{/block:iflinkfourtitle}
  328. {block:iflinkfivetitle}/ <a href="{text:link five}">{text:link five title}</a><br>{/block:iflinkfivetitle}
  329. <!-- please keep this credit intact and i will keep my themes free -->
  330. / <a href="http://decade.tumblr.com">theme</a>
  331. </div>
  332. </div>
  333. <div class="autopagerize_page_element">
  334. <div id="posts">
  335.  
  336. {block:Posts}
  337. <div class="entry">
  338.  
  339. {block:Text}
  340. {block:Title}<div class="title">{Title}</div>{/block:Title}
  341. {Body}
  342. {block:IndexPage}
  343. <div class="photoperm"><a href="{reblogurl}" target="_blank">reblog</a> &middot; <a href="{permalink}">{notecountwithlabel}</a></div>
  344. {/block:IndexPage}
  345. {/block:Text}
  346.  
  347. {block:Link}
  348. <a href="{URL}" class="title">{Name}</a>
  349. {block:Description}{Description}{/block:Description}
  350. {block:IndexPage}
  351. <div class="photoperm"><a href="{reblogurl}" target="_blank">reblog</a> &middot; <a href="{permalink}">{notecountwithlabel}</a></div>
  352. {/block:IndexPage}
  353. {block:Link}
  354.  
  355. {block:Photo}
  356. <div class="img">
  357. {block:IndexPage}
  358. <a href="{reblogurl}" target="_blank"><div class="corner"></div></a>
  359. {/block:indexpage}
  360. {block:indexpage}
  361. <a href="{permalink}"><img src="{PhotoURL-HighRes}" width="100%"></img></a>{/block:IndexPage}{block:PermalinkPage}<img src="{PhotoURL-500}" width="500px" class="border"></img>{/block:PermalinkPage}{LinkCloseTag}{/block:PermalinkPage}
  362. {block:IndexPage}
  363.  
  364. {/block:IndexPage}
  365. </div>
  366. {/block:Photo}
  367.  
  368. {block:Answer}
  369. <img src="{AskerPortraitURL-30}" width="30" align="left" style="margin-right:3px;border-radius:100px;"/>
  370. <b>{Asker}</b>: <b>{Question}</b>{Answer}
  371. {block:IndexPage}
  372. <div class="photoperm"><a href="{reblogurl}" target="_blank">reblog</a> &middot; <a href="{permalink}">{notecountwithlabel}</a></div>
  373. {/block:IndexPage}
  374. {/block:Answer}
  375.  
  376. {block:Photoset}
  377. <div class="img">
  378. {block:IndexPage}<a href="{permalink}">{block:Photos}<img src="{PhotoURL-HighRes}" alt="{PhotoAlt}" width="250px"/>{/block:Photos}<div style="display:none;">{block:RebloggedFrom}{ReblogParentName}{ReblogParentTitle}{ReblogParentURL}{/block:RebloggedFrom}{block:ContentSource}{SourceURL} {/block:ContentSource}</div></a>{/block:IndexPage}
  379. {block:PermalinkPage}<center>{Photoset-500}</center>{/block:PermalinkPage}
  380. </div>
  381. {block:IndexPage}
  382. <div class="photoperm"><a href="{reblogurl}" target="_blank">reblog</a> &middot; <a href="{permalink}">{notecountwithlabel}</a></div>
  383. {/block:IndexPage}
  384. {/block:Photoset}
  385.  
  386. {block:Quote}
  387. {Quote} - {source}
  388. {block:IndexPage}
  389. <div class="photoperm"><a href="{reblogurl}" target="_blank">reblog</a> &middot; <a href="{permalink}">{notecountwithlabel}</a></div>
  390. {/block:IndexPage}
  391. {/block:Quote}
  392.  
  393. {block:Audio}
  394. {block:indexpage}
  395. <div class="audio">{block:AlbumArt}<a href="{permalink}" title="{block:Artist}{Artist}{/block:Artist} - {block:TrackName}{TrackName}{/block:TrackName}"><img src="{AlbumArtURL}" style="width:250px;height:auto;position:relative;" class="ig"/></a>{/block:AlbumArt}</div><div class="hear">
  396. <div class="player">
  397. {AudioPlayerBlack}</div></div>
  398. {block:ExternalAudio}{/block:ExternalAudio}
  399. {/block:indexpage}
  400. {block:permalinkpage}
  401. <div id="audio">{block:AlbumArt}<img src="{AlbumArtURL}" style="width:47px;height:47px;position:relative;">{/block:AlbumArt}</div><div style="float:left;text-align:left;width:450px;height:27px;padding-top:10px;padding-bottom:10px;{block:albumart}margin-top:-51px;{/block:albumart}float:right;background-color:#000000;">{AudioPlayerBlack height="50" width="420"}
  402. {block:ExternalAudio}{/block:ExternalAudio}</div>
  403. {/block:permalinkpage}
  404. {/block:Audio}
  405.  
  406. {block:video}
  407. {block:indexpage}
  408. {video-250}
  409. {block:indexpage}
  410. {block:permalinkpage}
  411. {video-500}
  412. {/block:permalinkpage}
  413. {block:IndexPage}
  414. <div class="photoperm"><a href="{reblogurl}" target="_blank">reblog</a> &middot; <a href="{permalink}">{notecountwithlabel}</a></div>
  415. {/block:IndexPage}
  416. {/block:video}
  417.  
  418. {block:Chat}
  419. {block:Title}<div class="title"><center>{Title}</center></div>{/block:Title}
  420. <div class="chat">
  421. <div class="lines">
  422. {block:Lines}
  423. <div class="line {Alt}">{block:Label}<strong>{Label}</strong>{/block:Label} {Line}</div>
  424. {/block:Lines}
  425. </div>
  426. </div>
  427. {block:IndexPage}
  428. <div class="photoperm"><a href="{reblogurl}" target="_blank">reblog</a> &middot; <a href="{permalink}">{notecountwithlabel}</a></div>
  429. {/block:IndexPage}
  430. {/block:Chat}
  431.  
  432. {block:IndexPage}
  433. <div style="display:none;">
  434. {block:ContentSource}
  435. <a href="{SourceURL}">
  436. {lang:Source}:
  437. {block:SourceLogo}<img src="{BlackLogoURL}" width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" />{/block:SourceLogo}
  438. {block:NoSourceLogo}{SourceTitle}{/block:NoSourceLogo}
  439. </a>via {ReblogParentName}{block:RebloggedFromReblog}{/block:RebloggedFromReblog}{/block:ContentSource}</div>
  440. {/block:IndexPage}
  441.  
  442. {block:PermalinkPage}
  443. <center>
  444. {block:Date}
  445. <center>
  446. {TimeAgo} | {12HourWithZero}:{Minutes}{AmPm}
  447. <br>{block:Caption}{Caption}{/block:Caption}{block:NoteCount}{NoteCountWithLabel}{/block:NoteCount}{block:HasTags} &middot; {block:Tags}<a href="http://tumblr.com/tagged/{Tag}" target="blank">#{Tag}</a> {/block:Tags}{/block:hasTags}</center>
  448. {/block:Date}
  449. {block:RebloggedFrom}
  450. <center><br>{via: <a href="{ReblogParentURL}">{ReblogParentName}</a>}
  451. </center>
  452. {/block:RebloggedFrom}
  453. {/block:PermalinkPage}
  454.  
  455. {block:PostNotes}<div class="notes">{PostNotes}</div>
  456. {/block:PostNotes}
  457. </div>
  458.  
  459.  
  460. {/block:Posts}
  461. </div>
  462. </div></div>
  463. <div class="right">
  464. </div>
  465. <div class="footer">
  466. <br>
  467. </div>
  468. </body>
  469. </html>
  470. <div style="position:fixed;right:0px;bottom:-425px;">
  471. {block:IndexPage}
  472. {block:Pagination}
  473. <div id="pagination">
  474. {block:NextPage}
  475. <a id="nextPage" href="{NextPage}">&nbsp;&rarr;</a>
  476. {/block:NextPage}
  477. {block:PreviousPage}
  478. <a href="{PreviousPage}">&larr;&nbsp;</a>
  479. {/block:PreviousPage}
  480. </div>
  481. {/block:Pagination}
  482. {/block:IndexPage}</div>
  483. </div>
  484. </body>
  485. <script src="http://static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script>
  486. <script>
  487. (function($){
  488. $(document).ready(function(){
  489. $("[title],a[title],img[title]").style_my_tooltips({
  490. tip_follows_cursor:true,
  491. tip_delay_time:100,
  492. tip_fade_speed:300,
  493. attribute:"title"
  494. });
  495. });
  496. })(jQuery);
  497. </script>
  498. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement