crpena

no. 14: lover

Mar 18th, 2019
891
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 26.34 KB | None | 0 0
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4.  
  5. <meta charset="utf-8">
  6. <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
  7.  
  8. <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
  9.  
  10. <title>{Title}</title>
  11. <link rel="shortcut icon" href="{Favicon}">
  12. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  13. {block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}
  14.  
  15. <meta name="image:sidebar" content="" />
  16.  
  17. <meta name="color:background" content="" />
  18. <meta name="color:borders" content="" />
  19. <meta name="color:link" content="" />
  20. <meta name="color:link border" content="" />
  21. <meta name="color:selection" content="" />
  22. <meta name="color:text" content="" />
  23. <meta name="color:title" content="" />
  24.  
  25. <meta name="select:Post Width" content="300" title="300px" />
  26. <meta name="select:Post Width" content="325" title="325px" />
  27. <meta name="select:Post Width" content="350" title="350px" />
  28. <meta name="select:Post Width" content="400" title="400px" />
  29. <meta name="select:Post Width" content="450" title="450px" />
  30. <meta name="select:Post Width" content="500" title="500px" />
  31. <meta name="select:Post Width" content="540" title="540px" />
  32.  
  33. <meta name="text:Link1" content="" />
  34. <meta name="text:Link1 URL" content="" />
  35. <meta name="text:Link2" content="" />
  36. <meta name="text:Link2 URL" content="" />
  37. <meta name="text:Link3" content="" />
  38. <meta name="text:Link3 URL" content="" />
  39. <meta name="text:Link4" content="" />
  40. <meta name="text:Link4 URL" content="" />
  41.  
  42. <link href="https://static.tumblr.com/0podkko/oDSpg7y88/photosets.css" rel="stylesheet"><link href="https://fonts.googleapis.com/css?family=Roboto" rel="stylesheet"><link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.7.1/css/all.css" integrity="sha384-fnmOCqbTlWIlj8LyTjo7mOUStjsKC4pOpQbqyi7RrhN7udi9RwhKkMHpvLbHG9Sr" crossorigin="anonymous">
  43.  
  44. </head>
  45. <style type="text/css">
  46.  
  47. /* tumblr controls */
  48.  
  49. iframe.tmblr-iframe {
  50. z-index:99999999999999!important;
  51. top:0!important;
  52. right:0!important;
  53. opacity:1;
  54. filter:invert(1);
  55. -webkit-filter:invert(1);
  56. -o-filter:invert(1);
  57. -moz-filter:invert(1);
  58. -ms-filter:invert(1);
  59. transform:scale(0.6);
  60. transform-origin:100% 0;
  61. -webkit-transform:scale(0.6);
  62. -webkit-transform-origin:100% 0;
  63. -o-transform:scale(0.6);
  64. -o-transform-origin:100% 0;
  65. -moz-transform:scale(0.6);
  66. -moz-transform-origin:100% 0;
  67. -ms-transform:scale(0.6);
  68. -ms-transform-origin:100% 0;
  69. transition: opacity 0.6s ease-in-out;
  70. -moz-transition: opacity 0.6s ease-in-out;
  71. -webkit-transition: opacity 0.6s ease-in-out;
  72. }
  73.  
  74. body {
  75. color:{color:text};
  76. background:{color:background};
  77. font:10.5px 'Roboto', sans-serif;
  78. font-style:normal;
  79. font-variant:normal;
  80. font-weight:400;
  81. line-height:20px;
  82. word-wrap:break-word;
  83. overflow-x:hidden;
  84. margin:0;
  85. cursor:default;
  86. -moz-osx-font-smoothing:grayscale;
  87. -webkit-font-smoothing:antialiased;
  88. font-smoothing:antialiased;
  89. }
  90.  
  91. img {
  92. display:block;
  93. max-width:100%;
  94. height:auto;
  95. }
  96.  
  97. div#qTip {
  98. z-index: 1000;
  99. display: none;
  100. background:rgba({RGBcolor:title},.7);
  101. color: {color:text};
  102. position: absolute;
  103. padding:3px;
  104. margin:10px 0 0;
  105. -webkit-border-radius: 3px;
  106. -moz-border-radius: 3px;
  107. border-radius: 3px;
  108. vertical-align: center;
  109. align-items: center;
  110. flex-wrap: wrap;
  111. grid-area: two;
  112. line-height: 150%;
  113. text-align: justify;
  114. -moz-transition: 0.2s ease-in;
  115. -webkit-transition: 0.2s ease-in;
  116. -o-transition: 0.2s ease-in;
  117. transition: 0.2s ease-in;
  118. }
  119.  
  120. ::selection {
  121. color:{color:text};
  122. background:rgba({RGBcolor:selection},.6);
  123. }
  124.  
  125. ::-moz-selection {
  126. color:{color:text};
  127. background:rgba({RGBcolor:selection},.6);
  128. }
  129.  
  130. ::-webkit-scrollbar {
  131. width: 18px;
  132. height:6px;
  133. }
  134.  
  135. ::-webkit-scrollbar-button {
  136. width: 0px;
  137. height: 0px;
  138. }
  139.  
  140. ::-webkit-scrollbar-thumb {
  141. background:{color:title};
  142. border:6px solid #fff;
  143. border-top:4px solid #fff;
  144. border-bottom:4px solid #fff;
  145. cursor:pointer;
  146. border-radius: 8px;
  147. }
  148.  
  149. ::-webkit-scrollbar-track {
  150. background:{color:borders};
  151. border: 8px solid #fff;
  152. border-top:12px solid #fff;
  153. border-bottom:12px solid #fff;
  154. }
  155.  
  156. a:link, a:visited, a:active {
  157. text-decoration:none;
  158. color:{color:link};
  159. padding-bottom:1px;
  160. opacity:.7;
  161. border-bottom:2px solid {color:link border};
  162. -moz-transition:0.19s ease-in;
  163. -webkit-transition:0.19s ease-in;
  164. -o-transition:0.19s ease-in;
  165. transition:0.19s ease-in;
  166. }
  167.  
  168. a:hover {
  169. opacity:1;
  170. -moz-transition:0.3s ease-in;
  171. -webkit-transition:0.3s ease-in;
  172. -o-transition:0.3s ease-in;
  173. transition:0.3s ease-in;
  174. }
  175.  
  176. blockquote {
  177. margin:0;
  178. padding:0;
  179. border:0;
  180. }
  181.  
  182. pre {
  183. padding:0;
  184. margin:0;
  185. line-height:1.5em;
  186. background:transparent;
  187. font-family:inherit!Important;
  188. font-size:1em!important;
  189. white-space:pre-wrap;
  190. white-space:-moz-pre-wrap;
  191. white-space:-pre-wrap;
  192. white-space:-o-pre-wrap;
  193. word-wrap:break-word;
  194. }
  195.  
  196. p {margin:1em 0;}
  197. p:first-of-type {margin-top:0;}
  198. p:last-of-type {margin-bottom:0;}
  199.  
  200. b, strong, b a, strong a {color:{color:title};}
  201. em, i, em a, i a {font-style:italic;}
  202.  
  203. ol, ul {
  204. list-style:none;
  205. text-align:left;
  206. padding-left:0;
  207. }
  208.  
  209. li {
  210. position:relative;
  211. padding:.1em 0 .1em 35px;
  212. }
  213.  
  214. ol li {counter-increment:list;}
  215.  
  216. ol li:before, ul li:before {
  217. left:15px;
  218. position:absolute;
  219. vertical-align:baseline!important;
  220. }
  221.  
  222. ol li:before {content:counter(list) '.';}
  223. ul li:before {content:'›';}
  224.  
  225. small, big, sub, pre {
  226. font-size:1em!important;
  227. line-height:1.5em!important;
  228. vertical-align:baseline!important;
  229. }
  230.  
  231. .sidebar {
  232. max-width:170px;
  233. position:fixed;
  234. top:50%;
  235. right:150px;
  236. z-index:1;
  237. transform: translate(0, -50%);
  238. background:{color:background};
  239. }
  240.  
  241. @media (max-width:900px){
  242. .sidebar {
  243. position:relative;
  244. margin:5em auto;
  245. top:0px;
  246. left:0px;
  247. transform: translate(0, 0);
  248. }
  249. .entry {
  250. float:none!important;
  251. margin:0px auto!important;
  252. }
  253. }
  254.  
  255. #navigation a {
  256. display:block;
  257. padding:.5em;
  258. font-size:9px;
  259. background:none;
  260. text-transform:uppercase;
  261. border-bottom:1px solid {color:borders};
  262. }
  263.  
  264. .sidebar input[type=checkbox] {
  265. position:absolute;
  266. opacity:0;
  267. float:left;
  268. outline:none;
  269. z-index:10;
  270. width:170px;
  271. height:30px;
  272. cursor:pointer;
  273. }
  274.  
  275. #nv {
  276. display:block;
  277. pointer-events:none;
  278. position:relative;
  279. padding:.5em;
  280. font-size:9px;
  281. background:none;
  282. z-index:10;
  283. color:{color:link};
  284. transition:0.5s;
  285. text-transform:uppercase;
  286. border-bottom:1px solid {color:borders};
  287. }
  288.  
  289. .sidebar input[type=checkbox]:checked ~ #nv {
  290. background:rgba({RGBcolor:text},.1);
  291. }
  292.  
  293. .sidebar input[type=checkbox]:checked ~ #sublinks {
  294. max-height:100%;
  295. transition:0.8s;
  296. }
  297.  
  298. #sublinks {
  299. display:block;
  300. max-height:0;
  301. transition:0.5s;
  302. overflow:hidden;
  303. margin-top:.5em;
  304. z-index:1000;
  305. margin:.25em auto;
  306. transition:max-height 0.8s ease;
  307. }
  308.  
  309. #sublinks a {
  310. display:inline-block;
  311. width:48%;
  312. margin-bottom:.5em;
  313. padding:4px;
  314. left:0;
  315. right:0;
  316. color:{color:text};
  317. text-align:center;
  318. vertical-align:center;
  319. border:0;
  320. background-image: linear-gradient({color:link border},{color:link border})!important;
  321. background-repeat: no-repeat!important;
  322. background-size: 100% 0.2em!important;
  323. background-position: 0 100%!important;
  324. }
  325.  
  326. #sublinks a:hover {
  327. color:{color:text};
  328. background-size: 100% 100%!important;
  329. }
  330.  
  331. #stext {
  332. display:block;
  333. text-align:justify;
  334. margin-top:1em;
  335. }
  336.  
  337. .entry {
  338. float:right;
  339. display:block;
  340. position:relative;
  341. max-width:{select:post width}px;
  342. margin-top:50px;
  343. margin-bottom:50px;
  344. margin-right:calc(170px + 200px + 50px);
  345. }
  346.  
  347. .posts {
  348. display:block;
  349. position:relative;
  350. max-width:{select:post width}px;
  351. {block:IndexPage}margin-bottom:50px;{/block:IndexPage}
  352. }
  353.  
  354. .posts a, ol.notes a {
  355. opacity:1;
  356. padding:0;
  357. border:0;}
  358. .posts h1:first-child, .posts h2:first-child, .posts h3:first-child, .posts h4:first-child {margin-top:0;}
  359.  
  360. [photoset-layout] div {
  361. cursor: pointer;
  362. margin-right:.3em;
  363. margin-bottom:.3em;
  364. }
  365.  
  366. .vignette, #vignette {opacity:0;}
  367. .lightbox-image, #tumblr_lightbox img {
  368. box-shadow:none !important;
  369. border-radius:0 !important;
  370. }
  371.  
  372. .tmblr-lightbox, #tumblr_lightbox {
  373. background-color:{color:background}!important;
  374. z-index:99999!important;
  375. }
  376.  
  377. .lightbox-caption, #tumblr_lightbox_caption {
  378. visibility:hidden;
  379. }
  380.  
  381. /* quote */
  382.  
  383. .quote {
  384. display:block;
  385. background-color:{color:title};
  386. max-width:{select:post width}px;
  387. padding:1em;
  388. font-style:italic;
  389. font-size:22px;
  390. text-align:justify;
  391. -moz-text-align-last: center; /* For Firefox prior 58.0 */
  392. text-align-last: center;
  393. line-height:1.3em;
  394. }
  395.  
  396. #s {
  397. display:block;
  398. text-align:right;
  399. margin:1em;
  400. max-width:{select:post width}px;
  401. text-decoration:underline;
  402. }
  403.  
  404. /** posts **/
  405.  
  406. .titles {
  407. margin:1em 0;
  408. color:{color:title};
  409. display:block;
  410. font-size:18px;
  411. font-weight:lighter;
  412. letter-spacing:1px;
  413. }
  414.  
  415. a.titles {
  416. display:block;
  417. color:{color:title};
  418. font-weight:lighter;
  419. text-decoration:underline;
  420. -moz-transition:.39s ease-in;
  421. -webkit-transition:.39s ease-in;
  422. -o-transition:.39s ease-in;
  423. transition:.39s ease-in;
  424. }
  425.  
  426. a.titles svg {
  427. display:inline-block;
  428. width:15px;
  429. height:auto;
  430. overflow:visible;
  431. fill:{color:title};
  432. opacity:0;
  433. margin-right:-15px;
  434. stroke:{color:title};
  435. stroke-width:2;
  436. transition:0.5s;
  437. }
  438.  
  439. a:hover.titles svg {
  440. opacity:1;
  441. margin-right:.5em;
  442. transition:0.5s;
  443. }
  444.  
  445. a:hover.titles {
  446. -moz-transition:.39s ease-in;
  447. -webkit-transition:.39s ease-in;
  448. -o-transition:.39s ease-in;
  449. transition:.39s ease-in;
  450. }
  451.  
  452. /* chat */
  453.  
  454. .chat li {padding-left:0;}
  455. .chat li:before {display:none;}
  456.  
  457. .label {
  458. display:block;
  459. font-weight:bold;
  460. color:{color:title};
  461. }
  462.  
  463. .l {
  464. font-style:italic;
  465. display:block;
  466. }
  467.  
  468. .l em, .l i{
  469. text-decoration:underline!important;
  470. }
  471.  
  472. /* audio */
  473.  
  474. .soundcloud_audio_player {
  475. max-height:116px!important;
  476. }
  477.  
  478. .spotify_audio_player {
  479. max-height:80px!important;
  480. }
  481.  
  482. .audiopost {
  483. display:block;
  484. position:relative;
  485. padding:1em;
  486. max-width:{select:post width}px;
  487. background-color:{color:title};
  488. min-height:calc(46px + 1em);
  489. }
  490.  
  491. .player {
  492. float:left;
  493. max-width:30px!important;
  494. overflow:hidden;
  495. margin:1.5em 2em 0 1em;
  496. }
  497.  
  498. .player .tumblr_audio_player {
  499. opacity:0!important;
  500. position:relative;
  501. }
  502.  
  503. .player svg {
  504. display:block;
  505. overflow:visible;
  506. width:15px;
  507. height:15px;
  508. fill:white
  509. stroke:white;
  510. stroke-width:2;
  511. margin-left:.75em;
  512. margin-top:-25px;
  513. margin-bottom:.5em;
  514. }
  515.  
  516. .albumart {
  517. float:right;
  518. max-width:46px;
  519. margin:.7em 1em 0;
  520. }
  521.  
  522. .infobox {
  523. display:block;
  524. position:relative;
  525. text-align:center;
  526. overflow:hidden;
  527. align-items:center;
  528. vertical-align:center;
  529. min-height:calc(46px + 1em);
  530. }
  531.  
  532. .infobox .title {
  533. display:block;
  534. font-size:15px;
  535. font-weight:700;
  536. margin:0;
  537. letter-spacing:.5px;
  538. }
  539.  
  540. .infobox .artist, .infobox .album {
  541. display:block;
  542. font-size:9.5px;
  543. margin:0;
  544. }
  545.  
  546. @media (max-width:400px){.albumart, .asker-avatar, .answerer-avatar{display:none;} .infobox{max-height:100%;margin:.5em auto 0;} .player{float:none;margin:auto;} .answerer-avatar{margin-left:0!important;max-width:{select:post width}px!important;}}
  547.  
  548. /* question */
  549.  
  550. .question {
  551. display:block;
  552. padding:.5em;
  553. margin:0;
  554. background:rgba({RGBcolor:text},.1);
  555. max-width:calc({select:post width}px - 30px - 1em);
  556. }
  557.  
  558. .answer {
  559. display:block;
  560. margin-top:1em;
  561. margin-left:calc(26px + 1em);
  562. max-width:calc({select:post width}px - 26px - 1em);
  563. }
  564.  
  565. #askbox {max-width:{select:post width}px;}
  566. .asker-avatar {position:absolute;float:right;right:0;}
  567. .answerer-avatar {position:absolute;float:left;left:0;margin-top:.5em;}
  568. .asker, .answerer {font-weight:700;}
  569. .asker-question, .answerer-answer {display:block;}
  570.  
  571. /* video */
  572.  
  573. .video {
  574. display:block;
  575. position:relative;
  576. }
  577.  
  578. .video iframe {
  579. display:block;
  580. max-width:calc({select:post width}px - 8px);
  581. }
  582.  
  583. .tumblr_video_container {
  584. display:block;
  585. max-width:calc({select:post width}px - 8px);
  586. }
  587.  
  588. #youtube_iframe {
  589. display:block;
  590. max-height:calc({select:post width}px * 0.67);
  591. max-width:calc({select:post width}px - 8px);
  592. }
  593.  
  594. .instagram-media {max-height:none!important;}
  595.  
  596. /** caption **/
  597.  
  598. .caption {
  599. display:block;
  600. margin:.5em 0;
  601. }
  602.  
  603. .caption a {
  604. color:rgba({RGBcolor:text},.5);
  605. text-decoration:underline;
  606. }
  607.  
  608. .caption a:hover {color:rgba({RGBcolor:text},.7);}
  609. .tumblr_parent {
  610. margin:0;
  611. padding:0;
  612. border:0;
  613. color:rgba({RGBcolor:text},.7);
  614. margin-bottom:.5em;
  615. }
  616.  
  617. .tumblr_parent:last-child, .tumblr_parent:last-of-type {margin-bottom:0px;}
  618. .tumblr_avatar {display:none;}
  619. a.tumblr_blog {
  620. display:inline-block;
  621. color:{color:link};
  622. float:left;
  623. border:0;
  624. padding:0;
  625. margin-right:.5em;
  626. text-decoration:none;
  627. vertical-align:center!important;
  628. }
  629.  
  630. .tumblr_parent blockquote {
  631. margin:0;
  632. padding:0;
  633. border:0;
  634. }
  635.  
  636. /* notes and date */
  637.  
  638. #permalink {
  639. display:block;
  640. margin-top:10px;
  641. color:{color:text};
  642. {block:PermalinkPage}word-spacing:2px;{/block:PermalinkPage}
  643. }
  644.  
  645. #permalink a, #permalink b {
  646. color:{color:text};
  647. {block:IndexPage}margin:0 .5em;{/block:IndexPage}
  648. vertical-align:center;
  649. }
  650.  
  651. #permalink b {
  652. {block:IndexPage}margin-left:-.5em;{/block:IndexPage}
  653. }
  654.  
  655. .like-b {
  656. position:relative;
  657. display:inline-block;
  658. height:1em;
  659. line-height:1em;
  660. overflow:hidden;
  661. vertical-align:top;
  662. margin-top:5px!important;
  663. }
  664. .like-b .like_button iframe {
  665. position:absolute;
  666. top:0;
  667. left:0;
  668. bottom:0;
  669. right:0;
  670. z-index:2;
  671. opacity:0;
  672. }
  673. .like-b .liked + .b {color:inherit;}
  674. .like-b .liked + .b:after {content:'d';}
  675.  
  676. #tags {
  677. margin-top:.5em;
  678. display:block;
  679. max-width:{select:post width}px;
  680. overflow-wrap: break-word;
  681. word-wrap: break-word;
  682. -ms-word-break: break-all;
  683. /* Instead use this non-standard one: */
  684. word-break: break-word;
  685. font-style:italic;
  686. }
  687.  
  688. #tags a {
  689. margin-right:.75em;
  690. }
  691.  
  692. #pagination {
  693. display:block;
  694. margin:25px 0;
  695. text-align:right;
  696. max-width:{select:post width}px;
  697. word-spacing:2px;
  698. }
  699.  
  700. #pagination a {
  701. border:0;
  702. padding:0;
  703. opacity:1;
  704. font-weight:700;
  705. color:{color:Text};
  706. }
  707.  
  708. #pagination a:hover svg {
  709. fill:{color:title};
  710. }
  711.  
  712. #pagination .nxt svg {
  713. width:8px;
  714. height:auto;
  715. margin-left:.25em;
  716. fill:{color:text};
  717. transform: rotate(270deg);
  718. }
  719.  
  720. #pagination .bck svg {
  721. width:8px;
  722. height:auto;
  723. margin-right:.25em;
  724. fill:{color:text};
  725. transform: rotate(90deg);
  726. vertical-align:center;
  727. }
  728. /* posts notes */
  729.  
  730. ol.notes {
  731. display:block;
  732. width:{select:post width}px;
  733. list-style-type:none;
  734. margin:20px 0;
  735. }
  736.  
  737. ol.notes li.note {
  738. display:block;
  739. position:relative;
  740. line-height:16px;
  741. padding:.5em .5em .5em 30px;
  742. border-radius:6px;
  743. margin-bottom:.5em;
  744. background:rgba({RGBcolor:borders},.5);
  745. }
  746.  
  747. ol.notes li.note a {
  748. border:0;
  749. padding:0;
  750. }
  751.  
  752. ol.notes li:before {
  753. left:5px;
  754. position:absolute;
  755. vertical-align:baseline!important;
  756. content:'';
  757. font-family: "Font Awesome 5 Free";
  758. font-style:normal;
  759. font-weight: 900;
  760. speak:none;
  761. vertical-align:top;
  762. font-size:10px;
  763. }
  764.  
  765. ol.notes li.note.reblog:before {content: '\f2f9';}
  766. ol.notes li.note.like:before {content: '\f004';}
  767. ol.notes li.note img.avatar {display:none;}
  768. ol.notes li.note span.action {font-weight:normal!important;}
  769.  
  770. #cr {
  771. bottom:15px;
  772. right:15px;
  773. font:9px arial;
  774. font-weight:normal;
  775. font-style:normal;
  776. position:fixed;
  777. padding:2px;
  778. background:{color:background};
  779. }
  780.  
  781. #cr a {
  782. border:none;
  783. padding:0px;
  784. margin:0px;
  785. text-decoration:none;
  786. color:{color:text};
  787. }
  788.  
  789. {CustomCSS}
  790.  
  791. </style>
  792.  
  793.  
  794. <body>
  795.  
  796. <div class="container">
  797.  
  798. <div class="sidebar">
  799. <img src="{image:sidebar}" />
  800. <did id="navigation">
  801. <a href="/">home</a>
  802. {block:AskEnabled}<a href="/ask">askbox</a>{/block:AskEnabled}
  803. <a href="/archive">archive</a>
  804. </did>
  805. <input type="checkbox"><div id="nv">navigation</div>
  806. <div id="sublinks">
  807. {block:ifLink1}<a href="{text:Link1 URL}">{text:Link1}</a>{/block:ifLink1}
  808. {block:ifLink2}<a href="{text:Link2 URL}">{text:Link2}</a>{/block:ifLink2}
  809. {block:ifLink3}<a href="{text:Link3 URL}">{text:Link3}</a>{/block:ifLink3}
  810. {block:ifLink4}<a href="{text:Link4 URL}">{text:Link4}</a>{/block:ifLink4}
  811. </span>
  812. </div>
  813.  
  814. <div id="stext">{description}</div>
  815. </div>
  816.  
  817. <section class="entry">
  818.  
  819. {block:Posts}
  820. <div class="posts" id="{PostID}">
  821.  
  822. {block:Quote}<div class="quote">{Quote}</div>{block:Source}<div id="s">{Source}</div>{/block:Source}{/block:Quote}
  823.  
  824. {block:Text}{block:Title}<h2 class="titles">{Title}</h2>{/block:Title}<div class="caption">{Body}</div>{/block:Text}
  825.  
  826. {block:Link}<a href="{URL}" class="titles"><svg version="1.1" id="Capa_1" xmlns="https://www.w3.org/2000/svg" xmlns:xlink="https://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 52.974 52.974" style="enable-background:new 0 0 52.974 52.974;" xml:space="preserve"><path d="M49.467,3.51c-4.677-4.679-12.291-4.681-16.97,0l-9.192,9.192c-0.391,0.391-0.391,1.023,0,1.414s1.023,0.391,1.414,0l9.192-9.192c1.88-1.88,4.391-2.915,7.07-2.915c2.681,0,5.191,1.036,7.071,2.916s2.916,4.391,2.916,7.071c0,2.68-1.036,5.19-2.916,7.07L36.033,31.088c-3.898,3.898-10.244,3.898-14.143,0c-0.391-0.391-1.023-0.391-1.414,0s-0.391,1.023,0,1.414c2.34,2.339,5.412,3.509,8.485,3.509s6.146-1.17,8.485-3.509L49.467,20.48c2.258-2.258,3.502-5.271,3.502-8.485C52.969,8.781,51.725,5.768,49.467,3.51z"/><path d="M26.84,40.279l-7.778,7.778c-1.88,1.88-4.391,2.916-7.071,2.916c-2.68,0-5.19-1.036-7.071-2.916c-3.898-3.898-3.898-10.243,0-14.142l11.314-11.314c3.899-3.898,10.244-3.896,14.142,0c0.391,0.391,1.023,0.391,1.414,0s0.391-1.023,0-1.414c-4.677-4.679-12.291-4.681-16.97,0L3.505,32.502c-2.258,2.258-3.501,5.271-3.501,8.485c0,3.214,1.244,6.227,3.502,8.484s5.271,3.502,8.484,3.502c3.215,0,6.228-1.244,8.485-3.502l7.778-7.778c0.391-0.391,0.391-1.023,0-1.414S27.231,39.889,26.84,40.279z"/></svg>{Name}</a>{block:Description}<div class="caption">{Description}</div>{/block:Description}{/block:Link}
  827.  
  828. {block:Chat}<div class="chat">{block:Title}<h2 class="t_itles">{Title}</h2>{/block:Title}<ul>{block:Lines}<li class="l {Alt}">{block:Label}<span class="label">{Label}</span>{/block:Label}{Line}</li>{/block:Lines}</ul></div>{/block:Chat}
  829.  
  830. {block:Video}<div class="video">{Video-500}</div>{/block:Video}
  831.  
  832. {block:Audio}<div class="audiopost"><div class="player">{AudioPlayerWhite}<svg version="1.1" id="Capa_1" xmlns="https://www.w3.org/2000/svg" xmlns:xlink="https://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 41.999 41.999" style="enable-background:new 0 0 41.999 41.999;" xml:space="preserve"><path d="M36.068,20.176l-29-20C6.761-0.035,6.363-0.057,6.035,0.114C5.706,0.287,5.5,0.627,5.5,0.999v40c0,0.372,0.206,0.713,0.535,0.886c0.146,0.076,0.306,0.114,0.465,0.114c0.199,0,0.397-0.06,0.568-0.177l29-20c0.271-0.187,0.432-0.494,0.432-0.823S36.338,20.363,36.068,20.176z M7.5,39.095V2.904l26.239,18.096L7.5,39.095z"/></svg></div>{block:AlbumArt}<img class="albumart" src="{AlbumArtURL}" alt="">{/block:AlbumArt}<div class="infobox">{block:TrackName}<p class="title">{TrackName}</p>{/block:TrackName}{block:Artist}<p class="artist">{Artist}</p>{/block:Artist}{block:Album}<p class="album">{Album}</p>{/block:Album}</div></div>{/block:Audio}
  833.  
  834. {block:Photo}<div id="media"><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}" width="{text:post width}" class="img-fluid" /></a></div>{/block:Photo}
  835.  
  836. {block:Photoset}<div class="photoset-grid" photoset-layout="{PhotosetLayout}">{block:Photos}<div data-width="{PhotoWidth-HighRes}" data-height="{PhotoHeight-HighRes}" data-lowres="{PhotoURL-500}" data-highres="{PhotoURL-HighRes}" onclick="lightbox(this)"><img src="{PhotoURL-HighRes}" class="img-fluid" /></div>{/block:Photos}</div>{/block:Photoset}
  837.  
  838. {block:Answer}<div id="askbox"><div class="question"><img class="asker-avatar" src="{AskerPortraitURL-30}" alt="" /><div class="asker">{Asker}</div><div class="asker-question">{Question}</div></div>{block:Answerer}<div class="answer"><img class="answerer-avatar" src="{AnswererPortraitURL-24}" alt="" /><div class="answerer">{Answerer}</div><div class="answerer-answer">{Answer}</div></div>{/block:Answerer}<div class="caption">{Replies}</div></div>{/block:Answer}
  839.  
  840. {block:Caption}<div class="caption">{caption}</div>{/block:Caption}
  841.  
  842. {block:date}<div id="permalink">{block:IndexPage}<a href="{permalink}">{block:NoteCount}<b>{NoteCount}</b>{/block:NoteCount} {timeago}</a> &#183; <a href="{ReblogURL}" target="_blank">reblog</a> &#183; <a class="like-b" href="#">{LikeButton}<span class="b">like</span></a>{/block:IndexPage}{block:PermalinkPage}<p><b>{month} {DayOfMonthWithZero}{DayOfMonthSuffix}, {year} @ {24HourWithZero}:{Minutes}</b></p>{block:RebloggedFrom}<p>reblogged from: <a href="{ReblogParentURL}"><b>{ReblogParentName}</b></a> <i>and</i> posted by: <a href="{ReblogRootURL}"><b>{ReblogRootName}</b></a></p>{/block:RebloggedFrom}{block:NotReblog}<p>post made by <b>{name}</b></p>{/block:NotReblog}{/block:PermalinkPage}</div>{/block:date}
  843.  
  844. {block:HasTags}<div id="tags">{block:Tags}<a href="{TagURL}">#{Tag}</a>{/block:Tags}</div>{/block:HasTags}
  845.  
  846. </div>
  847. {/block:Posts}
  848.  
  849. {block:Pagination}<div id="pagination">
  850. {block:PreviousPage}<a href="{PreviousPage}" class="bck"><svg version="1.1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 129 129" xmlns:xlink="http://www.w3.org/1999/xlink" enable-background="new 0 0 129 129"><path d="m121.3,34.6c-1.6-1.6-4.2-1.6-5.8,0l-51,51.1-51.1-51.1c-1.6-1.6-4.2-1.6-5.8,0-1.6,1.6-1.6,4.2 0,5.8l53.9,53.9c0.8,0.8 1.8,1.2 2.9,1.2 1,0 2.1-0.4 2.9-1.2l53.9-53.9c1.7-1.6 1.7-4.2 0.1-5.8z"/></svg>Back</a> / {/block:PreviousPage}
  851. {block:NextPage}<a href="{NextPage}" class="nxt">Forth<svg version="1.1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 129 129" xmlns:xlink="http://www.w3.org/1999/xlink" enable-background="new 0 0 129 129"><path d="m121.3,34.6c-1.6-1.6-4.2-1.6-5.8,0l-51,51.1-51.1-51.1c-1.6-1.6-4.2-1.6-5.8,0-1.6,1.6-1.6,4.2 0,5.8l53.9,53.9c0.8,0.8 1.8,1.2 2.9,1.2 1,0 2.1-0.4 2.9-1.2l53.9-53.9c1.7-1.6 1.7-4.2 0.1-5.8z"/></svg></a>{/block:NextPage}
  852. </div>{/block:Pagination}
  853.  
  854. {block:PostNotes}{PostNotes}{/block:PostNotes}{block:ContentSource}<!--{SourceURL}{block:SourceLogo}<img src="{BlackLogoURL}" width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" />{/block:SourceLogo}{block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo}-->{/block:ContentSource}<!--{block:NoRebloggedFrom}{block:RebloggedFrom}{ReblogParentName}{/block:RebloggedFrom}{/block:NoRebloggedFrom}-->
  855.  
  856. </section>
  857.  
  858. </div>
  859.  
  860. <div id="cr"><a href="https://aurthms.tumblr.com" target="_blank">cr</a></div>
  861.  
  862. <script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
  863. <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js" integrity="sha384-UO2eT0CpHqdSJQ6hJty5KVphtPhzWj9WO1clHTMGa3JDZwrnQq4sF86dIHNDz0W1" crossorigin="anonymous"></script>
  864. <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js" integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM" crossorigin="anonymous"></script>
  865.  
  866. <script src="//code.jquery.com/jquery-2.2.4.min.js"></script><script type="text/javascript" src="https://static.tumblr.com/tiu5k68/xTkm8wqw2/tumblr-title-qtip.js"></script><script src="https://static.tumblr.com/wgg6svp/OoTofxa0c/unnest.min.js"></script>
  867.  
  868. <script src="https://rawgit.com/robinpx/tumblr/master/scripts/flexibleFrames/flexibleFrames.min.js"></script>
  869.  
  870. <script type="text/javascript">
  871. $(document).ready(function() {
  872. flexibleFrames($(".video")); // $(".video") is the class selector passed in the argument
  873. });
  874.  
  875. function flexFrame() {
  876. $(".caption").each(function() {
  877. $(this).find("iframe").wrap("<div class='iframe-flex'></div>"); // wrap iframe
  878. flexibleFrames($(".iframe-flex"));
  879. });
  880. flexibleFrames($(".video"));
  881. }
  882.  
  883. $(document).ready(flexFrame);
  884.  
  885. $(document).ready(function(){
  886. $('.posts').unnest({
  887. yourCaption: ".caption",
  888. wrapName: ".tumblr_parent",
  889. newCaptionUsername: true,
  890. originalPostCaptionUsername: false,
  891. tumblrAvatars: true,
  892. tumblrAvatarClass: ".tumblr_avatar",
  893. usernameColon: false
  894. });
  895. });
  896.  
  897. function gatherData(images, arr) {
  898. for (let i = 0; i < images.length; i++) {
  899. let currentData = {
  900. "width": images[i].getAttribute('data-width'),
  901. "height": images[i].getAttribute('data-height'),
  902. "low_res": images[i].getAttribute('data-lowres'),
  903. "high_res": images[i].getAttribute('data-highres')
  904. };
  905. arr.push(currentData);
  906. }
  907. }
  908. function getIndex(elem) {
  909. let i = 0;
  910. while( (elem = elem.previousElementSibling) != null ) i++;
  911. return i;
  912. }
  913. function lightbox(elem) {
  914. let currentPhotoset = elem.parentNode;
  915. let photosetPhotos = currentPhotoset.getElementsByTagName('div');
  916. let data = [];
  917. gatherData(photosetPhotos, data);
  918. Tumblr.Lightbox.init(data, getIndex(elem) + 1);
  919. }
  920. </script>
  921.  
  922. </body>
  923. </html>
Advertisement
Add Comment
Please, Sign In to add comment