Advertisement
niehauscosima

infinity

Apr 4th, 2019
10,532
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 28.50 KB | None | 0 0
  1. <!--
  2.  
  3. infinity by ananda (captainmarvels)
  4. thanks for 10k followers! :)
  5.  
  6. LAST UPDATED: june 12th 2019
  7.  
  8. ////////////////////////////////////////////////
  9.  
  10. base code
  11. © sorrism
  12.  
  13. pxu photosets
  14. the MIT license (MIT) copyright (c) 2013
  15. © pixel union, modified by bychloethemes
  16.  
  17. feather icons
  18. © cole bemis
  19.  
  20. -->
  21.  
  22. <!DOCTYPE html>
  23. <head>
  24.  
  25. <title>{block:TagPage}#{Tag} : {/block:TagPage} {block:PostSummary}{PostSummary} : {/block:PostSummary}{Title}</title>
  26.  
  27. <link rel="shortcut icon" href="{favicon}">
  28.  
  29. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  30. {block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}
  31.  
  32. <!--default variables-->
  33.  
  34. <meta name="if:blogtitle" content="1"/>
  35. <meta name="if:draggable tags" content="1"/>
  36. <meta name="if:search" content="1"/>
  37.  
  38. <meta name="select:body font" content="Helvetica" title="Helvetica"/>
  39. <meta name="select:body font" content="Heebo" title="Heebo"/>
  40. <meta name="select:body font" content="Roboto" title="Roboto"/>
  41.  
  42. <meta name="select:post size" content="540" title="540"/>
  43. <meta name="select:post size" content="450" title="450"/>
  44. <meta name="select:post size" content="350" title="350"/>
  45.  
  46. <meta name="color:background" content="#f7f7f7"/>
  47. <meta name="color:text" content="#444444"/>
  48. <meta name="color:link" content="#888888"/>
  49. <meta name="color:link hover" content="#868686"/>
  50.  
  51. <meta name="text:home title" content="index"/>
  52. <meta name="text:ask title" content="message"/>
  53. <meta name="text:archive title" content="history"/>
  54. <meta name="text:link 1 url" content="" />
  55. <meta name="text:link 1 name" content="" />
  56. <meta name="text:link 2 url" content="" />
  57. <meta name="text:link 2 name" content="" />
  58. <meta name="text:link 3 url" content="" />
  59. <meta name="text:link 3 name" content="" />
  60. <meta name="text:link 4 url" content="" />
  61. <meta name="text:link 4 name" content="" />
  62.  
  63. <meta name="image:sidebar" content=""/>
  64.  
  65. <!--fonts-->
  66.  
  67. <link href="https://fonts.googleapis.com/css?family=Bai+Jamjuree:400,400i,500,500i,600,600i,700,700i" rel="stylesheet">
  68.  
  69. <link href="https://fonts.googleapis.com/css?family=Heebo:400,500,700|Roboto:400,400i,500,500i,700,700i" rel="stylesheet">
  70.  
  71. <!--scripts-->
  72.  
  73. <script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
  74. <!--feather icons by -->
  75. <script src="https://unpkg.com/feather-icons"></script>
  76. <!--video resizing by shythemes-->
  77. <script src="//code.jquery.com/ui/1.10.4/jquery-ui.js"></script><script src ="//static.tumblr.com/fwgzvyf/Oj1o08f6h/shythemes.vr.js"></script>
  78. <!--pxu photosets by pixel union and bychloethemes-->
  79. <script src="https://static.tumblr.com/yxfeliq/hHwojmt8m/bctphotoset.min.js"></script> <link href="https://static.tumblr.com/qudkd6d/OcDnl99gb/style.css" rel="stylesheet" type="text/css"/>
  80.  
  81. <!--css customization-->
  82.  
  83. <style type="text/css">
  84.  
  85.  
  86. .tmblr-full img {
  87. max-width:100%;
  88. }
  89.  
  90. .vignette, #vignette {
  91. opacity:0;
  92. }
  93.  
  94. .lightbox-image, #tumblr_lightbox img {
  95. box-shadow:none !important;
  96. border-radius:0 !important;
  97. max-width:none;
  98. }
  99.  
  100. .tmblr-lightbox, #tumblr_lightbox {
  101. background-color:rgba(255,255,255,.8) !important;
  102. }
  103.  
  104. #tumblr_lightbox img {
  105. padding:5px;
  106. -moz-box-sizing:border-box;
  107. box-sizing:border-box;
  108. }
  109.  
  110. .lightbox-image {
  111. padding:0px;
  112. background-color:rgba(255,255,255,1) !important;
  113. }
  114.  
  115. /*tumblr controls by cyantists*/
  116.  
  117. iframe.tmblr-iframe {
  118. z-index:99999999999999!important;
  119. top:14px!important;
  120. right:19px!important;
  121. opacity:0;
  122. padding-right:38px;
  123. /* delete invert(1) from here */
  124. filter:invert(1) contrast(150%);
  125. -webkit-filter:invert(1) contrast(150%);
  126. -o-filter:invert(1) contrast(150%);
  127. -moz-filter:invert(1) contrast(150%);
  128. -ms-filter:invert(1) contrast(150%);
  129. /* to here if your blog has a dark background */
  130. transform:scale(0.75);
  131. transform-origin:100% 0;
  132. -webkit-transform:scale(0.75);
  133. -webkit-transform-origin:100% 0;
  134. -o-transform:scale(0.75);
  135. -o-transform-origin:100% 0;
  136. -moz-transform:scale(0.75);
  137. -moz-transform-origin:100% 0;
  138. -ms-transform:scale(0.75);
  139. -ms-transform-origin:100% 0;
  140. -webkit-transition:opacity .3s ease-out;
  141. transition:opacity .3s ease-out;
  142. }
  143.  
  144. iframe.tmblr-iframe:hover {
  145. opacity:0.6!important;}
  146.  
  147. .hcontrols {
  148. position:fixed;
  149. top:8px;
  150. right:4px;
  151. z-index:999999999;}
  152.  
  153. .hcontrols svg {
  154. opacity:0.5;
  155. width:20px;
  156. height:20px;
  157. padding:15px;
  158. stroke-width:2;
  159. }
  160.  
  161. .hcontrols svg path {
  162. fill:{color:text};/* change this to change the color of the icon */
  163. }
  164.  
  165. ::-webkit-scrollbar {
  166. width:3px;
  167. height:3px;
  168. }
  169.  
  170. ::-webkit-scrollbar-thumb {
  171. background-color:{color:text};
  172. min-height:10px;
  173. min-width:10px;
  174. }
  175.  
  176. .ui-tooltip {
  177. position:absolute;
  178. z-index:9999;
  179. padding-top:10px;
  180. border-radius:10%;
  181. }
  182.  
  183. .ui-tooltip-content {
  184. padding:0.50em 0.70em;
  185. background-color:#fff;
  186. box-shadow:0 1px 3px #eee;
  187. border-radius:4px;
  188. font-size:11px;
  189. text-transform:lowercase;
  190. }
  191.  
  192. ::selection {
  193. background:#f8f8f8;
  194. color:{color:text};
  195. padding:3px;
  196. }
  197.  
  198. ::-moz-selection {
  199. background:#f8f8f8;
  200. color:#f8f8f8;
  201. }
  202.  
  203. ::-webkit-selection {
  204. background:#f8f8f8;
  205. color:#f8f8f8;
  206. }
  207.  
  208. body {
  209. font:11px {select:body font}, sans-serif;
  210. background:{color:background};
  211. color:{color:text};
  212. line-height:1.8em;
  213. font-style:normal;
  214. word-wrap:break-word;
  215. text-align:left;
  216. opacity: 1;
  217. transition: 1s opacity;
  218. }
  219.  
  220. body.fade-out {
  221. opacity: 0;
  222. transition: none;
  223. }
  224.  
  225. a {
  226. color:{color:link};
  227. text-decoration:none;
  228. transition:all .3s linear;
  229. -webkit-transition:all .3s linear;
  230. -o-transition:all .3s linear;
  231. -moz-transition:all .3s linear;
  232. }
  233.  
  234. a:hover {
  235. color:{color:link hover};
  236. }
  237.  
  238. a, a img {cursor:pointer;}
  239.  
  240. img {
  241. opacity:1;
  242. border:0;
  243. text-decoration:none;
  244. max-width:100%;
  245. height:auto;
  246. display:block;
  247. }
  248.  
  249. b, strong, b a, strong a {
  250. font-weight:700!important;
  251. color:{color:text};
  252. }
  253.  
  254. small, big, sub, pre {
  255. margin:0;
  256. font-size:1em!important;
  257. vertical-align:baseline!important;
  258. }
  259.  
  260. i {
  261. font-style:italic;
  262. color:{color:text};
  263. }
  264.  
  265. h1, h2, h3, h4 {
  266. margin:1em 0;
  267. font-family:'Bai Jamjuree', sans-serif;
  268. color:{color:text};
  269. letter-spacing:0.70px;
  270. text-transform:uppercase;
  271. font-weight:700;
  272. font-size:13px;
  273. }
  274.  
  275. p {margin:1em 0;}
  276.  
  277. ul:first-of-type,
  278. ol:first-of-type,
  279. p:first-of-type {margin-top:0;}
  280.  
  281. ul:last-of-type,
  282. ol:last-of-type,
  283. p:last-of-type {margin-bottom:0;}
  284.  
  285. blockquote, ol, ul, pre, figure {margin:1em 0;}
  286.  
  287. .posts h1:first-child,
  288. .posts h2:first-child,
  289. .posts h3:first-child,
  290. .posts h4:first-child {margin-top:0;}
  291.  
  292. hr {
  293. border:none;
  294. box-shadow:0;
  295. margin:2em auto;
  296. width:75px;
  297. }
  298.  
  299. ul, ol {
  300. list-style-type:circle;
  301. }
  302.  
  303. blockquote {
  304. padding:0;
  305. margin:0;
  306. border:0;
  307. }
  308.  
  309. pre {
  310. padding:0;
  311. margin:0;
  312. line-height:inherit!important;
  313. background:transparent;
  314. font-family:inherit!Important;
  315. font-size:inherit!important;
  316. white-space:pre-wrap;
  317. white-space:-moz-pre-wrap;
  318. white-space:-pre-wrap;
  319. white-space:-o-pre-wrap;
  320. word-wrap:break-word;
  321. }
  322.  
  323. #container {
  324. width:calc({select:post size}px + 200px + 100px);
  325. margin:0 auto;
  326. }
  327.  
  328. aside {
  329. margin:100px 0 0 0;
  330. display:block;
  331. width:200px;
  332. position:fixed;
  333. padding:1.5em;
  334. background-color:#fff;
  335. box-shadow:0 1px 3px #eee;
  336. border-bottom:1px solid #eee;
  337. border-radius:6px;
  338. }
  339.  
  340. .sb img {
  341. margin-top:0;
  342. margin-bottom:1em;
  343. left:0;
  344. display:block;
  345. width:50px;
  346. height:50px;
  347. -moz-border-radius:100px;
  348. -webkit-border-radius:100px;
  349. border-radius:100%;
  350. border:1px solid #eee;
  351. padding:3px;
  352. box-shadow:0 1px 3px #eee;
  353. }
  354.  
  355. #blogtitle {
  356. margin:0 0 1em 0;
  357. display:block;
  358. text-align:left;
  359. }
  360.  
  361. #blogtitle a {
  362. letter-spacing:0.70px;
  363. font-family:'Bai Jamjuree', sans-serif;
  364. color:{color:text};
  365. font-size:12px;
  366. text-transform:uppercase;
  367. font-weight:700;
  368. }
  369.  
  370. #blogtitle a:hover {
  371. color:{color:link hover};
  372. }
  373.  
  374. #description {margin:0 0 1em 0; text-align:left;}
  375.  
  376. nav {
  377. display:block;
  378. text-align:left;
  379. counter-reset:section;
  380. }
  381.  
  382. nav a {
  383. font-size:10.5px;
  384. letter-spacing:0.70px;
  385. color:{color:text};
  386. display:block;
  387. text-transform:uppercase;
  388. font-family:'Bai Jamjuree', sans-serif;
  389. font-weight:700;
  390. }
  391.  
  392. nav a:not(:last-child) {
  393. margin:0.5em 0;
  394. }
  395.  
  396. nav a:hover {
  397. color:{color:link hover};
  398. }
  399.  
  400. nav a:after {
  401. counter-increment:section;
  402. content:'— 0'counter(section);
  403. color:#ccc;
  404. padding-left:5px;
  405. font-family:'Bai Jamjuree', sans-serif;
  406. font-size:10px;
  407. letter-spacing:0.70px;
  408. font-weight:normal;
  409. }
  410.  
  411. #search {
  412. border-top:1px solid #eee;
  413. padding-top:1em;
  414. margin-top:1em;
  415. display:block;
  416. }
  417.  
  418. #search svg {
  419. stroke:{color:link};
  420. stroke-width:3;
  421. stroke-linecap:round;
  422. stroke-linejoin:round;
  423. fill:none;
  424. width:10px;
  425. height:auto;
  426. padding:0px;
  427. overflow:visible;
  428. margin-right:0.5em;
  429. }
  430.  
  431. #search input {
  432. text-align:left;
  433. background:transparent;
  434. width:90%;
  435. text-transform:normal;
  436. font:11px {select:body font}, sans-serif;
  437. font-weight:normal;
  438. border:none;
  439. -webkit-transition:1s;
  440. -moz-transition:1s;
  441. -o-transition:1s;
  442. }
  443.  
  444. #search input:focus {
  445. outline:none;
  446. opacity:1;
  447. }
  448.  
  449. #search input:hover {
  450. -webkit-transition:1s;
  451. -moz-transition:1s;
  452. -o-transition:1s;
  453. }
  454.  
  455. input:focus::-webkit-input-placeholder {opacity:1}
  456. input:focus:-moz-placeholder,
  457. input:focus::-moz-placeholder,
  458. input:focus:-ms-input-placeholder {color:transparent;}
  459.  
  460. .entries {
  461. margin:100px 0;
  462. width:{select:post size}px;
  463. float:right;
  464. }
  465.  
  466. .posts {
  467. width:{select:post size}px;
  468. text-align:left;
  469. margin-bottom:100px;
  470. padding:1.5em;
  471. background-color:#fff;
  472. box-shadow:0 1px 3px #eee;
  473. border-bottom:1px solid #eee;
  474. border-radius:6px;
  475. }
  476.  
  477. .posts:last-child {
  478. margin-bottom:0px;
  479. }
  480.  
  481. {block:Permalinkpage}
  482. .posts {
  483. margin-bottom:30px;
  484. }
  485. {/block:Permalinkpage}
  486.  
  487. .ph {
  488. position:relative;
  489. overflow:hidden;
  490. margin:0;
  491. }
  492.  
  493. .ph img {
  494. width:auto;
  495. display:block;
  496. }
  497.  
  498. .player {
  499. width:25px;
  500. height:24px;
  501. position:absolute;
  502. left:10px;
  503. top:calc(50% - 15px);
  504. display:block;
  505. overflow:hidden;
  506. }
  507.  
  508. .hold {
  509. text-align:left;
  510. background:#f9f9f9;
  511. box-shadow:0 1px 1px #eaeaea;
  512. -webkit-box-shadow:0 1px 1px #eaeaea;
  513. position:relative;
  514. border-radius:4px;
  515. display:block;
  516. min-height:24px;
  517. padding:15px;
  518. }
  519.  
  520. .audio_info {
  521. vertical-align:middle;
  522. line-height:12px;
  523. margin-left:35px;
  524. max-width:calc(100% - 35px);
  525. }
  526.  
  527. .audio_info span {
  528. white-space:nowrap;
  529. overflow:hidden;
  530. text-overflow:ellipsis;
  531. display:block;
  532. }
  533.  
  534. .hold .track {color:{color:accent};}
  535.  
  536. .pagination {
  537. padding:1.5em;
  538. width:540px;
  539. text-align:center;
  540. }
  541.  
  542. .pagination a {
  543. margin:0 5px;
  544. }
  545.  
  546. .forward svg {
  547. width:12px;
  548. height:12px;
  549. stroke:{color:text};
  550. stroke-width:2;
  551. stroke-linecap:round;
  552. stroke-linejoin:round;
  553. fill:none;
  554. }
  555.  
  556. .backward svg {
  557. width:12px;
  558. height:12px;
  559. background-color:#fff;
  560. border-radius:100%;
  561. padding:1em;
  562. stroke:{color:text};
  563. stroke-width:2;
  564. stroke-linecap:round;
  565. stroke-linejoin:round;
  566. fill:none;
  567. box-shadow:0 1px 1px #eee;
  568. }
  569.  
  570. .comment {
  571. padding:0 0 1.5em 0;
  572. list-style:none;
  573. }
  574.  
  575. .comment:last-of-type {padding-bottom:0!important;}
  576.  
  577. .user {
  578. display:inline-block;
  579. line-height:28px;
  580. font-size:10.5px;
  581. letter-spacing:0.70px;
  582. color:{color:text};
  583. display:block;
  584. text-transform:uppercase;
  585. font-family:'Bai Jamjuree', sans-serif;
  586. font-weight:700;
  587. margin-bottom:.75em;
  588. }
  589.  
  590. .icon {
  591. vertical-align:top;
  592. margin-right:4px;
  593. display:inline-block;
  594. float:left;
  595. }
  596.  
  597. .icon img {
  598. width:18px;
  599. height:18px;
  600. -moz-border-radius:100px;
  601. -webkit-border-radius:100px;
  602. border-radius:100%;
  603. border:1px solid #eee;
  604. padding:3px;
  605. box-shadow:0 1px 3px #eee;
  606. }
  607.  
  608. .captioned .comment:first-of-type {margin-top:1.5em;}
  609.  
  610. .tex li, .tex blockquote {text-align:left;}
  611.  
  612. .a {
  613. display:inline-block;
  614. width:540px;
  615. }
  616.  
  617. .q {
  618. margin-bottom:0.9em;
  619. width:calc({select:post size}px - 85px);
  620. float:left;
  621. border-radius:6px;
  622. background:#f9f9f9;
  623. padding:1.5em;
  624. text-align:left;
  625. position: relative;
  626. box-shadow:0 1px 3px #eee;
  627. }
  628.  
  629. .q:after {
  630. content:"";
  631. width:0px;
  632. height:0px;
  633. position:absolute;
  634. border-left:10px solid #f9f9f9;
  635. border-right:10px solid transparent;
  636. border-top:10px solid #f9f9f9;
  637. border-bottom:10px solid transparent;
  638. right:-12px;
  639. top:0px;
  640. }
  641.  
  642. .as b {
  643. font-family:'Bai Jamjuree', sans-serif;
  644. letter-spacing:0.70px;
  645. color:{color:text};
  646. text-transform:uppercase;
  647. font-weight:700;
  648. }
  649.  
  650. .chat {
  651. text-align:left;
  652. padding:0;
  653. margin:0;
  654. list-style:none;
  655. }
  656.  
  657. .l {
  658. margin-bottom:1em;
  659. }
  660.  
  661. .l:last-child {
  662. margin-bottom:0;
  663. }
  664.  
  665. .label {
  666. padding-right:5px;
  667. font-weight:700;
  668. color:{color:text};
  669. display:inline-block;
  670. }
  671.  
  672. .permalink {
  673. margin-top:2em;
  674. text-align:left;
  675. border-top:1px solid #eee;
  676. }
  677.  
  678. .permas {
  679. margin:-10px 0 0 0;
  680. }
  681.  
  682. .permas span {
  683. display:inline-block;
  684. margin:0 auto;
  685. padding:0;
  686. background:#fff;
  687. }
  688.  
  689. .permaleft a {
  690. display:inline-block;
  691. text-transform:lowercase;
  692. margin-right:8px;
  693. {block:IndexPage}
  694. color:{color:text};
  695. {/block:IndexPage}
  696. {block:PermalinkPage}
  697. color:{color:link};
  698. {/block:PermalinkPage}
  699. }
  700.  
  701. .permaright a {
  702. display:inline-block;
  703. color:{color:text};
  704. text-transform:uppercase;
  705. font-family:'Bai Jamjuree', sans-serif;
  706. letter-spacing:0.70px;
  707. font-weight:700;
  708. }
  709.  
  710. .permaright a:first-child {
  711. margin-left:8px;
  712. }
  713.  
  714. .permaright {
  715. float:right;
  716. }
  717.  
  718. .permas a:hover {
  719. color:{color:link hover};
  720. }
  721.  
  722. /*svg icons tutorial by shythemes*/
  723.  
  724. .controls svg {
  725. stroke:{color:text};
  726. stroke-width:3;
  727. stroke-linecap:round;
  728. stroke-linejoin:round;
  729. fill:none;
  730. width:10px;
  731. height:auto;
  732. padding:0px;
  733. display:block;
  734. overflow:visible;
  735. }
  736.  
  737. .controls {
  738. display:inline;
  739. }
  740.  
  741. .controls a {
  742. vertical-align:middle;
  743. position:relative;
  744. display:inline-block;
  745. overflow:hidden;
  746. width:12px;
  747. height:12px;
  748. }
  749.  
  750. .controls .like .liked + svg path {
  751. stroke-width:2;
  752. stroke:#c93d12;
  753. fill:#fb4c16;
  754. }
  755.  
  756. .controls .like .like_button {
  757. position:relative;
  758. }
  759.  
  760. .controls .like .like_button iframe {
  761. position:absolute;
  762. top:-3px;
  763. left:-3px;
  764. bottom:0;
  765. right:0;
  766. z-index:2;
  767. opacity:0;
  768. }
  769.  
  770. .tags {
  771. margin:0.5em 0 0 0;
  772. width:{select:post size}px;
  773. text-align:left;
  774. }
  775.  
  776. .tags a {
  777. font-weight:normal;
  778. text-transform:none;
  779. color:{color:link};
  780. display:inline;
  781. margin-right:1em;
  782. }
  783.  
  784. /*draggable tags : jqueryscript.net*/
  785.  
  786. {block:ifdraggabletags}
  787. .post_tags,
  788.  
  789. .post_tags a { color:{color:link} }
  790.  
  791. .post_tags {
  792. margin:0.5em 0 0 0;
  793. text-align:left;
  794. position:relative;
  795. white-space:nowrap;
  796. overflow:hidden;
  797. }
  798.  
  799. .post_tags.draggable .post_tags_inner {
  800. -webkit-touch-callout:none;
  801. -webkit-user-select:none;
  802. -khtml-user-select:none;
  803. -moz-user-select:none;
  804. -ms-user-select:none;
  805. user-select:none;
  806. }
  807.  
  808. .post_tags_inner {
  809. position:relative;
  810. padding:0px 20px 0px 0;
  811. }
  812.  
  813. .post_tags a,
  814. .post_tags .post_tag {
  815. color:{color:link};
  816. text-decoration:none;
  817. margin-right:1em;
  818. text-transform:lowercase !important;
  819. }
  820.  
  821. .post_tags a:before {content:'#';}
  822.  
  823. .post_tags:after {
  824. content:'';
  825. position:absolute;
  826. top:0;
  827. right:0;
  828. bottom:0;
  829. width:20px;
  830. background:-moz-linear-gradient(left, rgba(255,255,255,0) 0, rgba(255,255,255,1) 100%);
  831. background:-webkit-gradient(linear, left top, right top, color-stop(0%, rgba(255, 255, 255, 0)), color-stop(100%, #FFF));
  832. background:-webkit-linear-gradient(left, rgba(255, 255, 255, 0) 0, #FFF 100%);
  833. background:-o-linear-gradient(left, rgba(255,255,255,0) 0, rgba(255,255,255,1) 100%);
  834. background:-ms-linear-gradient(left, rgba(255,255,255,0) 0, rgba(255,255,255,1) 100%);
  835. background:linear-gradient(to right, rgba(255, 255, 255, 0) 0, #FFF 100%);
  836. }
  837.  
  838. .post_tags a:hover,
  839.  
  840. .post_tags .post_tag:hover,
  841.  
  842. .post_tags a:focus,
  843.  
  844. .post_tags .post_tag:focus,
  845.  
  846. .post_tags a:active,
  847.  
  848. .post_tags .post_tag:active { color:{color:link}; }
  849. {/block:ifdraggabletags}
  850.  
  851. .quote:before {
  852. content:'“';
  853. padding-right:0.5px;
  854. }
  855.  
  856. .quote:after {
  857. content:'”';
  858. padding-left:0.5px;
  859. }
  860.  
  861. .quote {
  862. font-size:12px;
  863. font-style:italic;
  864. }
  865.  
  866. .source:before {
  867. content:'—';
  868. margin-right:5px;
  869. color:#ccc;
  870. }
  871.  
  872. .source {
  873. padding-top:0.5em;
  874. }
  875.  
  876. .pagenotes {
  877. padding:1.5em;
  878. width:{select:post size}px;
  879. background-color:#fff;
  880. box-shadow:0 1px 3px #eee;
  881. border-bottom:1px solid #eee;
  882. border-radius:6px;
  883. }
  884.  
  885. .pagenotes-scroll::-webkit-scrollbar {
  886. width:10px;
  887. height:10px;
  888. margin-right:5px;
  889. }
  890.  
  891. .pagenotes-scroll::-webkit-scrollbar-track {
  892. border:5px solid #fff; /* background color */
  893. background-color:#eee; /* light border color */
  894. }
  895.  
  896. .pagenotes-scroll::-webkit-scrollbar-thumb {
  897. border:4px solid #fff; /* background color */
  898. background-color:{color:text}; /* dark border color */
  899. }
  900.  
  901. .pagenotes-scroll {
  902. width:{select:post size}px;
  903. padding-right:0;
  904. max-height:300px;
  905. overflow:auto;
  906. }
  907.  
  908. .pagenotes,
  909. .pagenotes-content,
  910. .pagenotes-scroll:active {
  911. border:0;
  912. outline:0;
  913. }
  914.  
  915. .pagenotes ol, .pagenotes ul {
  916. padding:0;
  917. margin:0;
  918. }
  919.  
  920. li.note {
  921. display:block;
  922. padding:0;
  923. }
  924.  
  925. li.note:not(:first-child):not(:last-child) {
  926. margin:8px 0;
  927. }
  928.  
  929. ol.notes li.note img.avatar {display:none;}
  930.  
  931. a.more_notes_link {
  932. display:block;
  933. text-align:center;
  934. }
  935.  
  936. .pagenotes blockquote {
  937. margin-left:2em;
  938. }
  939.  
  940. .c {
  941. opacity:0.8;
  942. font-weight:{select:bold weight};;
  943. display:block;
  944. font-size:13px;
  945. z-index:1;
  946. position:fixed;
  947. right:15px;
  948. bottom:20px;
  949. color:{color:text};
  950. }
  951.  
  952. {CustomCSS}
  953.  
  954. </style>
  955.  
  956. </head>
  957. <body>
  958. <script>document.body.className += ' fade-out';</script>
  959.  
  960. <div id="container">
  961.  
  962. <aside>
  963.  
  964. <div class="sb"><a href="/">{block:ifsidebarimage}<img src="{image:sidebar}">{/block:ifsidebarimage} {block:ifnotsidebarimage}<img src="{PortraitURL-64}">{/block:ifnotsidebarimage}</a></div>
  965.  
  966. {block:ifblogtitle}<div id="blogtitle"><a href="/">{Title}</a></div>{/block:ifblogtitle}
  967.  
  968. <div id="description">{Description}</div>
  969.  
  970. <nav>{block:ifhometitle}<a href="/">{text:home title}</a>{/block:ifhometitle}{block:ifasktitle}<a href="/ask">{text:ask title}</a>{/block:ifasktitle}{block:ifarchivetitle}<a href="/archive">{text:archive title}</a>{/block:ifarchivetitle}{block:iflink1url}<a href="{text:link 1 url}">{text:link 1 name}</a>{/block:iflink1url}{block:iflink2url}<a href="{text:link 2 url}">{text:link 2 name}</a>{/block:iflink2url}{block:iflink3url}<a href="{text:link 3 url}">{text:link 3 name}</a>{/block:iflink3url}{block:iflink4url}<a href="{text:link 4 url}">{text:link 4 name}</a>{/block:iflink4url}</nav>
  971.  
  972. {block:ifsearch}<form id="search" action="/search" method="get">
  973. <i data-feather="search"></i> <input type="text" name="q" value="{SearchQuery}" placeholder="search" autocomplete="off"/></form>{/block:ifsearch}
  974. </aside><!--sidebar-->
  975.  
  976. <div class="entries">
  977. {block:Posts}
  978. <div class="posts {block:caption}captioned{/block:caption}" id="{PostID}">
  979.  
  980. {block:Quote}
  981. <div class="quote">{quote}</div>
  982. {block:Source}
  983. <div class="source">{source}</div>
  984. {/block:Source}
  985. {/block:Quote}
  986.  
  987. {block:Text}
  988. {block:Title}<h1>{title}</h1>{/block:Title}
  989. {block:RebloggedFrom}
  990. {block:Reblogs}
  991. <li class="comment {block:Title}ted{/block:Title}">
  992. <a href="{Permalink}" class="icon"><img src="{PortraitURL-64}"></a> <a {block:haspermalink}href="{permalink}"{/block:haspermalink} class="user" target="_blank">{username}</a><div class="tex">{body}</div></li>
  993. {/block:Reblogs}
  994. {/block:RebloggedFrom}
  995. {block:NotReblog}
  996. <li class="comment {block:Title}ted{/block:Title}"><div class="tex">{body}</div></li>
  997. {/block:NotReblog}
  998. {/block:Text}
  999.  
  1000. {block:Link}<h1><a href="{URL}">{name}</a></h1>
  1001. {block:Description}
  1002. {block:NotReblog}
  1003. <li class="comment ted"><div class="tex">{description}</div></li>
  1004. {/block:NotReblog}
  1005. {/block:Description}
  1006. {block:RebloggedFrom}
  1007. {block:Reblogs}
  1008. <li class="comment"><a href="{Permalink}" class="icon"><img src="{PortraitURL-64}"></a> <a {block:haspermalink}href="{permalink}"{/block:haspermalink} class="user" target="_blank">{username}</a><div class="tex">{body}</div></li>
  1009. {/block:Reblogs}
  1010. {/block:RebloggedFrom}
  1011. {/block:Link}
  1012.  
  1013. {block:Chat}
  1014. {block:Title}<h1>{title}</h1>{/block:Title}
  1015. <ol class="chat {block:Title}ted{/block:Title}">
  1016. {block:lines}<li class="l {Alt}">{block:label}<span class="label">{label}</span>{/block:label}{line}</li>{/block:lines}
  1017. </ol>
  1018. {/block:Chat}
  1019.  
  1020. <div class="ph">
  1021.  
  1022. {block:Photo}{linkopentag}<img src="{photoURL-HighRes}" alt="{PhotoAlt}"/>{linkclosetag}{/block:Photo}
  1023.  
  1024. {block:Photoset}
  1025. <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>
  1026. {/block:Photoset}
  1027.  
  1028. <div class="video">{Video-500}</div>
  1029.  
  1030. {block:Audio}
  1031. {block:audioplayer}
  1032. <div class="hold">
  1033. <div class="player">{audioplayerwhite}</div>
  1034. <div class="audio_info">{block:trackname}<span class="track">{trackname}</span>{/block:trackname} {block:artist}<span class="artist">{artist}</span>{/block:artist}</div>
  1035. </div>
  1036. {/block:audioplayer}
  1037. {/block:Audio}
  1038.  
  1039. {block:caption}
  1040. {block:Reblogs}
  1041. <li class="comment"><a href="{Permalink}" class="icon"><img src="{PortraitURL-64}"></a> <a {block:haspermalink}href="{permalink}"{/block:haspermalink} class="user" target="_blank">{username}</a><div class="tex">{body}</div></li>
  1042. {/block:Reblogs}
  1043. {block:NotReblog}
  1044. <li class="comment"><div class="tex">{caption}</div></li>
  1045. {/block:NotReblog}
  1046. {/block:caption}
  1047.  
  1048. </div><!--ph-->
  1049.  
  1050. {block:Answer}
  1051. <div class="a">
  1052. <div class="q"><div class="as"><b>{asker}</b></div> {question}</div>
  1053. <img src="{AskerPortraitURL-40}" style="
  1054. float:right;
  1055. width:30px;
  1056. height:30px;
  1057. display:inline;
  1058. -moz-border-radius:100px;
  1059. -webkit-border-radius:100px;
  1060. border-radius:100%;
  1061. border:1px solid #eee;
  1062. padding:3px;
  1063. box-shadow:0 1px 3px #eee;"/>
  1064. </div>
  1065. {block:Answerer}
  1066. <div class="a">
  1067. <div class="q"><div class="as"><b>{answerer}</b></div> {answer}</div>
  1068. <img src="{AnswererPortraitURL-40}" style="
  1069. float:right;
  1070. width:30px;
  1071. height:30px;
  1072. display:inline;
  1073. -moz-border-radius:100px;
  1074. -webkit-border-radius:100px;
  1075. border-radius:100%;
  1076. border:1px solid #eee;
  1077. padding:3px;
  1078. box-shadow:0 1px 3px #eee;"/>
  1079. </div>
  1080. {/block:Answerer}
  1081. {block:NotReblog}
  1082. <li class="comment"><a {block:haspermalink}href="{permalink}"{/block:haspermalink} class="user" target="_blank">{username}</a> <div class="tex">{replies}</div></li>
  1083. {/block:NotReblog}
  1084. {block:RebloggedFrom}
  1085. {block:Reblogs}
  1086. <li class="comment"><a href="{Permalink}" class="icon"><img src="{PortraitURL-64}"></a> <a {block:haspermalink}href="{permalink}"{/block:haspermalink} class="user" target="_blank">{username}</a> <div class="tex">{body}</div></li>
  1087. {/block:Reblogs}
  1088. {/block:RebloggedFrom}
  1089. {/block:Answer}
  1090.  
  1091. {block:Date}
  1092. <div class="permalink">
  1093. <div class="permas">
  1094. <span class="permaleft">
  1095. {block:IndexPage}
  1096. <a href="{permalink}">{DayofWeek}</a>
  1097. {block:NoteCount}<a href="{permalink}" class="notecount">{NoteCount}</a>{/block:NoteCount}
  1098.  
  1099. <div class="controls">
  1100. <span><a href="{ReblogURL}" target="_blank" class="reblog" title="reblog post"><i data-feather="share-2"></i></a></span>
  1101. <span><a href="#" class="like" title="like post">{LikeButton}<i data-feather="heart"></i></a></span>
  1102. </div>
  1103.  
  1104. {/block:IndexPage}
  1105. {block:PermalinkPage}posted on <a href="{permalink">{Month} {DayOfMonth}{DayOfMonthSuffix} </a>{/block:PermalinkPage}
  1106. </span>
  1107. <span class="permaright">
  1108. {block:RebloggedFrom}<a href="{ReblogParentURL}">via</a>{block:ContentSource} / <a href="{ReblogRootURL}">source</a>{/block:ContentSource}{/block:RebloggedFrom}{/block:PermalinkPage}
  1109. </span>
  1110. </div>
  1111. </div>
  1112.  
  1113. {block:hasTags}
  1114. {block:ifdraggabletags}<div class="post_tags draggable"><div class="post_tags_inner"> {block:Tags}<a href="{TagURL}">{Tag}</a>{/block:Tags}</div></div>{/block:ifdraggabletags}
  1115.  
  1116. {block:ifnotdraggabletags}<div class="tags">{block:Tags}<a href="{TagUrl}">#{Tag}</a>{/block:Tags}</div>{/block:ifnotdraggabletags}
  1117. {/block:hasTags}
  1118. {/block:Date}
  1119. </div><!--posts-->
  1120.  
  1121. {block:PostNotes}
  1122. <div class="pagenotes" tabindex="0">
  1123. {block:NoteCount}<h1 style="margin-top:0">{NoteCountwithLabel}</h1>{/block:NoteCount}
  1124. <div class="pagenotes-scroll">
  1125. <div class="pagenotes-content">
  1126. {PostNotes}
  1127. </div>
  1128. </div>
  1129. </div>
  1130. {/block:PostNotes}
  1131.  
  1132. {/block:Posts}
  1133.  
  1134. {block:Pagination}
  1135. <div class="pagination">
  1136. {block:PreviousPage}<a href="{PreviousPage}">previous</a></span> / {/block:PreviousPage}
  1137. {block:NextPage}<a href="{NextPage}">next</a>{/block:NextPage}
  1138. </div>
  1139. {/block:Pagination}
  1140. </div><!--entries-->
  1141.  
  1142. </div><!--container-->
  1143.  
  1144.  
  1145. <script>
  1146. feather.replace()
  1147. var $container = $('.posts');
  1148. $container.find('.notecount').each(function(){
  1149. var n = $(this).html().split(' ')[0].replace(/,/g, '');
  1150. if (n > 999) {
  1151. n = Math.floor(n / 100) / 10;
  1152. $(this).text(n + 'k');
  1153. }
  1154. });
  1155. $(document).ready(function() {
  1156. $('body').tooltip({track:false});
  1157. $('iframe.tumblr_audio_player').load( function() {
  1158. $('iframe.tumblr_audio_player').contents().find("head")
  1159. .append($("<style type='text/css'> .audio-player{background:{color:accent} !important} </style>"));
  1160. });
  1161. });
  1162. $(function() {
  1163. $('body').removeClass('fade-out');
  1164. });
  1165. $(document).ready(function(){
  1166. $('.photo-slideshow').pxuPhotoset({
  1167. lightbox:true,
  1168. rounded:false,
  1169. gutter:'4px',
  1170. borderRadius:'2px',
  1171. photoset:'.photo-slideshow',
  1172. photoWrap:'.photo-data',
  1173. photo:'.pxu-photo'
  1174. });
  1175. });
  1176. </script>
  1177.  
  1178. {block:ContentSource}
  1179. <!-- {SourceURL}{block:SourceLogo}<img src="{BlackLogoURL}"
  1180. width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}"/>
  1181. {/block:SourceLogo}
  1182. {block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo}-->
  1183. {/block:ContentSource}
  1184.  
  1185. {block:ifdraggabletags}
  1186. <script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.4/jquery-ui.min.js"></script>
  1187.  
  1188. <script>
  1189. $(document).ready(function(){
  1190. $(".post_tags_inner").draggable({
  1191. axis :"x",
  1192. scroll:false,
  1193. stop:function() {
  1194. var __left = $(this).css("left").replace(/[^-\d\.]/g, '');
  1195. if(__left > 0){
  1196. $(this).animate({left:0}, 400, 'easeOutExpo');
  1197. }
  1198. var __width = $(this).outerWidth();
  1199. var __parentWidth = $(".post_tags.draggable").outerWidth();
  1200. if(__width > __parentWidth) {
  1201. if(__left < __parentWidth-__width){
  1202. $(this).animate({left:__parentWidth-__width}, 400, 'easeOutExpo');
  1203. }
  1204. } else {
  1205. $(this).animate({left:0}, 400, 'easeOutExpo');
  1206. }
  1207. }
  1208. });
  1209. });
  1210. </script>
  1211. {/block:ifdraggabletags}
  1212.  
  1213. <div class="hcontrols"><svg
  1214. xmlns="http://www.w3.org/2000/svg"
  1215. width="24"
  1216. height="24"
  1217. viewBox="0 0 24 24"
  1218. fill="none"
  1219. stroke="currentColor"
  1220. stroke-width="2"
  1221. stroke-linecap="round"
  1222. stroke-linejoin="round"
  1223. >
  1224. <line x1="3" y1="12" x2="21" y2="12" />
  1225. <line x1="3" y1="6" x2="21" y2="6" />
  1226. <line x1="3" y1="18" x2="21" y2="18" />
  1227. </svg></div>
  1228.  
  1229. <a class="c" href="https://captainmarvels.tumblr.com">✵</a>
  1230.  
  1231. </body>
  1232. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement