Advertisement
ILikeMochiCx

Airborne

May 21st, 2018
5,536
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 27.27 KB | None | 0 0
  1. <!DOCTYPE html>
  2. <html>
  3.  
  4. <head>
  5. <link href='https://fonts.googleapis.com/css?family=Libre+Baskerville:400italic' rel='stylesheet' type='text/css'>
  6. <link href="https://fonts.googleapis.com/css?family=Lato:700|Source+Sans+Pro:400,400i,700" rel="stylesheet">
  7. <link href="https://file.myfontastic.com/S8E3xNJickH6zYXAALoSQh/icons.css" rel="stylesheet">
  8.  
  9. <title>{Title}</title>
  10.  
  11. <!--
  12. ___________________________________________________________________________
  13.  
  14.  
  15. Airborne - Theme #13
  16. my usual terms apply; please do not redstribute, copy, or steal in any way
  17.  
  18. shoseii.tumblr.com
  19.  
  20. ___________________________________________________________________________
  21.  
  22. -->
  23.  
  24. <link rel="shortcut icon" href="{Favicon}">
  25. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  26.  
  27. <link href="http://static.tumblr.com/qudkd6d/OcDnl99gb/style.css" rel="stylesheet" type="text/css"/>
  28.  
  29.  
  30. {block:Description}<meta name="description" content="{MetaDescription}" />
  31. {/block:Description}
  32.  
  33. <meta name="image:Background" content=""/>
  34. <meta name="image:Icon" content=""/>
  35. <meta name="image:Sidebar" content=""/>
  36.  
  37. <meta name="color:Background" content="#e6ecf0"/>
  38. <meta name="color:Posts Background" content="#ffffff"/>
  39. <meta name="color:Border Color" content="#eeeeee"/>
  40. <meta name="color:Text" content="#000000"/>
  41. <meta name="color:Bold" content="#315283"/>
  42. <meta name="color:Caption" content="#f9f9f9"/>
  43. <meta name="color:Caption Text" content="#898989"/>
  44. <meta name="color:Title" content="#000000"/>
  45. <meta name="color:Link" content="#797979"/>
  46. <meta name="color:Link Hover" content="#5d8cd1"/>
  47. <meta name="color:Nav Links Hover Text" content="#ffffff"/>
  48. <meta name="color:Nav Links Hover Background" content="#000000"/>
  49. <meta name="color:Selection" content="#a5d7f0"/>
  50. <meta name="color:Scrollbar" content="#cccccc"/>
  51.  
  52. <meta name="text:Link 1" content=""/>
  53. <meta name="text:Link 1 URL" content=""/>
  54. <meta name="text:Link 2" content=""/>
  55. <meta name="text:Link 2 URL" content=""/>
  56. <meta name="text:Link 3" content=""/>
  57. <meta name="text:Link 3 URL" content=""/>
  58. <meta name="text:Link 4" content=""/>
  59. <meta name="text:Link 4 URL" content=""/>
  60.  
  61. <meta name="select:Post Width" content="250" title="250px"/>
  62. <meta name="select:Post Width" content="300" title="300px"/>
  63. <meta name="select:Post Width" content="350" title="350px"/>
  64. <meta name="select:Post Width" content="400" title="400px"/>
  65.  
  66. <meta name="if:Infinite Scroll" content="1"/>
  67. <meta name="if:Manual Load" content="1"/>
  68. <meta name="if:Mini Cursor" content=""/>
  69. <meta name="if:Show Tags" content=""/>
  70. <meta name="if:Grayscale Effect" content=""/>
  71. <meta name="if:Post Fade" content="1"/>
  72. <meta name="if:Show Caption" content=""/>
  73. <meta name="if:Two Column" content=""/>
  74.  
  75. <style type="text/css">
  76.  
  77. {block:ifMiniCursor}
  78. *, body, a {cursor: url(http://static.tumblr.com/p7wg3p9/o3jmn8igq/tiny.png), auto;}
  79.  
  80. a:hover {cursor: url(http://static.tumblr.com/p7wg3p9/EWnmn8ip5/tinyhover.png), auto;}
  81. {/block:ifMiniCursor}
  82.  
  83. ::-webkit-scrollbar{
  84. width:12px;
  85. height:12px;
  86. background-color:{color:Background};
  87. }
  88.  
  89. ::-webkit-scrollbar:horizontal{
  90. display:none;
  91. }
  92.  
  93. ::-webkit-scrollbar-track {
  94. border:5px solid {color:Background};
  95. background-color:{color:Scrollbar};
  96. }
  97.  
  98. ::-webkit-scrollbar-thumb {
  99. border:3px solid {color:Background};
  100. background-color:{color:Scrollbar};
  101. }
  102.  
  103. ::-moz-selection{
  104. background:{color:Selection};
  105. color:#fff;
  106. }
  107.  
  108. ::selection{
  109. background:{color:Selection};
  110. color:#fff;
  111. }
  112.  
  113. body{
  114. font:13px 'source sans pro', sans-serif;
  115. line-height:18px;
  116. font-weight:400;
  117. color:{color:Text};
  118. text-align:left;
  119. -webkit-font-smoothing: antialiased;
  120. -moz-osx-font-smoothing: grayscale;
  121. background:{color:Background} url('{image:Background}') fixed repeat center;
  122. }
  123.  
  124. a{
  125. text-decoration:none;
  126. outline:none;
  127. -moz-outline-style:none;
  128. color:{color:Link};
  129. cursor:pointer;
  130. -webkit-transition: all 0.3s ease-in-out;
  131. -moz-transition: all 0.3s ease-in-out;
  132. -o-transition: all 0.3s ease-in-out;
  133. -ms-transition: all 0.3s ease-in-out
  134. transition: all 0.3s ease-in-out;
  135. }
  136.  
  137. a:visited{
  138. color:{color:Link};
  139. }
  140.  
  141. a:hover{
  142. color:{color:Link Hover};
  143. }
  144.  
  145. b,strong{
  146. font-weight:heavy;
  147. color:{color:Bold};
  148. }
  149.  
  150. blockquote{
  151. padding-left:5px;
  152. border-left:1px solid #ccc;
  153. font-size:12px;
  154. }
  155.  
  156. /*--Header--*/
  157.  
  158. header{
  159. position:fixed;
  160. background:{color:Posts Background};
  161. top:0px;
  162. left:0px;
  163. width:100vw;
  164. height:50px;
  165. overflow:hidden;
  166. z-index:9999;
  167. }
  168.  
  169. header a{
  170. display:inline-block;
  171. font-size:14px;
  172. font-weight:700;
  173. margin-left:5px;
  174. padding:16px;
  175. border-bottom:3px solid {color:Link Hover};
  176. }
  177.  
  178. header a:hover{
  179. padding-bottom:11px;
  180. }
  181.  
  182. header i{
  183. font-size:18px;
  184. margin-right:5px;
  185. vertical-align:-.2em;
  186. }
  187.  
  188. /*--Sidebar--*/
  189.  
  190. #sidebar{
  191. position:fixed;
  192. top:171px;
  193. width:300px;
  194. margin-left:-350px;
  195. padding:10px;
  196. z-index:99999;
  197. }
  198.  
  199. #icon img{
  200. position:absolute;
  201. background:{color:Posts Background};
  202. width:70px;
  203. height:70px;
  204. margin-top:21px;
  205. margin-left:10px;
  206. border-radius:100px;
  207. padding:5px;
  208. }
  209.  
  210. #sidebar2 img{
  211. position:absolute;
  212. width:320px;
  213. height:150px;
  214. margin-top:-80px;
  215. margin-left:-10px;
  216. z-index:-9;
  217. }
  218.  
  219. #title{
  220. position:absolute;
  221. margin-top:78px;
  222. margin-left:90px;
  223. font:bold 16px 'lato', sans-serif;
  224. z-index:9999999999;
  225. line-height:22px;
  226. text-transform:uppercase;
  227. letter-spacing:2px;
  228. -webkit-transition: all 0.3s ease-in-out;
  229. -moz-transition: all 0.3s ease-in-out;
  230. -o-transition: all 0.3s ease-in-out;
  231. -ms-transition: all 0.3s ease-in-out;
  232. transition: all 0.3s ease-in-out;
  233. }
  234.  
  235. #title a{
  236. color:{color:Title};
  237. }
  238.  
  239. #title a:hover{
  240. color:{color:Link Hover};
  241. }
  242.  
  243. #desc{
  244. background:{color:Posts Background};
  245. color:{color:Text};
  246. font-weight:400;
  247. margin-top:70px;
  248. margin-left:-10px;
  249. padding:35px 10px 10px 10px;
  250. width:300px;
  251. line-height:22px;
  252. }
  253.  
  254. .links{
  255. margin-top:20px;
  256. text-transform:uppercase;
  257. letter-spacing:2px;
  258. }
  259.  
  260. .links a{
  261. display:block;
  262. width:310px;
  263. background:{color:Posts Background};
  264. font-size:12px;
  265. margin-bottom:5px;
  266. margin-left:-10px;
  267. padding:5px;
  268. }
  269.  
  270. .links a:hover{
  271. color:{color:Nav Links Hover Text};
  272. background:{color:Nav Links Hover Background};
  273. }
  274.  
  275.  
  276. /*--Posts--*/
  277.  
  278. #center{
  279. width:calc({select:Post Width}px - 100px);
  280. {block:ifTwoColumn}
  281. width:calc({select:Post Width}px * 2 - 250px);
  282. {/block:ifTwoColumn}
  283. margin:0 auto;
  284. }
  285.  
  286. #content{
  287. position:relative;
  288. {block:ifTwoColumn}
  289. margin-top:-50px;
  290. width:calc({select:Post Width}px * 2 + 200px);
  291. {/block:ifTwoColumn}
  292. margin-bottom:50px;
  293. margin-top:100px;
  294. margin-left:50px;
  295. }
  296.  
  297. .entry{
  298. {block:indexpage}
  299. display:inline-block;
  300. width:{select:Post Width}px;
  301. {/block:indexpage}
  302. padding:0px 0px 10px 0px;
  303. margin:0px 10px 60px 0px;
  304. {block:ifTwoColumn}
  305. {block:IndexPage}
  306. margin-right:65px;
  307. {/block:IndexPage}
  308. {/block:ifTwoColumn}
  309. background:{color:Posts Background};
  310. {block:permalinkpage}
  311. width:500px;
  312. padding:23px;
  313. {/block:permalinkpage}
  314. }
  315.  
  316. .entry img{
  317. {block:indexpage}
  318. width:{select:Post width}px;
  319. height:auto;
  320. margin-bottom:-4px;
  321. {/block:indexpage}
  322. {block:permalinkpage}
  323. max-width:500px;
  324. {/block:permalinkpage}
  325. }
  326.  
  327. ol.notes{
  328. padding:0px;
  329. width:500px;
  330. height:218px;
  331. overflow:auto;
  332. margin:5px 0px;
  333. list-style-type:none;
  334. border:1px solid{color:Border Color};
  335. }
  336.  
  337. ol.notes li.note{
  338. border-top:solid 1px {color:Border Color};
  339. padding:10px;
  340. }
  341.  
  342. ol.notes li.note:first-child{
  343. border:none;
  344. }
  345.  
  346. ol.notes li.note img.avatar{
  347. vertical-align:-4px;
  348. margin-right:10px;
  349. width:16px;
  350. height:16px;
  351. }
  352.  
  353. ol.notes li.note blockquote{
  354. border-color:{color:Border Color};
  355. padding:4px 10px;
  356. margin:10px 0px 0px 25px;
  357. }
  358.  
  359. ol.notes li.note blockquote a{
  360. text-decoration:none;
  361. }
  362.  
  363. /*--Grayscale Effect--*/
  364.  
  365. #img{
  366. {block:indexpage}
  367. {block:ifPostFade}
  368. opacity:0.6;
  369. {/block:ifPostFade}
  370. {block:ifGrayscaleEffect}
  371. filter: url(filters.svg#grayscale);
  372. filter: gray;
  373. -webkit-filter: grayscale(1);
  374. {/block:ifGrayscaleEffect}
  375. -webkit-transition:all 0.3s ease-in-out;
  376. -moz-transition:all 0.3s ease-in-out;
  377. -o-transition:all 0.3s ease-in-out;
  378. transition:all 0.3s ease-in-out;
  379. {/block:indexpage}
  380. }
  381.  
  382. .entry:hover #img{
  383. {block:indexpage}
  384. opacity:1;
  385. {block:ifGrayscaleEffect}
  386. filter: url(filters.svg#grayscale);
  387. filter: gray;
  388. -webkit-filter: grayscale(0);
  389. {/block:ifGrayscaleEffect}
  390. {/block:indexpage}
  391. }
  392.  
  393. /*--Permalinks--*/
  394.  
  395. .permalink{
  396. background:{color:Posts Background};
  397. color:#ccc;
  398. width:calc({select:Post Width}px - 10px);
  399. height:auto;
  400. position:relative;
  401. font-size:11px;
  402. padding:0 5px 0 5px;
  403. margin-top:10px;
  404. text-align:left;
  405. z-index:999;
  406. -webkit-transition:all 0.5s ease-in-out;
  407. -moz-transition:all 0.5s ease-in-out;
  408. -o-transition:all 0.5s ease-in-out;
  409. transition:all 0.5s ease-in-out;
  410. }
  411.  
  412. .info li{
  413. display:inline-block;
  414. list-style:none;
  415. margin-right:10px;
  416. }
  417.  
  418. .info i{
  419. margin-right:3px;
  420. vertical-align:-.2em;
  421. font-size:13px;
  422. }
  423.  
  424. .info a{
  425. color:{color:Link};
  426. }
  427.  
  428. .info a:hover{
  429. color:{color:Link Hover};
  430. }
  431.  
  432. .tags{
  433. line-height:25px;
  434. text-transform:uppercase;
  435. }
  436.  
  437. .tags i{
  438. color:{color:Link};
  439. }
  440.  
  441. .tags a{
  442. display:inline-block;
  443. margin-right:5px;
  444. }
  445.  
  446. .tags a:first-child{
  447. margin:0px;
  448. }
  449.  
  450. .likeb{
  451. position:relative;
  452. margin-left:17px;
  453. }
  454.  
  455. .like_button:before{
  456. content:"\39";
  457. position:absolute;
  458. color:{color:Link};
  459. font-family:'cy-outicons';
  460. margin-left:-17px;
  461. font-size:13px;
  462. -webkit-transition:all 0.5s ease-in-out;
  463. -moz-transition:all 0.5s ease-in-out;
  464. -o-transition:all 0.5s ease-in-out;
  465. transition:all 0.5s ease-in-out;
  466. }
  467.  
  468. .like_button{
  469. position:absolute;
  470. top:0;
  471. left:0;
  472. width:100%;
  473. height:100%;
  474. }
  475.  
  476. .like_button iframe{
  477. position:absolute;
  478. width:190%;
  479. height:100%;
  480. bottom:0;
  481. right:0;
  482. opacity:0;
  483. z-index:999;
  484. }
  485.  
  486. .like_button.liked:before, .like_button:hover:before{
  487. color:{color:Link Hover};
  488. content:"\38";
  489. }
  490.  
  491. .like_button.liked + .b{
  492. color:{color:Link Hover};
  493. }
  494.  
  495. /*--Miscellaneous--*/
  496.  
  497. iframe.tmblr-iframe{
  498. z-index:99999999999999!important;
  499. top:8px!important;
  500. right:5px!important;
  501. opacity:0.4;
  502. /* delete from here */
  503. filter:invert(1);
  504. -webkit-filter:invert(1);
  505. -o-filter:invert(1);
  506. -moz-filter:invert(1);
  507. -ms-filter:invert(1);
  508. /* to here if your blog has a dark background */
  509. transform:scale(0.6);
  510. transform-origin:100% 0;
  511. -webkit-transform:scale(0.6);
  512. -webkit-transform-origin:100% 0;
  513. -o-transform:scale(0.6);
  514. -o-transform-origin:100% 0;
  515. -moz-transform:scale(0.6);
  516. -moz-transform-origin:100% 0;
  517. -ms-transform:scale(0.6);
  518. -ms-transform-origin:100% 0;
  519. -webkit-transition:all 0.5s ease-in-out;
  520. -moz-transition:all 0.5s ease-in-out;
  521. -o-transition:all 0.5s ease-in-out;
  522. transition:all 0.5s ease-in-out;
  523. }
  524.  
  525. iframe.tmblr-iframe:hover{
  526. opacity:0.6!important;
  527. }
  528.  
  529. .load-more{
  530. position:relative;
  531. background:{color:Posts Background};
  532. border:1px solid {color:Border Color};
  533. margin-left:calc(({select:Post Width}px / 2) + 10px);
  534. {block:ifTwoColumn}
  535. margin-left:calc({select:Post Width}px + 40px);
  536. {/block:ifTwoColumn}
  537. padding:5px;
  538. }
  539.  
  540. footer{
  541. width:50vw;
  542. margin-bottom:80px;
  543. }
  544.  
  545. .pagination{
  546. display:none;
  547. }
  548.  
  549. #pagination{
  550. color:#ccc;
  551. width:{select:Post Width}px;
  552. text-align:center;
  553. {block:ifTwoColumn}
  554. position:absolute;
  555. bottom:0px;
  556. width:calc({select:Post Width}px * 2);
  557. {/block:ifTwoColumn}
  558. }
  559.  
  560. #pagination a{
  561. background:{color:Posts Background};
  562. border:1px solid {color:Border color};
  563. padding:0px 5px 3px 5px;
  564. }
  565.  
  566. .back{
  567. margin-top:0px;
  568. }
  569.  
  570. .next{
  571. margin-top:0px;
  572. }
  573.  
  574. .text img{
  575. {block:IndexPage}
  576. max-width:calc({select:Post width}px - 20px);
  577. {/block:IndexPage}
  578. {block:PermalinkPage}
  579. max-width:500px;
  580. {/block:PermalinkPage}
  581. width:auto;
  582. height:auto;
  583. }
  584.  
  585. .text{
  586. padding:10px;
  587. overflow:hidden;
  588. }
  589.  
  590. .audio:hover .player{
  591. opacity:1;
  592. }
  593.  
  594. .audio{
  595. background:#f2f2f2;
  596. margin-left:50px;
  597. margin-top:-2px;
  598. line-height:14px;
  599. letter-spacing:1px;
  600. text-align:left;
  601. padding:10px 0px 12px 10px;
  602. }
  603.  
  604. .audio img{
  605. position:absolute;
  606. width:50px;
  607. margin-top:-10px;
  608. margin-left:-60px;
  609. z-index:9;
  610. }
  611.  
  612. .player{
  613. opacity:0;
  614. background:#f2f2f2;
  615. position:absolute;
  616. display:block;
  617. width:30px;
  618. height:27px;
  619. margin-top:1px;
  620. margin-left:-49px;
  621. overflow:hidden;
  622. z-index:99999;
  623. -webkit-transition:all 0.3s ease-in-out;
  624. -moz-transition:all 0.3s ease-in-out;
  625. -o-transition:all 0.3s ease-in-out;
  626. transition:all 0.3s ease-in-out;
  627. }
  628.  
  629. .tumblr_audio_player{
  630. margin-left:-2px;
  631. z-index:99;
  632. }
  633.  
  634. .song{
  635. font:italic 9px georgia;
  636. }
  637.  
  638. .quote{
  639. font-weight:bold;
  640. text-align:left;
  641. margin-left:11px;
  642.  
  643. }
  644.  
  645. #s-m-t-tooltip{
  646. background:#fff;
  647. color:#444;
  648. font-size:10px;
  649. font-weight:500;
  650. letter-spacing:2px;
  651. text-transform:uppercase;
  652. max-width:300px;
  653. padding:4px;
  654. z-index:9999999999;
  655. margin:20px 10px 10px 10px;
  656. box-shadow:1px 1px 3px rgba(0,0,0,.1);
  657. }
  658.  
  659. .ask{
  660. background:{color:Caption};
  661. color:{color:Text};
  662. width:auto;
  663. padding:10px;
  664. border:1px solid {color:Border Color};
  665. border-radius:5px;
  666. text-align:left;
  667. }
  668.  
  669. .answer{
  670. margin-left:10px;
  671. margin-top:0px;
  672. }
  673.  
  674. .answer img{
  675. width:auto;
  676. height:auto;
  677. max-width:calc({select:Post width}px - 70px);
  678. {block:PermalinkPage}
  679. max-width:430px;
  680. {/block:PermalinkPage}
  681. }
  682.  
  683. .caption{
  684. {block:IndexPage}
  685. background:{color:Caption};
  686. border:1px solid {color:Border Color};
  687. {/block:IndexPage}
  688. font-size:12px;
  689. color:{color:Caption Text};
  690. padding:5px;
  691. overflow:auto;
  692. }
  693.  
  694. .caption img{
  695. width:auto;
  696. height:auto;
  697. max-width:calc({select:Post width}px - 70px);
  698. {block:PermalinkPage}
  699. max-width:430px;
  700. {/block:PermalinkPage}
  701. }
  702.  
  703. .back-to-top{
  704. position: fixed;
  705. bottom:-75px;
  706. left:10px;
  707. background: url('http://static.tumblr.com/2e9nahe/xvCoaucis/arrow-up.svg') no-repeat;
  708. background-size:15px;
  709. width:100px;
  710. height:100px;
  711. z-index:9999999;
  712. }
  713.  
  714. .back-to-top a{
  715. text-indent: -9999px;
  716. display: block;
  717. }
  718.  
  719. #infscr-loading{
  720. display:none!important;
  721. }
  722.  
  723. .tumblr_video_container{
  724. width:auto!important;
  725. height:auto!important;
  726. }
  727.  
  728. .vignette, #vignette {
  729. opacity:0;
  730. }
  731. .lightbox-image, #tumblr_lightbox img {
  732. box-shadow:none!important;
  733. border-radius:0!important;
  734. max-width:none;
  735. }
  736.  
  737. .tmblr-lightbox, #tumblr_lightbox {
  738. background-color:{color:Background}!important;
  739. }
  740.  
  741. </style>
  742.  
  743. <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
  744.  
  745. <script src="http://static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script>
  746. <script>
  747. (function($){
  748. $(document).ready(function(){
  749. $("[title]").style_my_tooltips({
  750. tip_follows_cursor:true,
  751. tip_delay_time:20,
  752. tip_fade_speed:400,
  753. attribute:"title"
  754. });
  755. });
  756. })(jQuery);
  757. </script>
  758.  
  759.  
  760. <!--Scroll back to top-->
  761.  
  762. <div class="back-to-top" id="back-top">
  763. <a href="javascript:void(0)" class="back-to-top">Top</a>
  764. </div>
  765.  
  766.  
  767. <script type="text/javascript">
  768. $(function () {
  769. $("#back-top").hide();
  770. $(window).scroll(function () {
  771. if ($(this).scrollTop() > 150) {
  772. $('#back-top').fadeIn();
  773. } else {
  774. $('#back-top').fadeOut();
  775. }
  776. });
  777. });
  778. jQuery('.back-to-top').click(function () {
  779. jQuery('html, body').animate({
  780. scrollTop: 0
  781. }, 'slow');
  782. });
  783. </script>
  784.  
  785.  
  786. <!--end of Scroll back to top-->
  787.  
  788. <!--minimal soundcloud player by shythemes-->
  789. <script>
  790. // minimal soundcloud player © shythemes.tumblr
  791. $(document).ready(function(){
  792. var color = '#acd7bb'; // color of play button (hex)
  793. $('.soundcloud_audio_player').each(function(){
  794. $(this).attr({ src: $(this).attr('src').split('&')[0] + '&amp;liking=false&amp;sharing=false&amp;auto_play=false&amp;show_comments=false&amp;continuous_play=false&amp;buying=false&amp;show_playcount=false&amp;show_artwork=true&amp;origin=tumblr&amp;color=' + color.split('#')[1], height: 20, width: '100%' });
  795. });
  796. });
  797. </script>
  798. <!--end minimal soundcloud player-->
  799.  
  800.  
  801. <script src="http://static.tumblr.com/qudkd6d/Az6nkemqr/pxuphotoset.min.js"></script>
  802. <script>
  803. $(document).ready(function(){
  804. $('.photo-slideshow').pxuPhotoset({
  805. lightbox: true,
  806. rounded: false,
  807. gutter: '5px',
  808. photoset: '.photo-slideshow',
  809. photoWrap: '.photo-data',
  810. photo: '.pxu-photo'
  811. });
  812. });
  813. </script>
  814.  
  815. {block:ifInfiniteScroll}
  816. <div class="pagination">
  817. {block:Pagination}{block:PreviousPage}<a href="{PreviousPage"}>previous</a> &middot;{/block:PreviousPage} {block:NextPage}<a href="{NextPage}" id="next">next</a>{/block:NextPage}{/block:Pagination}
  818. </div>
  819. {/block:ifInfiniteScroll}
  820.  
  821. <script src ="http://static.tumblr.com/fwgzvyf/Oj1o08f6h/shythemes.vr.js"></script>
  822.  
  823. </head>
  824.  
  825. <body>
  826.  
  827. <header>
  828. <a href="/"><i class="oi-home"></i>Index</a>
  829. <a href="/ask" target="_blank"><i class="oi-envelope"></i>Ask</a>
  830. <a href="/archive" target="_blank"><i class="oi-calendar"></i>Memories</a>
  831. </header>
  832.  
  833. <div id="center">
  834.  
  835. <div id="sidebar">
  836. <a href="/"><div id="icon"><img src="{image:Icon}"></div></a>
  837. <a href="/"><div id="sidebar2"><img src="{image:Sidebar}"></div></a>
  838. <div id="title">
  839. <a href="/">{Title}</a>
  840. </div>
  841. <div id="desc">{Description}</div>
  842. <div class="links">
  843. {block:ifLink1}<a href="{text:Link 1 URL}" target="_blank">{text:Link 1}</a>{/block:ifLink1}
  844. {block:ifLink2}<a href="{text:Link 2 URL}" target="_blank">{text:Link 2}</a>{/block:ifLink2}
  845. {block:ifLink3}<a href="{text:Link 3 URL}" target="_blank">{text:Link 3}</a>{/block:ifLink3}
  846. {block:ifLink4}<a href="{text:Link 4 URL}" target="_blank">{text:Link 4}</a>{/block:ifLink4}
  847. </div>
  848. </div>
  849.  
  850. <div id="content">
  851.  
  852. {block:Posts}
  853.  
  854.  
  855. <div class="entry" id="{PostID}">
  856.  
  857. {block:Text}
  858. <div class="text">{block:IndexPage}{/block:IndexPage}{block:Title}<h2><b><a href="{Permalink}">{Title}</a></b></h2>{/block:Title}
  859. {Body}
  860. </div>
  861. {/block:Text}
  862.  
  863. {block:Photo}
  864. {block:IndexPage}
  865. <div id="img">
  866. <a onclick="Tumblr.Lightbox.init([{ width: '{PhotoWidth-HighRes}', height: '{PhotoHeight-HighRes}', low_res: '{PhotoURL-500}', high_res: '{PhotoURL-HighRes}' }]);$('body').toggleClass('tumblr_lightbox_active');return false"><img src="{PhotoURL-HighRes}"/></a>
  867. </div>
  868.  
  869. {/block:IndexPage}
  870. {block:PermalinkPage}<img src="{PhotoURL-HighRes}"/>{block:Caption}<div class="caption">{caption}</div>{/block:Caption}
  871. {/block:PermalinkPage}
  872. {/block:Photo}
  873.  
  874. {block:Photoset}
  875. {block:IndexPage}
  876. <div id="img">
  877. <div class="photo-slideshow" id="photoset_{PostID}" data-layout="{PhotosetLayout}">{block:Photos}<div class="photo-data"><div class="pxu-photo"><img src="{PhotoURL-500}" width="{PhotoWidth-500}" height="{PhotoHeight-500}" data-highres="{PhotoURL-HighRes}" data-width="{PhotoWidth-HighRes}" data-height="{PhotoHeight-HighRes}"></div><a class="tumblr-box" rel="post-{PostID}" href="{PhotoURL-HighRes}"></a></div>{/block:Photos}</div>
  878. </div>
  879. {/block:IndexPage}
  880.  
  881. {block:PermalinkPage}<div class="photo-slideshow" id="photoset_{PostID}" data-layout="{PhotosetLayout}">{block:Photos}<div class="photo-data"><div class="pxu-photo"><img src="{PhotoURL-500}" width="{PhotoWidth-500}" height="{PhotoHeight-500}" data-highres="{PhotoURL-HighRes}" data-width="{PhotoWidth-HighRes}" data-height="{PhotoHeight-HighRes}"></div><a class="tumblr-box" rel="post-{PostID}" href="{PhotoURL-HighRes}"></a></div>{/block:Photos}</div>
  882. {block:Caption}<div class="caption">{caption}</div>{/block:Caption}
  883. {/block:PermalinkPage}
  884. {/block:Photoset}
  885.  
  886.  
  887. {block:Quote}
  888. <div class="text">
  889. <div style="position:absolute;margin-top:-5px;margin-left:-5px;font:30px times new roman;opacity:0.5;">“</div>
  890. <div class="quote">{Quote}</div>
  891. {block:Source}<p style="text-align:right;font:italic 10px georgia;">—&nbsp;{Source}</p>{/block:Source}
  892. </div>
  893. {/block:Quote}
  894.  
  895. {block:Link}
  896. <div class="text">
  897. <a href="{URL}"><h1><b>{Name}</h1></b></a>{block:Description}{Description}{/block:Description}</div>
  898. {/block:Link}
  899.  
  900. {block:Chat}
  901. <div class="text">
  902. {block:Title}<h3>{Title}</h3>{/block:Title}
  903. {block:Lines}<p>
  904. {block:Label}<b>{Label}</b>{/block:Label}
  905. {Line}</p>
  906. {/block:Lines}
  907. </div>
  908. {/block:Chat}
  909.  
  910. {block:Audio}
  911. <div class="audio">
  912. {block:AudioPlayer}
  913. <div class="player">{AudioPlayerWhite}</div>
  914. {block:AlbumArt}<img id="img" src="{AlbumArtURL}"/>{/block:AlbumArt}
  915. {block:TrackName}<b>{TrackName}</b>{/block:TrackName}
  916. <br>{block:Artist}<span class="song">{Artist}</span>{/block:Artist}
  917. </div>
  918. {/block:AudioPlayer}
  919.  
  920. {block:PermalinkPage}
  921. {block:Caption}<div class="caption">{caption}</div>{/block:Caption}
  922. {/block:PermalinkPage}
  923. {/block:Audio}
  924.  
  925. {block:Answer}
  926. <div style="padding:10px;"><b><u>{Asker}</u></b> asked:</div>
  927. <div class="ask">
  928. {Question}
  929. </div>
  930. <div class="answer">
  931. {Answer}
  932. </div>
  933. {/block:Answer}
  934.  
  935. {block:Video}
  936. {block:IndexPage}
  937. <div id="img">
  938. <div class="video">{Video-500}</div>
  939. </div>
  940. {/block:IndexPage}
  941.  
  942. {block:PermalinkPage}<div class="video">{Video-500}</div>
  943. {block:Caption}<div class="caption">{caption}</div>{/block:Caption}{/block:PermalinkPage}
  944. {/block:Video}
  945.  
  946. {block:ContentSource} <!-- {SourceURL}{block:SourceLogo}<img src="{BlackLogoURL}" width="{Logowidth}px" height="{LogoHeight}" alt="{SourceTitle}" /> {/block:SourceLogo} {block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo}--> {/block:ContentSource}
  947.  
  948. {block:IndexPage}
  949. {block:ifShowCaption}{block:Caption}<div class="caption">{caption}</div>{/block:Caption}{/block:ifShowCaption}
  950. <div class="permalink">
  951. <div class="info">
  952. <li><a href="{Permalink}" target="_blank" title="{NoteCountWithLabel}"><i class="oi-clock"></i>{TimeAgo}</a></li>
  953. <li><a href="{ReblogURL}" target="_blank"><i class="oi-return"></i>reblog</a></li>
  954. <li><a class="likeb" href="#">{LikeButton size="100"}<span class="b">like</span></a></li>
  955. {block:ifShowTags}{block:HasTags}<span class="tags"><i class="oi-tags"></i>{block:Tags}<a href="{TagURL}">#{Tag}</a>{/block:Tags}<br></span>{/block:HasTags}{/block:ifShowTags}
  956. </div>
  957. </div>
  958. {/block:IndexPage}
  959.  
  960. {block:PermalinkPage}
  961. {block:Date}
  962. <div style="border-top:1px solid #ccc;width:500px;margin-top:5px;"></div>
  963. <div style="font-weight:600;font-size:14px;margin-top:10px;">{DayOfWeek}, {Month} {DayOfMonth}{DayOfMonthSuffix}, {Year}</div>
  964. {/block:Date}
  965. {block:NoteCount}{NoteCountWithLabel}{/block:NoteCount}
  966. <br>{block:HasTags}Tagged: {block:Tags}<a href="{TagURL}">#{Tag}</a> {/block:Tags}<br>{/block:HasTags}
  967. {block:RebloggedFrom}Via: <i><a href="{ReblogParentURL}">{ReblogParentName}</i></a>
  968. <br>Source: <i><a href="{ReblogRootURL}">{ReblogRootName}</i></a>{/block:RebloggedFrom}
  969. {/block:PermalinkPage}
  970.  
  971. {block:PostNotes}{PostNotes}{/block:PostNotes}
  972.  
  973.  
  974. </div>
  975.  
  976. {/block:Posts}
  977.  
  978. {block:ifnotinfinitescroll}
  979. {block:Pagination}
  980. <div id="pagination">
  981. {block:PreviousPage}<a href="{PreviousPage}" title="previous">«</a>&nbsp;&nbsp;|{/block:PreviousPage}&nbsp;&nbsp;{block:NextPage}<a href="{NextPage}" title="next">»</a>{/block:NextPage}
  982. </div>
  983. {/block:Pagination}
  984. {/block:ifnotinfinitescroll}
  985.  
  986. </div>
  987.  
  988. {block:ifInfiniteScroll}{block:ifManualLoad}
  989. {block:Pagination}<footer><a href="#" class="load-more">load more</a></footer>{/block:Pagination}
  990. {/block:ifManualLoad}{/block:ifInfiniteScroll}
  991.  
  992. </div>
  993.  
  994.  
  995. {block:IndexPage}
  996. <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery.imagesloaded/4.0.0/imagesloaded.pkgd.min.js"></script>
  997. {block:ifTwoColumn}
  998. <script src="https://cdnjs.cloudflare.com/ajax/libs/masonry/3.3.2/masonry.pkgd.min.js"></script>
  999. {/block:ifTwoColumn}
  1000. {block:ifInfiniteScroll}
  1001. <script src="http://static.tumblr.com/wgijwsy/u2vm2hxv6/jquery.infinitescroll.min.js"></script>
  1002. {/block:ifInfiniteScroll}
  1003. <script>
  1004. $(document).ready(function(){
  1005. var $container = $('#content');
  1006. {block:ifTwoColumn}
  1007. $container.masonry({
  1008. itemSelector: '.entry',
  1009. columnWidth: '.entry',
  1010. {block:ifnotInfiniteScroll}
  1011. transitionDuration: 0
  1012. {/block:ifnotInfiniteScroll}
  1013. });
  1014. $container.imagesLoaded().progress(function(){
  1015. $container.masonry('layout');
  1016. });
  1017. {/block:ifTwoColumn}
  1018.  
  1019. {block:ifInfiniteScroll}
  1020. $container.infinitescroll({
  1021. itemSelector: ".entry",
  1022. navSelector: ".pagination",
  1023. nextSelector: ".pagination a#next",
  1024. loadingImg: "",
  1025. loadingText: "<em> </em>",
  1026. bufferPx: 100,
  1027. extraScrollPx: 50,
  1028. errorCallback: function(){ $('.load-more').text('no more posts').parent().delay(2000).slideUp("slow"); }
  1029. },
  1030.  
  1031. function(newElements){
  1032. var $newElems = $(newElements);
  1033. $newElems.find('.photo-slideshow').pxuPhotoset({
  1034. lightbox: true,
  1035. rounded: false,
  1036. gutter: '4px',
  1037. photoset: '.photo-slideshow',
  1038. photoWrap: '.photo-data',
  1039. photo: '.pxu-photo'
  1040. });
  1041.  
  1042. var $newElemsIDs = $newElems.map(function(){
  1043. return this.id;
  1044. }).get();
  1045. console.log($newElems, $newElemsIDs);
  1046. Tumblr.LikeButton.get_status_by_post_ids($newElemsIDs);
  1047.  
  1048. resizeVideos();
  1049.  
  1050. var $newElems = $( newElements ).hide();
  1051. $newElems.imagesLoaded(function(){
  1052. $newElems.fadeIn();
  1053. {block:ifTwoColumn}
  1054. $container.masonry( 'appended', $newElems, true );
  1055. {/block:ifTwoColumn}
  1056. });
  1057.  
  1058. var color = '#ededed';
  1059. $('.soundcloud_audio_player').each(function(){
  1060. $(this).attr({ src: $(this).attr('src').split('&')[0] + '&amp;liking=false&amp;sharing=false&amp;auto_play=false&amp;show_comments=false&amp;continuous_play=false&amp;buying=false&amp;show_playcount=false&amp;show_artwork=false&amp;origin=tumblr&amp;color=' + color.split('#')[1], height: 20, width: '100%' });
  1061. });
  1062.  
  1063. });
  1064. {block:ifManualLoad}
  1065. $(window).unbind('.infscr');
  1066. $('.load-more').click(function(){
  1067. $('#content').infinitescroll('retrieve');
  1068. return false;
  1069. });
  1070. {/block:ifManualLoad}
  1071. {/block:ifInfiniteScroll}
  1072. });
  1073. </script>
  1074. {/block:IndexPage}
  1075.  
  1076. <a href="http://shoseii.tumblr.com" style="font:italic 10px 'Libre Baskerville', serif;position:fixed;bottom:5px;right:3px;" title="© shoseii">&</a>
  1077.  
  1078. </body>
  1079.  
  1080. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement