Advertisement
Guest User

Untitled

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