Advertisement
singforabsolution

Theme 28

Dec 29th, 2012
2,081
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 15.33 KB | None | 0 0
  1. <!--
  2. by tomkirk.tumblr.com
  3. -->
  4.  
  5. <html>
  6. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  7. <html xmlns="http://www.w3.org/1999/xhtml">
  8. <head>
  9. <link href='http://fonts.googleapis.com/css?family=Average+Sans|Muli|Scada|Telex|Megrim|Inconsolata' rel='stylesheet' type='text/css'>
  10.  
  11. <!--Default Variables-->
  12. <!--Colors-->
  13. <meta name="color:Background" content="#ffffff"/>
  14. <meta name="color:Blockquote" content="#f8f8f8"/>
  15. <meta name="color:Border" content="#e8e8e8"/>
  16. <meta name="color:Link" content="#c3b5ca"/>
  17. <meta name="color:Link Hover" content="#e8e8e8"/>
  18. <meta name="color:Permalink" content="#ffffff"/>
  19. <meta name="color:Sidelinks" content="#c3b5ca"/>
  20. <meta name="color:Sidelinks Hover" content="#ffffff"/>
  21. <meta name="color:Scrollbar" content="#c3b5ca"/>
  22. <meta name="color:Text" content="#acacac"/>
  23.  
  24. <!--Images-->
  25. <meta name="image:Background" content""/>
  26.  
  27. <!--Options-->
  28. <meta name="if:Crosshair Cursor" content="1"/>
  29. <meta name="if:Tiny Cursor" content=""/>
  30. <meta name="if:Captions" content="1"/>
  31. <meta name="if:Faded Images" content=""/>
  32. <meta name="if:Inverted Images" content=""/>
  33.  
  34. <!--Links-->
  35. <meta name="text:Link 1 URL" content="/"/>
  36. <meta name="text:Link 1 name" content=""/>
  37. <meta name="text:Link 2 URL" content="/"/>
  38. <meta name="text:Link 2 name" content=""/>
  39. <meta name="text:Link 3 URL" content="/"/>
  40. <meta name="text:Link 3 name" content=""/>
  41. <meta name="text:Link 4 URL" content="/"/>
  42. <meta name="text:Link 4 name" content=""/>
  43. <meta name="text:Link 5 URL" content="/"/>
  44. <meta name="text:Link 5 name" content=""/>
  45.  
  46. {block:ifCrosshairCursor}
  47. <style type="text/css">body { cursor: crosshair; } </style>
  48. {/block:ifCrosshairCursor}
  49.  
  50. <script type="text/javascript" language="javascript" src="http://assets.tumblr.com/javascript/tumblelog.js?7"></script>
  51.  
  52. <script type="text/javascript" src="/api/read/json?id={PostID}"></script>
  53. <script type="text/javascript">
  54. var color = "ff0000";
  55. var player = tumblr_api_read['posts'][0]['audio-player'].replace("color=FFFFFF", "color=" + color);
  56. replaceIfFlash(9, "audio_player_{PostID}", player);
  57. </script>
  58. <style type="text/css">
  59.  
  60.  
  61. .wrapper{
  62. margin:auto;
  63. width: 717px;
  64. }
  65.  
  66. #tumblr_controls{
  67. position:fixed !important;
  68. top: 3px;
  69. right: 3px;
  70. }
  71.  
  72. {block:ifInvertedImages}img{
  73. opacity: 1;
  74. filter:alpha(opacity=10);
  75. -moz-opacity: 0.1;
  76. -moz-transition: all .9s ease;
  77. -o-transition: all .9s ease;
  78. transition: all .9s ease;
  79. -webkit-transition: all .9s ease;}
  80. {/block:ifInvertedImages}
  81.  
  82.  
  83. {block:ifInvertedImages} img:hover{
  84. opacity: .8;
  85. filter:alpha(opacity=100);
  86. -moz-opacity: 1;
  87. -moz-transition: all .9s ease;
  88. -o-transition: all .9s ease;
  89. transition: all .9s ease;
  90. -webkit-transition: all .9s ease;}
  91. {/block:ifInvertedImages}
  92.  
  93. {block:ifFadedImages}img{
  94. opacity: .6;
  95. filter:alpha(opacity=10);
  96. -moz-opacity: 0.1;
  97. -moz-transition: all .9s ease;
  98. -o-transition: all .9s ease;
  99. transition: all .9s ease;
  100. -webkit-transition: all .9s ease;}
  101. {/block:ifFadedImages}
  102.  
  103.  
  104. {block:ifFadedImages} img:hover{
  105. opacity: 1;
  106. filter:alpha(opacity=100);
  107. -moz-opacity: 1;
  108. -moz-transition: all .9s ease;
  109. -o-transition: all .9s ease;
  110. transition: all .9s ease;
  111. -webkit-transition: all .9s ease;}
  112. {/block:ifFadedImages}
  113.  
  114. {block:ifInvertedImages}.photo {
  115. opacity: 1;
  116. filter:alpha(opacity=10);
  117. -moz-opacity: 0.1;
  118. -moz-transition: all .9s ease;
  119. -o-transition: all .9s ease;
  120. transition: all .9s ease;
  121. -webkit-transition: all .9s ease;}
  122. {/block:ifInvertedImages}
  123.  
  124.  
  125. {block:ifInvertedImages}.photo:hover{
  126. opacity: .8;
  127. filter:alpha(opacity=100);
  128. -moz-opacity: 1;
  129. -moz-transition: all .9s ease;
  130. -o-transition: all .9s ease;
  131. transition: all .9s ease;
  132. -webkit-transition: all .9s ease;}
  133. {/block:ifInvertedImages}
  134.  
  135. {block:ifFadedImages}.photo {
  136. opacity: .8;
  137. filter:alpha(opacity=10);
  138. -moz-opacity: 0.1;
  139. -moz-transition: all .9s ease;
  140. -o-transition: all .9s ease;
  141. transition: all .9s ease;
  142. -webkit-transition: all .9s ease;}
  143. {/block:ifFadedImages}
  144.  
  145.  
  146. {block:ifFadedImages}.photo:hover{
  147. opacity: 1;
  148. filter:alpha(opacity=100);
  149. -moz-opacity: 1;
  150. -moz-transition: all .9s ease;
  151. -o-transition: all .9s ease;
  152. transition: all .9s ease;
  153. -webkit-transition: all .9s ease;}
  154. {/block:ifFadedImages}
  155.  
  156. ::-webkit-scrollbar {width: 4px; height: 4px; background:{color:Background}; }
  157. ::-webkit-scrollbar-thumb { background-color: {color:Scrollbar};}
  158.  
  159. iframe#tumblr_controls {-webkit-filter:invert(100%);right:3px !important; position: fixed !important;-webkit-transition: opacity 0.7s linear;opacity: 0.2;-webkit-transition: all 0.8s ease-out;-moz-transition: all 0.8s ease-out;transition: all 0.8s ease-out;}
  160.  
  161.  
  162. iframe#tumblr_controls:hover{-webkit-transition: opacity 0.7s linear;opacity: .9;-webkit-transition: all 0.4s ease-out;-moz-transition: all 0.4s ease-out;transition: all 0.4s ease-out;}
  163.  
  164.  
  165. {block:iftinycursor}
  166. body, a, a:hover {cursor: url(http://img69.imageshack.us/img69/7673/cursorw.png), progress;}
  167. {/block:iftinycursor}
  168.  
  169. body{
  170. background-color: {color:Background};
  171. background-image: url({image:Background});
  172. background-size:100% 100%;
  173. background-attachment: fixed;
  174. background-repeat: repeat;
  175. background-position: center;
  176. font-family:georgia;
  177. font-size:10px;
  178. line-height:12px;
  179. color:{color:Text};
  180. }
  181.  
  182. a:link, a:active, a:visited{
  183. color: {color:Link};
  184. text-decoration:none;
  185. -webkit-transition: all 0.1s linear;
  186. -moz-transition: all 0.1s linear;
  187. transition: all 0.1s linear;
  188. }
  189. a:hover{
  190. color: {color:Link Hover};
  191. {block:ifCrosshairCursor}
  192. cursor:crosshair;
  193. {/block:ifCrosshairCursor}
  194. {block:iftinycursor}
  195. cursor: url(http://img69.imageshack.us/img69/7673/cursorw.png), progress;
  196. {/block:iftinycursor}
  197. }
  198.  
  199. #posts {
  200. position:relative;
  201. {block:IndexPage}
  202. margin-left:95px;
  203. width: 600px;
  204. {/block:IndexPage}
  205. {block:PermalinkPage}
  206. width: 500px;
  207. margin-left:110px;
  208. margin-top:25px;
  209. {/block:PermalinkPage}
  210. }
  211.  
  212. .entry {
  213. position:relative;
  214. background:white;
  215. padding:7px;
  216. border:1px solid {color:Border};
  217. {block:PermalinkPage}
  218. width: 500px;
  219. float: left;
  220. {/block:PermalinkPage}
  221. {block:IndexPage}
  222. margin: 5px;
  223. margin: 17px;
  224. float: left;
  225. width: 250px;
  226. {/block:IndexPage}
  227. }
  228.  
  229. .entry img{
  230. {block:IndexPage}
  231. max-width:250px;
  232. {/block:IndexPage}
  233. {block:PermalinkPage}
  234. max-width:500px;
  235. {/block:PermalinkPage}
  236. }
  237.  
  238. .entry .permalink{
  239. position:absolute;
  240. padding-left:4px;
  241. padding-right:4px;
  242. margin-top:2px;
  243. opacity:0;
  244. text-align:center;
  245. font-size:8px;
  246. letter-spacing:1px;
  247. text-transform:uppercase;
  248. font-family:Inconsolata;
  249. color:{color:Link};
  250. background:{color:Permalink};
  251. z-index:1;
  252. -webkit-transition: all 0.3s linear;
  253. -moz-transition: all 0.3s linear;
  254. transition: all 0.3s linear;
  255. }
  256.  
  257. .entry:hover .permalink{
  258. opacity:1;
  259. }
  260.  
  261. #side {
  262. position:fixed;
  263. text-align:right;
  264. z-index:19999;
  265. margin-top:100px;
  266. {block:IndexPage}
  267. margin-left:-130px;
  268. width: 220px;
  269. {/block:IndexPage}
  270. {block:PermalinkPage}
  271. width: 220px;
  272. margin-left:-130px;
  273. {/block:PermalinkPage}
  274. }
  275.  
  276. .navigate{
  277. margin-top:4px;
  278. font-family:Inconsolata;
  279. }
  280.  
  281. .navigate a{
  282. font-size:10px;
  283. line-height:18px;
  284. padding:1px;
  285. padding-right:4px;
  286. padding-left:4px;
  287. margin-left:3px;
  288. color:{color:Sidelinks};
  289. }
  290.  
  291. .navigate a:hover{
  292. color:{color:Sidelinks Hover};
  293. }
  294.  
  295. .blogtitle{
  296. font-size:19px;
  297. line-height:20px;
  298. letter-spacing:1px;
  299. text-transform:uppercase;
  300. font-family:Inconsolata;
  301. }
  302.  
  303. .posttitle{
  304. font-size: 17px;
  305. line-height: 18px;
  306. font-family:Inconsolata;
  307. }
  308.  
  309. .info{
  310. margin-top:5px;
  311. margin-left:10px;
  312. font-style:italic;
  313. }
  314.  
  315. #ask {
  316. padding:5px;
  317. width:240px;
  318. }
  319.  
  320. .askername{
  321. position:absolute;
  322. margin-top:-37px;
  323. margin-left:60px;
  324. font-size:10px;
  325. font-style:italic;
  326. border-bottom:1px solid {color:Border};
  327. {block:IndexPage}
  328. width:184px;
  329. {/block:IndexPage}
  330. {block:PermalinkPage}
  331. width:434px;
  332. {/block:PermalinkPage}
  333. }
  334.  
  335. .askerp img{
  336. border:4px solid {color:Border};
  337. }
  338.  
  339.  
  340. #postnotes{
  341. text-align: justify;
  342. }
  343.  
  344. #postnotes blockquote{
  345. border: 0px;}
  346.  
  347. #infscr-loading{
  348. bottom: -70px;
  349. position: absolute;
  350. left: 50%;
  351. margin-left:-8px;
  352. width:16px;
  353. height:11px;
  354. overflow:hidden;
  355. margin-bottom: 50px;
  356. }
  357.  
  358. blockquote{
  359. margin-top:5px;
  360. margin-bottom:5px;
  361. margin-left:20px;
  362. margin-right:0px;
  363. padding:2px;
  364. padding-left:5px;
  365. background:{color:Blockquote};
  366. border-left: 1px solid {color:Border};
  367. }
  368.  
  369. blockquote p, ul{
  370. margin:0px;
  371. padding:0px;
  372. }
  373.  
  374. .p { padding-top: 5px; }
  375. .ol, ul { margin-left: 10px; padding: 5px; }
  376. .ul { list-style-type: square; }
  377.  
  378. a img{border: 0px;}
  379.  
  380.  
  381. .chat .line{
  382. margin-top:-2px;
  383. padding: 4px;
  384. }
  385. .chat .line.odd{
  386. margin-top:-2px;
  387. }
  388.  
  389. .label {font-weight:bold;}
  390.  
  391. .cover {position: absolute; z-index: 1;}
  392.  
  393. .audioplayer {position:absolute; overflow:hidden; background:#E4E4E4; width:102px; height:100px; top:7; margin-left:128px; padding:10px;}
  394.  
  395. .button { position:absolute; overflow:hidden; width:27px; height:27px; margin-top:37px; margin-left:37px;}
  396.  
  397. .notes img{width:10px; position:left; top:3px; -webkit-border-radius: 10px;
  398. -moz-border-radius: 10px; border-radius: 10px;}
  399.  
  400. #c{
  401. position:fixed;
  402. font-family:Inconsolata;
  403. font-size:15px;
  404. bottom:0;
  405. right:0;
  406. padding:8px;
  407. }
  408.  
  409. {CustomCSS}
  410. </style>
  411.  
  412. <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
  413. <script type="text/javascript">
  414. $(function(){
  415. $("#pageLink").click(function(){
  416. $("#titlePages").fadeToggle(500);
  417. });
  418. });
  419. </script>
  420.  
  421. {block:IndexPage}
  422. <script type="text/javascript" src="http://static.tumblr.com/dbek3sy/4IKlvmzup/jquery.masonry.min.js"></script>
  423. <script type="text/javascript" src="http://static.tumblr.com/dbek3sy/Qyblrgjfn/jqueryinfintescroll.js"></script>
  424. <script type="text/javascript">
  425. $(window).load(function () {
  426. var $content = $('#posts');
  427. $content.masonry({
  428. itemSelector: '.entry',
  429. isAnimated: true
  430. }),
  431. $content.infinitescroll({
  432. navSelector : '#pagination',
  433. nextSelector : '#pagination a#nextPage',
  434. itemSelector : '.entry',
  435. loading: {
  436. finishedMsg: '',
  437. img: 'http://media.tumblr.com/871eca69efd6efa91d7720ed12ee9f16/tumblr_inline_mfnx20Wezl1rs8bwg.jpg'
  438. },
  439. bufferPx : 200,
  440. debug : false,
  441. },
  442. // call masonry as a callback.
  443. function( newElements ) {
  444. var $newElems = $( newElements );
  445. $newElems.hide();
  446. // ensure that images load before adding to masonry layout
  447. $newElems.imagesLoaded(function(){
  448. $content.masonry( 'appended',
  449. $newElems, true,
  450. function(){$newElems.fadeIn(300);}
  451. );
  452.  
  453.  
  454. });
  455. });
  456. });
  457. </script>
  458. {/block:IndexPage}
  459.  
  460. <title>{title}</title>
  461.  
  462. <link rel="shortcut icon" href="{Favicon}">
  463. <link rel="alternate" type="application/rss+xml" title="RSS" href="{RSS}" />
  464. <meta name="viewport" content="width=820" />
  465.  
  466. </head>
  467. <body>
  468. <div class="wrapper">
  469. <div id="c">
  470. <a href="http://tomkirk.tumblr.com/"> ☼ </a>
  471. </div>
  472. <div id="side">
  473. <div class="blogtitle"><a href="/">{Title}</a></div>
  474. <div style="padding:3px;padding-bottom:5px;border-bottom:1px solid {color:Border};">
  475. {Description}
  476. </div>
  477.  
  478. <div class="navigate">
  479. <a href="{text:Link 1 URL}">{text:Link 1 name}</a>
  480. <a href="{text:Link 2 URL}">{text:Link 2 name}</a>
  481. <a href="{text:Link 3 URL}">{text:Link 3 name}</a>
  482. <a href="{text:Link 4 URL}">{text:Link 4 name}</a>
  483. <a href="{text:Link 5 URL}">{text:Link 5 name}</a>
  484. </div>
  485. </div>
  486.  
  487. <div id="posts">
  488.  
  489. {block:Posts}
  490. <div class="entry">
  491.  
  492. {block:Answer}
  493. <div id="ask">
  494. <div class="askerp">
  495. <img src="{AskerPortraitURL-48}">
  496. </div>
  497. <div class="question">
  498. <div class="askername">{Asker} asked:
  499. </div>
  500. <div style="padding:4px;">
  501. {Question}
  502. </div>
  503. </div>
  504. {Answer}
  505. </div>
  506. {/block:Answer}
  507.  
  508. {block:Text}
  509. {block:Title}
  510. <div class="posttitle">{Title}</div>
  511. {/block:Title}
  512. {Body}
  513. {/block:Text}
  514.  
  515. {block:Link}
  516. <div class="posttitle">
  517. <a href="{URL}">{Name} »</a>
  518. </div>
  519. {block:Description}{Description}{/block:Description}
  520. {/block:Link}
  521.  
  522. {block:Photo}
  523. {LinkOpenTag}
  524. <div id="pic">
  525. <a href="{permalink}">
  526. <img src="{PhotoURL-500}" alt="{PhotoAlt}" width="500"></a>
  527. </div>
  528. {LinkCloseTag}
  529. {block:PermalinkPage}
  530. {/block:PermalinkPage}
  531. {block:ContentSource}
  532. <!-- {SourceURL}{block:SourceLogo}<img src="{BlackLogoURL}"
  533. width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" />
  534. {/block:SourceLogo}
  535. {block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo} -->
  536. {/block:ContentSource}
  537. {block:ReblogParentURL}
  538. <!-- {block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo} -->
  539. {/block:ReblogParentURL}
  540. {block:ifCaptions}
  541. {block:Caption}{Caption}{/block:Caption}
  542. {/block:ifCaptions}
  543. {block:ifNotCaptions}
  544. {block:PermalinkPage}
  545. {block:Caption}{Caption}{/block:Caption}
  546. {/block:PermalinkPage}
  547. {/block:ifNotCaptions}
  548. {/block:Photo}
  549.  
  550. {block:Photoset}
  551. <div class="photo">
  552. {block:IndexPage}
  553. {Photoset-250}
  554. {/block:IndexPage}
  555. {block:PermalinkPage}
  556. {Photoset-500}
  557. {/block:PermalinkPage}
  558. </div>
  559. {block:ifCaptions}
  560. {block:Caption}{Caption}{/block:Caption}
  561. {/block:ifCaptions}
  562. {block:ifNotCaptions}
  563. {block:PermalinkPage}
  564. {block:Caption}{Caption}{/block:Caption}
  565. {/block:PermalinkPage}
  566. {/block:ifNotCaptions}
  567. {/block:Photoset}
  568.  
  569. {block:Quote}
  570. <div class="posttitle">"{Quote}"</div>
  571. {block:Source}
  572. <div class="info"> - {Source}</div>
  573. {/block:Source}
  574. {/block:Quote}
  575.  
  576. {block:Chat}
  577. {block:Title}
  578. <div class="posttitle">
  579. {Title}
  580. </div>
  581. {/block:Title}
  582. <div class="chat">
  583. {block:Lines}
  584. <div class="chat">
  585. <div class="line {Alt}">
  586. <div class="{Alt} user_{UserNumber}">
  587. {block:Label}
  588. <b>{Label} </b>
  589. {/block:Label}
  590. {Line}
  591. </div>
  592. </div>
  593. </div>
  594. {/block:Lines}
  595. </div>
  596. {/block:Chat}
  597.  
  598. {block:Audio}
  599.  
  600. {block:AudioPlayer}
  601. <div class="audioplayer">
  602. <div class="button">
  603. {AudioPlayerGrey}
  604. </div>
  605. </div>
  606. {/block:AudioPlayer}
  607.  
  608. {block:Albumart}
  609. <div class="albumart">
  610. <img src="{albumarturl}" width="120">
  611. </div>
  612. {/block:Albumart}
  613. {block:ifCaptions}
  614. {block:Caption}{Caption}{/block:Caption}
  615. {/block:ifCaptions}
  616. {block:ifNotCaptions}
  617. {block:PermalinkPage}
  618. {block:Caption}{Caption}{/block:Caption}
  619. {/block:PermalinkPage}
  620. {/block:ifNotCaptions}
  621. {/block:Audio}
  622.  
  623. {block:Video}
  624. <div class="photo">
  625. {block:IndexPage}
  626. {Video-250}
  627. {/block:IndexPage}
  628. {block:PermalinkPage}
  629. {Video-500}
  630. {/block:PermalinkPage}
  631. </div>
  632. {block:ifCaptions}
  633. {block:Caption}{Caption}{/block:Caption}
  634. {/block:ifCaptions}
  635. {block:ifNotCaptions}
  636. {block:PermalinkPage}
  637. {block:Caption}{Caption}{/block:Caption}
  638. {/block:PermalinkPage}
  639. {/block:ifNotCaptions}
  640. {/block:Video}
  641.  
  642. {block:IndexPage}
  643. <div class="permalink">
  644. <a href="{Permalink}">{NoteCountWithLabel} </a>
  645. |
  646. <a href="{ReblogURL}" target="_blank" class="details">reblog</a>
  647. </a>
  648. </div>
  649. {/block:IndexPage}
  650.  
  651. {block:PermalinkPage}
  652. <div id="permalink">
  653. {block:Date}
  654. {TimeAgo} on
  655. {ShortMonth} {DayofMonth},{Year}
  656. {/block:Date}
  657. {block:NoteCount} · {NoteCountWithLabel}
  658. {/block:NoteCount}
  659. {block:HasTags} · Tags:
  660. {block:Tags}#<a href="{TagURL}">{Tag} </a>
  661. {/block:Tags}
  662. {/block:HasTags}
  663. <br>{block:RebloggedFrom}via: <a href="{ReblogParentURL}" target="_blank">{ReblogParentName}</a> · (©: <a href="{ReblogRootURL}" target="_blank">{ReblogRootName}</a>) {/block:RebloggedFrom}
  664. </div>
  665. {/block:PermalinkPage}
  666.  
  667. {/block:PermalinkPage}
  668.  
  669. {block:PostNotes}{PostNotes}
  670. {/block:PostNotes}
  671. </div>
  672.  
  673.  
  674. {/block:Posts}
  675. </div>
  676. </div>
  677. {block:IndexPage}<br>
  678. {block:Pagination}
  679. <div id="pagination">
  680. {block:NextPage}
  681. <a id="nextPage" href="{NextPage}"> </a>
  682. {/block:NextPage}
  683. {block:PreviousPage}
  684. <a href="{PreviousPage}"> </a>
  685. {/block:PreviousPage}
  686. </div>
  687. {/block:Pagination}
  688. {/block:IndexPage}
  689. </div>
  690. </body>
  691. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement