kosmique

theme: peek-a-boo

Oct 26th, 2020
3,020
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 29.90 KB | None | 0 0
  1. <!--
  2.  
  3. peek-a-boo by kosmique themes
  4.  
  5. ✧ credits at kosmique.tumblr.com/credits
  6.  
  7. -->
  8. <!DOCTYPE html>
  9. <head>
  10.  
  11. <title>{block:PostSummary}{PostSummary} : {/block:PostSummary}{Title}</title>
  12.  
  13. <link rel="shortcut icon" href="{favicon}">
  14.  
  15. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  16. {block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}
  17.  
  18. <meta name="viewport" content="width=device-width, initial-scale=1">
  19.  
  20. <!--Default Variables-->
  21. <meta name="if:Infinite Scroll" content="1"/>
  22.  
  23. <meta name="color:Background" content="#323232"/>
  24. <meta name="color:Text" content="#c8c8c8"/>
  25. <meta name="color:Sub text" content="#fafafa"/>
  26. <meta name="color:Link" content="#fafafa"/>
  27. <meta name="color:Title" content="#fafafa"/>
  28. <meta name="color:Borders" content="#464646"/>
  29. <meta name="color:Scrollbar" content="#000000"/>
  30. <meta name="color:Posts" content="#3e3e3e"/>
  31. <meta name="color:Accent" content="#ffb34f"/>
  32. <meta name="color:Sub color" content="#8347cc"/>
  33.  
  34. <meta name="text:Link one title" content="link one"/>
  35. <meta name="text:Link one url" content="/"/>
  36. <meta name="text:Link two title" content="link two"/>
  37. <meta name="text:Link two url" content="/"/>
  38. <meta name="text:Link three title" content="link three"/>
  39. <meta name="text:Link three url" content="/"/>
  40. <meta name="text:Link four title" content="link four"/>
  41. <meta name="text:Link four url" content="/"/>
  42. <meta name="text:Link five title" content="link five"/>
  43. <meta name="text:Link five url" content="/"/>
  44. <meta name="text:Link six title" content="link six"/>
  45. <meta name="text:Link six url" content="/"/>
  46.  
  47. <!--Scripts-->
  48.  
  49. <script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
  50. <script src="https://cdn.jsdelivr.net/npm/feather-icons/dist/feather.min.js"></script>
  51. <script src="https://static.tumblr.com/qudkd6d/Az6nkemqr/pxuphotoset.min.js"></script>
  52. <script src="https://static.tumblr.com/dj2anrv/ZVmq8svlk/jquery.style-my-tooltips.js"></script>
  53. <script src="https://rawgit.com/robinpx/tumblr/master/scripts/flexibleFrames/flexibleFrames.min.js"></script>
  54. <script src="//cdn.jsdelivr.net/gh/boscoxvi/npfphotosets/npfphotosets.js"></script>
  55. <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
  56. <script src="https://cdnjs.cloudflare.com/ajax/libs/smoothscroll/1.4.10/SmoothScroll.js"></script>
  57. <script src="https://static.tumblr.com/0podkko/qWqq8va08/photosets.js"></script>
  58.  
  59. <link href="https://fonts.googleapis.com/css2?family=PT+Sans:ital,wght@0,400;0,700;1,400;1,700&family=PT+Serif:wght@700&display=swap" rel="stylesheet">
  60. <link href="https://static.tumblr.com/qudkd6d/OcDnl99gb/style.css" rel="stylesheet" type="text/css"/>
  61. <link href="https://cdn.jsdelivr.net/gh/boscoxvi/npfphotosets/npfphotosetstyle.css" rel="stylesheet" type="text/css">
  62. <link rel="stylesheet" type="text/css" href="//at.alicdn.com/t/font_o5hd5vvqpoqiwwmi.css">
  63.  
  64. <!--CSS customization here. -->
  65.  
  66. <style type="text/css">
  67.  
  68. *{box-sizing:border-box}
  69.  
  70. .icon {
  71. speak:none;
  72. line-height:1;
  73. font-style:normal;
  74. font-weight:normal;
  75. font-variant:normal;
  76. text-transform:none;
  77. font-family:'feather' !important;
  78. -webkit-font-smoothing:antialiased;
  79. -moz-osx-font-smoothing:grayscale;
  80. }
  81.  
  82. body{
  83. margin:0;
  84. width:100%;
  85. height:100%;
  86. overflow-x:hidden;
  87. color:{color:text};
  88. word-break:break-word;
  89. background-color:{color:background};
  90. font:300 13px/1.6 'pt sans', sans-serif;
  91. }
  92.  
  93. body::before{
  94. top:0;
  95. left:0;
  96. width:100%;
  97. height:5px;
  98. content:'';
  99. z-index:99;
  100. display:block;
  101. position:fixed;
  102. background:{color:accent};
  103. }
  104.  
  105. :focus{
  106. border:0;
  107. outline:0;
  108. }
  109.  
  110. a, a:hover{
  111. cursor:pointer;
  112. transition:ease .3s;
  113. text-decoration:none;
  114. -moz-transition:ease .3s;
  115. -webkit-transition:ease .3s;
  116. }
  117.  
  118. a{color:{color:link}}
  119.  
  120. b, strong{font-weight:700;}
  121.  
  122. b, i, strike, u{color:{color:accent}}
  123.  
  124. small,sub,sup{font-size:.7em;}
  125.  
  126. big{font-size:1.1em;}
  127.  
  128. p {margin:.7em 0;}
  129. p:first-of-type {margin-top:0;}
  130. p:last-of-type {margin-bottom:0;}
  131.  
  132. h1, h2, h3, h4 {
  133. margin:1em 0;
  134. font-weight:700;
  135. font-size:1.05em;
  136. }
  137.  
  138. blockquote{
  139. margin:.5em 0;
  140. padding:2px 10px;
  141. border-left:2px solid {color:sub color};
  142. }
  143.  
  144. pre{
  145. padding:15px;
  146. margin:.5em 0;
  147. display:block;
  148. user-select:all;
  149. border-radius:4px;
  150. font-family:inherit;
  151. -ms-user-select:all;
  152. white-space:pre-wrap;
  153. -webkit-user-select:all;
  154. background:{color:borders};
  155. border-bottom:2px solid {color:sub color};
  156. }
  157.  
  158. code{
  159. margin:0;
  160. display:inline;
  161. padding:3px 10px;
  162. border-radius:4px;
  163. font-family:inherit;
  164. color:{color:background};
  165. background:{color:accent};
  166. }
  167.  
  168. h1:first-of-type, h2:first-of-type, h3:first-of-type, h4:first-of-type {margin-top:0;}
  169.  
  170. ul,ol{
  171. padding:0;
  172. margin:0;
  173. list-style:none;
  174. }
  175.  
  176. .post ul, .post ol:not(.notes):not(.chat), .terms ul{padding-left:1em!important;}
  177.  
  178. .post ul li::before, .post ol:not(.notes):not(.chat) li::before, .terms ul li::before{
  179. width:5px;
  180. height:5px;
  181. content:"";
  182. margin-right:1em;
  183. position:relative;
  184. display:inline-block;
  185. vertical-align:middle;
  186. background:{color:accent};
  187. }
  188.  
  189. hr {
  190. width:30%;
  191. height:1px;
  192. border:none;
  193. box-shadow:0;
  194. margin:1em auto;
  195. background:{color:borders};
  196. }
  197.  
  198. a.read_more{
  199. display:inline;
  200. margin-top:10px;
  201. padding:3px 10px;
  202. border-radius:4px;
  203. font-family:inherit;
  204. text-transform:lowercase;
  205. background:{color:accent};
  206. }
  207.  
  208. .credits{
  209. right:20px;
  210. bottom:20px;
  211. position:fixed;
  212. }
  213.  
  214. .credits svg{
  215. width:1.1em;
  216. height:1.1em;
  217. color:{color:accent};
  218. }
  219.  
  220. /*tumblr controls*/
  221.  
  222. .iframe-controls--desktop {
  223. top:0!important;
  224. margin-top:15px;
  225. z-index:12!important;
  226. transform:scale(0.55);
  227. right:15px!important;
  228. position:fixed!important;
  229. -moz-transform:scale(0.55);
  230. transform-origin:right top;
  231. -webkit-transform:scale(0.55);
  232. -moz-transform-origin:right top;
  233. -webkit-transform-origin:right top;
  234. }
  235.  
  236.  
  237. .tmblr-iframe--follow-teaser, .tmblr-iframe--app-cta-button{display:none !important;}
  238.  
  239. /*lightboxes*/
  240.  
  241. img{
  242. height:auto;
  243. display:block;
  244. max-width:100%;
  245. }
  246.  
  247. iframe{display:block;}
  248.  
  249. .vignette, #vignette {opacity:0;}
  250.  
  251. .lightbox-image, #tumblr_lightbox img {
  252. box-shadow:none !important;
  253. border-radius:0 !important;
  254. max-width:none;
  255. }
  256.  
  257. .tmblr-lightbox, #tumblr_lightbox {background:rgba({RGBcolor:background},.9) !important;}
  258.  
  259. .lightbox-caption, #tumblr_lightbox_caption {visibility:hidden;}
  260.  
  261. .npf_row figure{cursor:pointer;}
  262.  
  263. .npf_row figure:focus{outline:0;}
  264.  
  265. /*tooltip*/
  266.  
  267. #s-m-t-tooltip{
  268. z-index:9999999;
  269. max-width:300px;
  270. padding:.3em 1em;
  271. position:relative;
  272. border-radius:3px;
  273. margin:0 14px 7px 30px;
  274. -moz-border-radius:3px;
  275. -webkit-border-radius:3px;
  276. color:{color:sub text};
  277. background:{color:sub color};
  278. }
  279.  
  280. #s-m-t-tooltip::before{
  281. top:50%;
  282. width:0;
  283. height:0;
  284. left:-5px;
  285. content:'';
  286. position:absolute;
  287. border-style:solid;
  288. transform:translatey(-50%);
  289. border-width:5px 5px 5px 0;
  290. border-color:transparent {color:sub color} transparent transparent;
  291.  
  292. }
  293.  
  294. /*scrollbar*/
  295.  
  296. ::-webkit-scrollbar{
  297. width:11px;
  298. height:11px;
  299. padding:4px;
  300. border:5px solid {color:borders};
  301. background-color:rgba({RGBcolor:scrollbar},.6);
  302. }
  303.  
  304. ::-webkit-scrollbar-thumb {
  305. background:{color:scrollbar};
  306. background-clip:padding-box;
  307. border:4px solid transparent;
  308. }
  309.  
  310. /*pagination*/
  311.  
  312. .pagination {
  313. width:500px;
  314. display:flex;
  315. align-items:center;
  316. justify-content:center;
  317. }
  318.  
  319. .pagination a{
  320. width:25px;
  321. height:25px;
  322. margin:0 3px;
  323. display:flex;
  324. align-items:center;
  325. justify-content:center;
  326. background:{color:accent};
  327. }
  328.  
  329. .pagination svg{
  330. width:1em;
  331. height:1em;
  332. }
  333.  
  334. #infscr-loading {display:none!important;}
  335.  
  336. /*sidebar*/
  337.  
  338. aside{
  339. width:250px;
  340. position:fixed;
  341. margin-left:calc(500px + 150px);
  342. }
  343.  
  344. .blog-icon{
  345. width:64px;
  346. height:64px;
  347. margin:auto;
  348. display:block;
  349. border-radius:100%;
  350. }
  351.  
  352. .blog-info{
  353. padding:20px;
  354. margin-top:30px;
  355. position:relative;
  356. text-align:center;
  357. background:{color:posts};
  358. }
  359.  
  360. .blog-info::before {
  361. width:0;
  362. height:0;
  363. top:-7px;
  364. content:'';
  365. position:absolute;
  366. border:0 solid transparent;
  367. border-left-width:7px;
  368. border-right-width:7px;
  369. left:calc(50% - 3.5px);
  370. border-bottom:7px solid {color:posts};
  371. }
  372.  
  373. .blog-title{
  374. font-weight:700;
  375. font-size:1.1em;
  376. color:{color:title};
  377. font-family:'pt serif';
  378. }
  379.  
  380. .blog-description{
  381. margin-top:20px;
  382. font-style:italic;
  383. }
  384.  
  385. .menu{
  386. display:flex;
  387. margin-top:20px;
  388. background:{color:posts};
  389. justify-content:space-between;
  390. }
  391.  
  392. .menu svg{
  393. display:block;
  394. width:1.1em;
  395. height:1.1em;
  396. }
  397.  
  398. .menu a{
  399. padding:1em;
  400. position:relative;
  401. }
  402.  
  403. .nav.active::before, .src.active::before{
  404. left:0;
  405. bottom:0;
  406. width:100%;
  407. content:'';
  408. height:2px;
  409. position:absolute;
  410. background:{color:sub color};
  411. }
  412.  
  413. .search{
  414. display:none;
  415. padding:20px;
  416. margin-top:20px;
  417. background:{color:posts};
  418. }
  419.  
  420. .search input{
  421. border:0;
  422. width:100%;
  423. background:none;
  424. text-transform:uppercase;
  425. color:{color:sub text};
  426. }
  427.  
  428. .list{
  429. display:none;
  430. padding:20px;
  431. margin-top:20px;
  432. background:{color:posts};
  433. font-family:'pt serif';
  434. justify-content:space-between;
  435. }
  436.  
  437. .list a{
  438. height:1.2em;
  439. display:inline-block;
  440. box-shadow:0 3px 0 {color:sub color};
  441. }
  442.  
  443. .list a:hover{box-shadow:0 0 0 {color:sub color};}
  444.  
  445. .list li:not(:last-of-type){margin-bottom:20px;}
  446.  
  447. .list.active, .search.active{display:flex;}
  448.  
  449. /*posts*/
  450.  
  451. #entries{
  452. margin:100px auto;
  453. position:relative;
  454. width:calc(500px + 400px);
  455. }
  456.  
  457. .post{
  458. width:500px;
  459. margin-bottom:100px;
  460. background:rgba({RGBcolor:posts},.5);
  461. }
  462.  
  463. .photo {
  464. overflow:hidden;
  465. position:relative;
  466. }
  467.  
  468. .photo img, .tex > .tmblr-full img{
  469. width:100%;
  470. display:block;
  471. }
  472.  
  473. /*titles*/
  474.  
  475. .post .title:first-of-type {
  476. padding:15px;
  477. text-transform:uppercase;
  478. color:{color:sub text};
  479. background:{color:posts};
  480. border-top:2px solid {color:sub color};
  481. }
  482.  
  483. .post.title a {color:{color:title};}
  484.  
  485. .post.title a:hover {color:{color:link};}
  486.  
  487. /*captions*/
  488.  
  489. .captions{padding:20px;}
  490.  
  491. .comment {
  492. padding:20px;
  493. margin:20px 0;
  494. list-style:none;
  495. position:relative;
  496. background:{color:posts};
  497. }
  498.  
  499. .comment:first-of-type {margin-top:0!important;}
  500.  
  501. .comment:last-of-type {margin-bottom:0!important;}
  502.  
  503. .comment.notorig{margin-left:70px;}
  504.  
  505. .comment.notorig::after{
  506. top:0;
  507. width:0;
  508. height:0;
  509. left:-7px;
  510. content:'';
  511. margin-top:20px;
  512. position:absolute;
  513. border-style:solid;
  514. border-width:7px 7px 7px 0;
  515. border-color:transparent {color:posts} transparent transparent;
  516. }
  517.  
  518. figure.tmblr-full + p{margin-top:25px;}
  519.  
  520. .user {
  521. top:0;
  522. position:absolute;
  523. margin-left:-95px;
  524. }
  525.  
  526.  
  527. .icon{
  528. width:50px;
  529. border-radius:100%;
  530. }
  531.  
  532. /*quote*/
  533.  
  534. .source{
  535. padding:10px;
  536. color:{color:sub text};
  537. background:{color:accent};
  538. }
  539.  
  540. .quote{
  541. padding:20px;
  542. font-size:1.1em;
  543. font-weight:700;
  544. color:{color:sub text};
  545. }
  546.  
  547. /*link*/
  548.  
  549. .link{
  550. padding:15px;
  551. font-size:1.1em;
  552. font-weight:700;
  553. position:relative;
  554. background:{color:posts};
  555. border-bottom:1px solid {color:accent};
  556. }
  557.  
  558. .link::before{
  559. content:'\e884';
  560. margin-right:20px;
  561. font-family:'feather';
  562. color:{color:sub color};
  563. }
  564.  
  565. .link::after{
  566. left:0;
  567. bottom:0;
  568. width:100%;
  569. height:1px;
  570. content:'';
  571. position:absolute;
  572. background:{color:sub color};
  573. }
  574.  
  575. /*audio*/
  576.  
  577. .player {
  578. width:30px;
  579. height:30px;
  580. margin:0 auto;
  581. overflow:hidden;
  582. border-radius:100%;
  583. border:1px solid {color:borders};
  584. }
  585.  
  586. .player iframe{width:100%;}
  587.  
  588. .audio {
  589. padding:20px;
  590. position:relative;
  591. background:{color:posts};
  592. }
  593.  
  594. .audio_info {
  595. font-weight:700;
  596. text-align:center;
  597. margin-bottom:20px;
  598. }
  599.  
  600. .audio_info span {
  601. display:block;
  602. overflow:hidden;
  603. white-space:nowrap;
  604. margin-bottom:10px;
  605. text-overflow:ellipsis;
  606. }
  607.  
  608. .audio .track {color:{color:title};}
  609.  
  610. /*asks*/
  611.  
  612. .asks{padding:20px;}
  613.  
  614. .question, .answer{
  615. padding:20px;
  616. background:{color:posts};
  617. }
  618.  
  619. .question{margin:-20px;}
  620.  
  621. .answer{margin-top:40px;}
  622.  
  623. .as{
  624. padding:10px;
  625. margin:-20px -20px 20px;
  626. text-transform:uppercase;
  627. color:{color:sub text};
  628. }
  629.  
  630. .question .as{background:{color:sub color};}
  631. .answer .as{background:{color:accent};}
  632.  
  633. /*chat*/
  634.  
  635. .l {
  636. padding:10px;
  637. border-bottom:1px solid {color:borders};
  638. }
  639.  
  640. .label {
  641. font-weight:bold;
  642. display:inline-block;
  643. color:{color:accent};
  644. }
  645.  
  646. .l:last-of-type {border-bottom:0;}
  647.  
  648. /*permalink and notes*/
  649.  
  650. .when {
  651. display:flex;
  652. padding:15px;
  653. background:{color:posts};
  654. }
  655.  
  656. .when a{
  657. display:block;
  658. overflow:hidden;
  659. position:relative;
  660. }
  661.  
  662. .wl{display:flex;}
  663.  
  664. .wl{margin-right:3px;}
  665.  
  666. .wl img{
  667. width:18px;
  668. height:18px;
  669. padding:2px;
  670. border-radius:100%;
  671. }
  672.  
  673. .wl a{margin-right:3px;}
  674.  
  675. .wl a:first-of-type img{border:2px solid {color:accent};}
  676. .wl a:last-of-type img{border:2px solid {color:sub color};}
  677.  
  678. .wr{
  679. order:2;
  680. display:flex;
  681. margin-left:auto;
  682. }
  683.  
  684. .wr a{
  685. width:20px;
  686. height:20px;
  687. display:flex;
  688. margin-left:3px;
  689. border-radius:2px;
  690. align-items:center;
  691. justify-content:center;
  692. background:{color:borders};
  693. }
  694.  
  695. .when svg{
  696. width:.75em;
  697. height:.75em;
  698. }
  699.  
  700. .when .like{
  701. }
  702.  
  703. .liked ~ svg{
  704. fill:{color:accent};
  705. color:{color:accent};
  706. }
  707.  
  708. .liked ~ span::after{content:"d"}
  709.  
  710. .when .like .like_button {position:relative;}
  711.  
  712. .when .like .like_button iframe {
  713. position:absolute;
  714. top:-30px;
  715. left:-30px;
  716. bottom:0;
  717. right:0;
  718. z-index:2;
  719. opacity:0;
  720. }
  721.  
  722. .tag {padding:20px;}
  723.  
  724. .tag svg{
  725. width:1em;
  726. height:1em;
  727. margin-left:10px;
  728. }
  729.  
  730. .tags{
  731. padding:10px;
  732. margin-top:10px;
  733. position:relative;
  734. background:{color:posts};
  735. }
  736.  
  737. .tags::before {
  738. width:0;
  739. height:0;
  740. top:-7px;
  741. content:'';
  742. position:absolute;
  743. border:0 solid transparent;
  744. border-left-width:7px;
  745. border-right-width:7px;
  746. border-bottom:7px solid {color:posts};
  747. }
  748.  
  749. .tags a {
  750. margin:0 5px;
  751. display:inline-block;
  752. vertical-align:middle;
  753. }
  754.  
  755. .tags a:nth-of-type(even)::before {
  756. content:'#';
  757. color:{color:accent};
  758. }
  759.  
  760. .tags a:nth-of-type(odd)::before {
  761. content:'#';
  762. color:{color:sub color};
  763. }
  764.  
  765. .pagenotes .title{
  766. display:flex;
  767. align-items:center;
  768. }
  769.  
  770. .pagenotes .title svg{
  771. width:1em;
  772. height:1em;
  773. margin-right:20px;
  774. }
  775.  
  776. ol.notes {
  777. margin:0px;
  778. padding:20px;
  779. border-right:0;
  780. list-style-type:none;
  781. }
  782.  
  783. ol.notes li.note {margin:20px 0;}
  784.  
  785. ol.notes li.note:first-of-type {margin-top:0;}
  786. ol.notes li.note:last-of-type {margin-bottom:0;}
  787.  
  788. li.note::before{
  789. margin-right:20px;
  790. font-family:'feather';
  791. vertical-align:middle;
  792. }
  793.  
  794. li.note.reblog::before{content:'\e8b6';}
  795. li.note.like::before{content:'\e879';}
  796. li.note.with_commentary::before, li.note.reply::before{content:'\e890';}
  797.  
  798. ol.notes li.note img.avatar {
  799. width:20px;
  800. height:20px;
  801. padding:2px;
  802. border-radius:100%;
  803. border:2px solid {color:sub color};
  804. }
  805.  
  806. ol.notes .clear{clear:both;}
  807.  
  808. a.avatar_frame {float:right;}
  809.  
  810. ol.notes blockquote{margin:1em 2em!important;}
  811.  
  812. a.more_notes_link {
  813. display:block;
  814. text-align:center;
  815. color:{color:title};
  816. }
  817.  
  818. {CustomCSS}
  819.  
  820. </style>
  821.  
  822. </head>
  823.  
  824.  
  825. <body>
  826.  
  827. <section id="entries">
  828.  
  829. <aside>
  830. <img src="{portraiturl-64}" class="blog-icon">
  831.  
  832. <div class="blog-info">
  833. <span class="blog-title">{title}</span>
  834.  
  835. {block:description}<div class="blog-description">{description}</div>{/block:description}
  836. </div>
  837.  
  838. <div class="menu">
  839. <a href="{blogurl}" title="home"><i data-feather="home"></i></a>
  840. <a href="/ask" title="message"><i data-feather="message-square"></i></a>
  841. <a href="/archive" title="archive"><i data-feather="rewind"></i></a>
  842. <a class="src" title="search"><i data-feather="search"></i></a>
  843. <a class="nav" title="navigation"><i data-feather="list"></i></a>
  844. </div>
  845.  
  846. <div>
  847. <form action="/search" method="get" class="search">
  848. <input type="text" name="q" value="{SearchQuery}" placeholder="search"/>
  849. </form>
  850. </div>
  851.  
  852. <div class="list">
  853. <ul>
  854. <li><a href="{text:Link one url}">{text:Link one title}</a></li>
  855. <li><a href="{text:Link two url}">{text:Link two title}</a></li>
  856. <li><a href="{text:Link three url}">{text:Link three title}</a></li>
  857. </ul>
  858.  
  859. <ul>
  860. <li><a href="{text:Link four url}">{text:Link four title}</a></li>
  861. <li><a href="{text:Link five url}">{text:Link five title}</a></li>
  862. <li><a href="{text:Link six url}">{text:Link six title}</a></li>
  863. </ul>
  864. </div>
  865. </aside>
  866.  
  867. {block:posts}
  868.  
  869. <article class="post {block:caption}captioned{/block:caption}" id="{postid}">
  870.  
  871. {block:Quote}
  872. {block:Source}<div class="source">{source}</div>{/block:Source}
  873. <div class="quote">"{quote}"</div>
  874. {/block:Quote}
  875.  
  876. {block:Text}
  877. {block:Title}<div class="title">{title}</div>{/block:Title}
  878. {block:RebloggedFrom}
  879. <div class="captions">
  880. {block:Reblogs}
  881. <li class="comment notorig">
  882. {block:IsActive}
  883. <a {block:haspermalink}href="{permalink}"{/block:haspermalink} class="user" target="_blank">
  884. <img src="{portraiturl-64}" class="icon"/>
  885. </a>
  886. {/block:IsActive}
  887.  
  888. {block:IsDeactivated}
  889. <span {block:haspermalink}href="{permalink}"{/block:haspermalink} class="user deactivated" target="_blank">
  890. <img src="{portraiturl-64}" class="icon"/>
  891. </span>
  892. {block:IsDeactivated}
  893. <div class="tex">{body}</div>
  894. </li>
  895. {/block:Reblogs}
  896. </div>
  897. {/block:RebloggedFrom}
  898. {block:NotReblog}
  899. <div class="captions">
  900. <li class="comment">
  901. <div class="tex">{body}</div>
  902. </li>
  903. </div>
  904. {/block:NotReblog}
  905. {/block:Text}
  906.  
  907. {block:Link}
  908. <div class="link"><a href="{URL}">{name}</a></div>
  909.  
  910. {block:Description}
  911. {block:NotReblog}
  912. <div class="captions">
  913. <li class="comment">
  914. <div class="tex">{description}</div>
  915. </li>
  916. </div>
  917. {/block:NotReblog}
  918. {/block:Description}
  919. {block:RebloggedFrom}
  920. <div class="captions">
  921. {block:Reblogs}
  922. <li class="comment notorig">
  923. {block:IsActive}
  924. <a {block:haspermalink}href="{permalink}"{/block:haspermalink} class="user" target="_blank">
  925. <img src="{portraiturl-64}" class="icon"/>
  926. </a>
  927. {/block:IsActive}
  928.  
  929. {block:IsDeactivated}
  930. <span {block:haspermalink}href="{permalink}"{/block:haspermalink} class="user deactivated" target="_blank">
  931. <img src="{portraiturl-64}" class="icon"/>
  932. </span>
  933. {block:IsDeactivated}
  934. <div class="tex">{body}</div>
  935. </li>
  936. {/block:Reblogs}
  937. </div>
  938. {/block:RebloggedFrom}
  939. {/block:Link}
  940.  
  941.  
  942. {block:Chat}
  943. {block:Title}<div class="title">{title}</div>{/block:Title}
  944. <ol class="chat {block:Title}ted{/block:Title}">
  945. {block:lines}
  946. <li class="l {Alt}">
  947. {block:label}<span class="label">{label}</span>{/block:label} {line}
  948. </li>
  949. {/block:lines}
  950. </ol>
  951. {/block:Chat}
  952.  
  953. {block:Photo}
  954.  
  955. <div class="photo">{linkopentag}<a href="#" 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></div>
  956.  
  957. {/block:Photo}
  958.  
  959. {block:Photoset}
  960. <div class="photo"><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></div>
  961. {/block:Photoset}
  962.  
  963. {block:Video}<div class="photo video">{video-500}</div>{/block:Video}
  964.  
  965. {block:Audio}
  966. {block:audioplayer}
  967. <div class="audio">
  968. <div class="audio_info">
  969. {block:trackname}<span class="track">{trackname}</span>{/block:trackname}
  970. {block:artist}<span class="artist">{artist}</span>{/block:artist}
  971. </div>
  972. <div class="player">{audioplayerwhite}</div>
  973. </div>
  974. {/block:audioplayer}
  975. {/block:Audio}
  976.  
  977. {block:Answer}
  978. <div class="asks">
  979. <div class="question">
  980. <div class="as">{asker}</div>
  981. <div class="tex">{question}</div>
  982. </div>
  983. {block:Answerer}
  984. <div class="answer">
  985. <div class="as">{answerer}</div>
  986. <div class="tex">{answer}</div>
  987. </div>
  988. {/block:Answerer}
  989. {block:NotReblog}
  990. <div class="answer">
  991. {replies}
  992. </div>
  993. {/block:NotReblog}
  994. {block:RebloggedFrom}
  995. {block:Reblogs}
  996. <div class="answer">
  997. <div class="as">
  998. <a {block:haspermalink}href="{permalink}"{/block:haspermalink} target="_blank">{username}</a>
  999. </div>
  1000. <div class="tex">{body}</div>
  1001. </div>
  1002. {/block:Reblogs}
  1003. {/block:RebloggedFrom}
  1004. </div>
  1005. {/block:Answer}
  1006.  
  1007. {block:caption}
  1008. <div class="captions">
  1009. {block:Reblogs}
  1010. <li class="comment notorig">
  1011. {block:IsActive}
  1012. <a {block:haspermalink}href="{permalink}"{/block:haspermalink} class="user" target="_blank">
  1013. <img src="{portraiturl-64}" class="icon"/>
  1014. </a>
  1015. {/block:IsActive}
  1016.  
  1017. {block:IsDeactivated}
  1018. <span {block:haspermalink}href="{permalink}"{/block:haspermalink} class="user deactivated" target="_blank">
  1019. <img src="{portraiturl-64}" class="icon"/>
  1020. </span>
  1021. {block:IsDeactivated}
  1022. <div class="tex">{body}</div>
  1023. </li>
  1024. {/block:Reblogs}
  1025. {block:NotReblog}
  1026. <li class="comment">
  1027. <div class="tex">{caption}</div>
  1028. </li>
  1029. {/block:NotReblog}
  1030. </div>
  1031. {/block:caption}
  1032.  
  1033. {block:date}
  1034. {block:hastags}
  1035. <div class="tag">
  1036. <i data-feather="tag"></i>
  1037. <div class="tags">
  1038. {block:Tags}<a href="{TagUrl}">{Tag}</a>{/block:Tags}
  1039. </div>
  1040. </div>
  1041. {/block:hasTags}
  1042.  
  1043.  
  1044. <div class="when">
  1045.  
  1046. {block:RebloggedFrom}
  1047. <div class="wl">
  1048. <a href="{ReblogRootURL}" title="source: {ReblogRootName}"><img src="{ReblogRootPortraitURL-16}"></a>
  1049. <a href="{ReblogParentURL}" title="via: {ReblogParentName}"><img src="{ReblogParentPortraitURL-16}"></a>
  1050. </div>
  1051. {/block:RebloggedFrom}
  1052.  
  1053. <div class="wr">
  1054. <a class="perma" href="{permalink}"><i data-feather="bookmark"></i></a>
  1055.  
  1056. <a href="#" class="like">
  1057. {LikeButton size="100"}
  1058. <i data-feather="heart"></i>
  1059. </a>
  1060.  
  1061. <a href="{ReblogURL}" target="_blank">
  1062. <i data-feather="refresh-ccw"></i>
  1063. </a>
  1064. </div>
  1065.  
  1066. </div>
  1067. {/block:date}
  1068.  
  1069. </article>
  1070.  
  1071.  
  1072. {block:permalinkpage}
  1073.  
  1074. {block:PostNotes}
  1075. <article class="post pagenotes">
  1076. <div class="title">
  1077. <i data-feather="heart"></i>
  1078. <span class="notecount">{NoteCountWithLabel}</span>
  1079. </div>
  1080. {PostNotes-64}
  1081. </article>
  1082. {/block:PostNotes}
  1083.  
  1084. {/block:permalinkpage}
  1085.  
  1086. {/block:Posts}
  1087.  
  1088. {block:Pagination}
  1089. {block:ifInfiniteScroll}
  1090. <footer>
  1091. {block:NextPage}<a href="{NextPage}"></a>{/block:NextPage}
  1092. </footer>
  1093. {/block:ifInfiniteScroll}
  1094.  
  1095. {block:ifNotInfiniteScroll}
  1096. <footer class="pagination">
  1097. {block:PreviousPage}<a href="{PreviousPage}"><i data-feather="chevron-left"></i></a>{/block:PreviousPage}
  1098. {block:NextPage}<a href="{NextPage}"><i data-feather="chevron-right"></i></a>{/block:NextPage}
  1099. </footer>
  1100. {/block:ifNotInfiniteScroll}
  1101.  
  1102. {/block:Pagination}
  1103. </section>
  1104.  
  1105. <a href="//kosmique.tumblr.com" class="credits"><i data-feather="star"></i></a>
  1106.  
  1107. {block:indexpage}{block:ifinfinitescroll}<script src="//static.tumblr.com/wgijwsy/u2vm2hxv6/jquery.infinitescroll.min.js"></script>{/block:ifinfinitescroll}{/block:indexpage}
  1108.  
  1109. <script>
  1110. $(document).ready(function(){
  1111. var $container = $('#entries');
  1112. $('.photo-slideshow').pxuPhotoset({
  1113. lightbox: true,
  1114. rounded: false,
  1115. gutter: '1px',
  1116. borderRadius: '0px',
  1117. photoset: '.photo-slideshow',
  1118. photoWrap: '.photo-data',
  1119. photo: '.pxu-photo'
  1120. });
  1121. $container.find('.notecount').each(function(){
  1122. var n = $(this).html().split(' ')[0].replace(/,/g, '');
  1123. if (n > 999) {
  1124. n = Math.floor(n / 100) / 10;
  1125. $(this).text(n + 'k notes');
  1126. }
  1127. });
  1128. feather.replace();
  1129. $('iframe.tumblr_audio_player').load( function(){
  1130. $('iframe.tumblr_audio_player').contents().find("head")
  1131. .append($("<style type='text/css'> .audio-player{background:transparent!important;} .play-pause{color:rgb(200,200,200)!important; font-size:1em!important;} </style>"));
  1132. });
  1133. flexibleFrames($(".video"));
  1134. $("[title]").style_my_tooltips({
  1135. tip_follows_cursor:true,
  1136. tip_delay_time:100,
  1137. tip_fade_speed:100
  1138. });
  1139. var npfOptions = {
  1140. rowClass:"npf_row",
  1141. imageContainerClass:"tmblr-full",
  1142. generatedPhotosetContainerClass:"npf_photoset",
  1143. imageClass:"npf_image",
  1144. includeCommonPhotosets: true,
  1145. useTumblrLightbox: true,
  1146. insertGalleryIndicator: false,
  1147. galleryIndicatorClass: "npf_gallery_indicator",
  1148. galleryIndicatorContent: "<img src='image_url'>",
  1149. photosetMargins:"1"
  1150. }
  1151. npfPhotosets(".post", npfOptions);
  1152. $('a[href*="t.umblr.com/redirect"]').each(function(){
  1153. var originalURL = $(this).attr("href").split("?z=")[1].split("&t=")[0];
  1154. var replaceURL = decodeURIComponent(originalURL);
  1155. $(this).attr("href", replaceURL);
  1156. });
  1157. $('.captions').each(function() {
  1158. var $this = $(this);
  1159. if($this.html().replace(/\s|&nbsp;/g, '').length == 0)
  1160. $this.remove();
  1161. });
  1162. $('.nav').click(function(){
  1163. $(this).toggleClass('active');
  1164. $('.search,.src').removeClass('active',200);
  1165. $('.list').toggleClass('active',200);
  1166. });
  1167. $('.src').click(function(){
  1168. $(this).toggleClass('active');
  1169. $('.list,.nav').removeClass('active',200);
  1170. $('.search').toggleClass('active',200);
  1171. });
  1172. {block:indexpage}
  1173. {block:ifinfinitescroll}
  1174. $container.infinitescroll({
  1175. itemSelector: 'article',
  1176. navSelector: 'footer',
  1177. nextSelector: 'footer a',
  1178. loadingImg: '',
  1179. loadingText: '<em></em>',
  1180. bufferPx: 100
  1181. },
  1182. function( newElements ) {
  1183. var $newElems = $( newElements );
  1184. var $newElemsIDs = $newElems.map(function(){
  1185. return this.id;
  1186. }).get();
  1187. Tumblr.LikeButton.get_status_by_post_ids($newElemsIDs);
  1188. $newElems.find('.photo-slideshow').pxuPhotoset({
  1189. lightbox: true,
  1190. rounded: false,
  1191. gutter: '1px',
  1192. borderRadius: '0px',
  1193. photoset: '.photo-slideshow',
  1194. photoWrap: '.photo-data',
  1195. photo: '.pxu-photo'
  1196. });
  1197. feather.replace();
  1198. $newElems.find('.notecount').each(function(){
  1199. var n = $(this).html().split(' ')[0].replace(/,/g, '');
  1200. if (n > 999) {
  1201. n = Math.floor(n / 100) / 10;
  1202. $(this).text(n + 'k notes');
  1203. }
  1204. });
  1205. $('iframe.tumblr_audio_player').load( function(){
  1206. $('iframe.tumblr_audio_player').contents().find("head")
  1207. .append($("<style type='text/css'> .audio-player{background:transparent!important;} .play-pause{color:rgb(200,200,200) !important; font-size:1em!important;} </style>"));
  1208. });
  1209. flexibleFrames($(".video"));
  1210. npfPhotosets(".post", npfOptions);
  1211. $newElems.find('.captions').each(function() {
  1212. var $this = $(this);
  1213. if($this.html().replace(/\s|&nbsp;/g, '').length == 0)
  1214. $this.remove();
  1215. });
  1216. });
  1217. {/block:ifinfinitescroll}
  1218. {/block:indexpage}
  1219. });
  1220.  
  1221. </script>
  1222. {block:ContentSource}
  1223. <!-- {SourceURL}{block:SourceLogo}<img src="{BlackLogoURL}"
  1224. width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" />
  1225. {/block:SourceLogo}
  1226. {block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo} -->
  1227. {/block:ContentSource}
  1228. </body></html>
Add Comment
Please, Sign In to add comment