crpena

no. 15: optimista

Apr 12th, 2019
1,574
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 37.51 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. <title>{Title}</title>
  9. <link rel="shortcut icon" href="{Favicon}">
  10. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  11. {block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}
  12.  
  13. <link href="https://static.tumblr.com/0podkko/oDSpg7y88/photosets.css" rel="stylesheet">
  14. <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">
  15. <link href="https://unpkg.com/[email protected]/dist/aos.css" rel="stylesheet">
  16.  
  17. <meta name="color:background" content="" />
  18. <meta name="color:text" content="" />
  19.  
  20. <meta name="color:accent" content="" />
  21. <meta name="color:borders" content="" />
  22. <meta name="color:link" content="" />
  23. <meta name="color:scrollbar" content="" />
  24. <meta name="color:selection" content="" />
  25. <meta name="color:tooltip" content="" />
  26.  
  27. <meta name="select:Post Width" content="300" title="300px" />
  28. <meta name="select:Post Width" content="325" title="325px" />
  29. <meta name="select:Post Width" content="350" title="350px" />
  30. <meta name="select:Post Width" content="400" title="400px" />
  31. <meta name="select:Post Width" content="450" title="450px" />
  32. <meta name="select:Post Width" content="500" title="500px" />
  33. <meta name="select:Post Width" content="540" title="540px" />
  34.  
  35. <meta name="if:Drop Down Menu" content="" />
  36.  
  37. <meta name="text:Font Size" content="10.5px" />
  38. <meta name="text:Title Font Size" content="27px" />
  39.  
  40. <meta name="text:Link1" content="" />
  41. <meta name="text:Link1 URL" content="" />
  42. <meta name="text:Link2" content="" />
  43. <meta name="text:Link2 URL" content="" />
  44. <meta name="text:Link3" content="" />
  45. <meta name="text:Link3 URL" content="" />
  46. <meta name="text:Link4" content="" />
  47. <meta name="text:Link4 URL" content="" />
  48.  
  49. <meta name="text:DropDownLink1" content="" />
  50. <meta name="text:DropDownLink1 URL" content="" />
  51. <meta name="text:DropDownLink2" content="" />
  52. <meta name="text:DropDownLink2 URL" content="" />
  53. <meta name="text:DropDownLink3" content="" />
  54. <meta name="text:DropDownLink3 URL" content="" />
  55. <meta name="text:DropDownLink4" content="" />
  56. <meta name="text:DropDownLink4 URL" content="" />
  57. <meta name="text:DropDownLink5" content="" />
  58. <meta name="text:DropDownLink5 URL" content="" />
  59. <meta name="text:DropDownLink6" content="" />
  60. <meta name="text:DropDownLink6 URL" content="" />
  61.  
  62. <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"><link href="https://static.tumblr.com/nuyvmrm/nIapptm9w/fontello-embedded.css" rel="stylesheet" />
  63.  
  64. </head>
  65.  
  66. <style type="text/css">
  67.  
  68. /* tumblr controls */
  69.  
  70. iframe.tmblr-iframe {
  71. z-index:99999999!important;
  72. top:calc(100% - 32px)!important;!important;
  73. right:2px!important;
  74. opacity:0.4;
  75. filter:invert(1);
  76. -webkit-filter:invert(1);
  77. -o-filter:invert(1);
  78. -moz-filter:invert(1);
  79. -ms-filter:invert(1);
  80. transform:scale(0.65) rotate(90deg);
  81. transform-origin:100% 0;
  82. -webkit-transform:scale(0.65) rotate(90deg);
  83. -webkit-transform-origin:100% 0;
  84. -o-transform:scale(0.65) rotate(90deg);
  85. -o-transform-origin:100% 0;
  86. -moz-transform:scale(0.65) rotate(90deg);
  87. -moz-transform-origin:100% 0;
  88. -ms-transform:scale(0.65) rotate(90deg);
  89. -ms-transform-origin:100% 0;
  90. }
  91.  
  92. body {
  93. color:{color:text};
  94. background:{color:background};
  95. font:{text:Font Size} 'Roboto', sans-serif;
  96. font-style:normal;
  97. font-variant:normal;
  98. font-weight:400;
  99. line-height:20px;
  100. word-wrap:break-word;
  101. overflow-x:hidden;
  102. margin:0;
  103. cursor:default;
  104. -moz-osx-font-smoothing:grayscale;
  105. -webkit-font-smoothing:antialiased;
  106. font-smoothing:antialiased;
  107. }
  108.  
  109. img {
  110. display:block;
  111. max-width:100%;
  112. height:auto;
  113. }
  114.  
  115. div#qTip {
  116. z-index: 1000;
  117. display: none;
  118. background:rgba({RGBcolor:tooltip},.7);
  119. color: {color:text};
  120. position: absolute;
  121. padding:3px;
  122. margin:10px 0 0;
  123. -webkit-border-radius: 3px;
  124. -moz-border-radius: 3px;
  125. border-radius: 3px;
  126. vertical-align: center;
  127. align-items: center;
  128. flex-wrap: wrap;
  129. grid-area: two;
  130. line-height: 150%;
  131. text-align: justify;
  132. -moz-transition: 0.2s ease-in;
  133. -webkit-transition: 0.2s ease-in;
  134. -o-transition: 0.2s ease-in;
  135. transition: 0.2s ease-in;
  136. }
  137.  
  138. ::selection {
  139. color:{color:text};
  140. background:rgba({RGBcolor:selection},.8);
  141. }
  142.  
  143. ::-moz-selection {
  144. color:{color:text};
  145. background:rgba({RGBcolor:selection},.8);
  146. }
  147.  
  148. ::-webkit-scrollbar {
  149. width:18px;
  150. height:6px;
  151. }
  152.  
  153. ::-webkit-scrollbar-button {
  154. width: 0px;
  155. height: 0px;
  156. }
  157.  
  158. ::-webkit-scrollbar-thumb {
  159. background:{color:scrollbar};
  160. border:7px solid {color:accent};
  161. border-top:4px solid {color:accent};
  162. border-bottom:4px solid {color:accent};
  163. cursor:pointer;
  164. border-radius: 8px;
  165. }
  166.  
  167. ::-webkit-scrollbar-track {
  168. background:{color:background};
  169. border: 8px solid {color:accent};
  170. border-top:12px solid {color:accent};
  171. border-bottom:12px solid {color:accent};
  172. }
  173.  
  174. a:link, a:visited, a:active {
  175. background-repeat: no-repeat;
  176. background-size: 100% 0.4em;
  177. background-position: 0 86%;
  178. text-decoration:none;
  179. color:{color:text};
  180. font-weight:bold;
  181. background-image: linear-gradient({color:link},{color:link});
  182. -moz-transition:0.19s ease-in;
  183. -webkit-transition:0.19s ease-in;
  184. -o-transition:0.19s ease-in;
  185. transition:0.19s ease-in;
  186. }
  187.  
  188. blockquote {
  189. margin:0;
  190. padding:0;
  191. border:0;
  192. }
  193.  
  194. pre {
  195. padding:0;
  196. margin:0;
  197. line-height:1.5em;
  198. background:transparent;
  199. font-family:inherit!Important;
  200. font-size:1em!important;
  201. white-space:pre-wrap;
  202. white-space:-moz-pre-wrap;
  203. white-space:-pre-wrap;
  204. white-space:-o-pre-wrap;
  205. word-wrap:break-word;
  206. }
  207.  
  208. p {
  209. margin:1em 0;
  210. }
  211.  
  212. p:first-of-type {
  213. margin-top:0;
  214. }
  215.  
  216. p:last-of-type {
  217. margin-bottom:0;
  218. }
  219.  
  220. h1:first-of-type,
  221. h2:first-of-type,
  222. h3:first-of-type,
  223. h4:first-of-type {
  224. margin-top:0;
  225. }
  226.  
  227. h1:last-of-type,
  228. h2:last-of-type,
  229. h3:last-of-type,
  230. h4:last-of-type {
  231. margin-bottom:0;
  232. }
  233.  
  234. h2 {
  235. font-size: 1.5em!important;
  236. margin: .75em 0;
  237. }
  238.  
  239. h3 {
  240. font-size: 1.17em!important;
  241. margin: .83em 0;
  242. }
  243.  
  244. h4 {
  245. margin: 1.12em 0;
  246. }
  247.  
  248. h5 {
  249. font-size: .83em!important;
  250. margin: 1.5em 0;
  251. }
  252.  
  253. b,
  254. strong {
  255. font-weight:bold;
  256. color:{color:accent};
  257. }
  258.  
  259. em,
  260. i,
  261. em a,
  262. i a {
  263. font-style:italic;
  264. }
  265.  
  266. ol,
  267. ul {
  268. list-style:none;
  269. text-align:left;
  270. padding-left:0;
  271. }
  272.  
  273. li {
  274. position:relative;
  275. padding:.1em 0 .1em 35px;
  276. }
  277.  
  278. ol li {counter-increment:list;}
  279.  
  280. ol li:before, ul li:before {
  281. left:15px;
  282. position:absolute;
  283. vertical-align:baseline!important;
  284. }
  285.  
  286. ol li:before {content:counter(list) '.';}
  287. ul li:before {content:'-';}
  288.  
  289. small,
  290. big {
  291. font-size:1em!important;
  292. line-height:1.5em!important;
  293. vertical-align:baseline!important;
  294. }
  295. @media (max-width:900px){
  296. .sidebar {
  297. display:block!important;
  298. width:100%!important;
  299. height:auto!important;
  300. margin:0!important;
  301. {block:Pagination}padding:.5em 0 0!important;{/block:Pagination}
  302. padding:.5em 0 .5em!important;
  303. position:relative!important;
  304. background-color:{color:background}!important;
  305. }
  306. .navbar,
  307. #pagination {
  308. position:relative!important;
  309. }
  310. .navbar {
  311. margin:0 auto 1.5em!important;
  312. width:100%!important;
  313. }
  314. #pagination {
  315. margin:5em auto 0!important;
  316. width:calc(100% - 3em)!important;
  317. padding:0 1.5em!important;
  318. }
  319. #stext {
  320. margin:0 auto!important;
  321. padding:0!important;
  322. text-align:justify!important;
  323. }
  324. .entry {
  325. float:none!important;
  326. margin:2em auto 2em!important;
  327. }
  328. .posts {
  329. display:block;
  330. position:relative;
  331. width:{select:post width}px;
  332. margin:auto;
  333. padding:0;
  334. background-color:{color:background};
  335. border:1px solid {color:borders};
  336. }
  337. }
  338.  
  339. /* sidebar */
  340.  
  341. .sidebar {
  342. display:flex;
  343. align-items:center;
  344. width:50%;
  345. height:100vh;
  346. top:0;
  347. left:0;
  348. right:0;
  349. bottom:0;
  350. z-index:1;
  351. padding:0;
  352. position:fixed;
  353. background-color:{color:background};
  354. }
  355.  
  356. .navbar,
  357. #pagination {
  358. left:0;
  359. width:100%;
  360. display:block;
  361. position:absolute;
  362. background-color:{color:background}!important;
  363. }
  364.  
  365. a:focus,
  366. button:focus,
  367. input:focus,
  368. textarea:focus {
  369. outline: none!important;
  370. }
  371.  
  372. .navbar, .navbar-expand-lg, .navbar-light, .bg-light {
  373. transition:0.75s ease;
  374. top:0;
  375. background:transparent!important;
  376. }
  377.  
  378. .navbar a {
  379. background:none!important;
  380. padding:0;
  381. border:0;
  382. color:{color:text}!important;
  383. text-transform:none;
  384. }
  385.  
  386. .navbar li:before {
  387. display:none;
  388. }
  389.  
  390. .navbar-brand {
  391. float:left;
  392. text-align:left;
  393. margin-top:10px;
  394. font-size:12px;
  395. font-weight:lighter;
  396. vertical-align:center;
  397. }
  398.  
  399. .navbar,
  400. .navbar-nav,
  401. .collapse,
  402. .navbar-collapse {
  403. text-align:right!important;
  404. }
  405.  
  406. .navbar-nav {
  407. width:100%;
  408. margin-top:10px;
  409. right:0;
  410. padding:0;
  411. }
  412.  
  413. .navbar-nav li {
  414. padding:0;
  415. margin:0;
  416. }
  417.  
  418. a.nav-link {
  419. text-align:center;
  420. margin-left:.5em;
  421. }
  422.  
  423. a:hover.nav-link {
  424. border-radius:3px!important;
  425. background-color:rgba({RGBcolor:text},.15)!important;
  426. }
  427.  
  428. a.dropdown-toggle {
  429. border-radius:3px!important;
  430. background-color:rgba({RGBcolor:text},.15)!important;
  431. }
  432.  
  433. .dropdown-menu {
  434. margin-top:.5em;
  435. font-size:12px;
  436. border:0;
  437. padding:0 0 0 .5em;
  438. background-color:rgba({RGBcolor:background},.9)!important;
  439. }
  440.  
  441. .dropdown-item {
  442. margin:.5em;
  443. }
  444.  
  445. /* pagination */
  446.  
  447. #pagination {
  448. width:calc(100% - 40px);
  449. bottom:35px;
  450. padding-left:40px;
  451. text-align:center;
  452. }
  453.  
  454. #pagination a {
  455. display:inline-block;
  456. border:0;
  457. padding:0 0 1em 0;
  458. width:32.5%;
  459. margin:0!important;
  460. background:none;
  461. text-align:left;
  462. font-weight:lighter;
  463. border-bottom:2px solid {color:borders};
  464. }
  465.  
  466. #pagination a:hover {
  467. border-bottom:2px solid {color:text};
  468. }
  469.  
  470. #pagination a.current_page {
  471. font-weight:700;
  472. border-bottom:2px solid {color:text};
  473. }
  474.  
  475. #stext {
  476. display:block;
  477. width:80%;
  478. margin:0;
  479. padding-left:40px;
  480. text-align:left;
  481. }
  482.  
  483. #titlebar {
  484. display:block;
  485. font-weight:700;
  486. font-size:{text:Title Font Size};
  487. letter-spacing:1px;
  488. margin-bottom:15px;
  489. line-height:100%;
  490. }
  491.  
  492. /* posts */
  493.  
  494. .entry {
  495. float:left;
  496. width:{select:post width}px;
  497. margin-left:calc(50% + 50px);
  498. display:flex;
  499. align-items:center;
  500. flex-wrap:wrap;
  501. grid-area:one;
  502. height:100vh;
  503. top:0;
  504. bottom:0;
  505. padding:0;
  506. }
  507.  
  508. .posts {
  509. display:block;
  510. position:relative;
  511. width:{select:post width}px;
  512. margin:0;
  513. padding:0;
  514. vertical-align:center;
  515. background-color:{color:background};
  516. border:1px solid {color:borders};
  517. }
  518.  
  519. .posts h1,
  520. .posts h2,
  521. .posts h3,
  522. .posts h4,
  523. .posts h5 {
  524. display:inline-block;
  525. font-weight:bold;
  526. color:{color:text};
  527. background-position: 0 86%;
  528. background-size: 100% 0.4em;
  529. background-repeat: no-repeat;
  530. background-image: linear-gradient({color:accent},{color:accent});
  531. }
  532.  
  533. /* quote */
  534.  
  535. .quote {
  536. display:block;
  537. width:100%;
  538. padding:25px;
  539. font-style:italic;
  540. font-size:25px;
  541. font-weight:300;
  542. font-family: 'Lora', serif;
  543. text-align:left;
  544. line-height:1.3em;
  545. background:{color:accent};
  546. }
  547.  
  548. .quote svg {
  549. float:left;
  550. width:25px;
  551. height:auto;
  552. opacity:.3;
  553. margin-right:-10px;
  554. display:block;
  555. overflow:visible;
  556. fill:{color:borders};
  557. z-index:-1!important;
  558. }
  559.  
  560. @import url('https://fonts.googleapis.com/css?family=Lora');
  561.  
  562. #s {
  563. width:100%;
  564. display:block;
  565. text-align:left;
  566. margin:0;
  567. padding-left:5px;
  568. }
  569.  
  570. #s svg {
  571. width:25px;
  572. height:auto;
  573. display:block;
  574. overflow:visible;
  575. fill:{color:accent};
  576. margin-top:-7px;
  577. }
  578.  
  579. #s a {
  580. border:0;
  581. padding:0;
  582. opacity:.8;
  583. color:{color:text};
  584. text-decoration:underline;
  585. background:none;
  586. }
  587.  
  588. /** links and text **/
  589.  
  590. a.titles {
  591. display:inline-block;
  592. text-align:center;
  593. color:{color:text};
  594. font-size:16px;
  595. letter-spacing:1px;
  596. text-align:left;
  597. background-position: 0 100%;
  598. background-size: 100% 100%;
  599. background-repeat: no-repeat;
  600. background-image: linear-gradient({color:link},{color:link});
  601. border:0;
  602. padding:10px;
  603. }
  604.  
  605. #post {
  606. display:block;
  607. text-align:justify;
  608. margin:0;
  609. padding:10px;
  610. font-weight:lighter;
  611. color:{color:text};
  612. background-color:rgba({RGBcolor:text},.12);
  613. }
  614.  
  615. /* chat */
  616.  
  617. .chat li:before {
  618. display:none;
  619. }
  620.  
  621. .l {
  622. display:block;
  623. margin:0;
  624. width:100%;
  625. padding:0 5px;
  626. }
  627.  
  628. .l:nth-child(odd) {
  629. text-align:right;
  630. }
  631.  
  632. .l:nth-child(even) {
  633. text-align:left;
  634. }
  635.  
  636. .line {
  637. padding:5px;
  638. border-radius:3px;
  639. background:rgba({RGBcolor:accent},.7);
  640. }
  641.  
  642. .chat li:first-of-type {
  643. margin-top:0;
  644. }
  645.  
  646. .chat li:last-of-type {
  647. margin-bottom:0;
  648. }
  649.  
  650. .label {
  651. color:{color:text};
  652. display:block;
  653. }
  654.  
  655. /* audio */
  656.  
  657. .soundcloud_audio_player {
  658. max-height:116px!important;
  659. }
  660.  
  661. .spotify_audio_player {
  662. max-height:80px!important;
  663. }
  664.  
  665. .audiopost {
  666. display:block;
  667. position:relative;
  668. padding:1em;
  669. border-radius:3px 3px 0 0;
  670. width:{select:post width}px;
  671. background-color:{color:accent};
  672. min-height:calc(46px + 1em);
  673. }
  674.  
  675. .player {
  676. float:left;
  677. width:30px!important;
  678. overflow:hidden;
  679. margin:1.5em 2em 0 1em;
  680. }
  681.  
  682. .player .tumblr_audio_player {
  683. opacity:0!important;
  684. position:relative;
  685. }
  686.  
  687. .player svg {
  688. display:block;
  689. overflow:visible;
  690. width:15px;
  691. height:15px;
  692. fill:white
  693. stroke:white;
  694. stroke-width:2;
  695. margin-left:.75em;
  696. margin-top:-25px;
  697. margin-bottom:.5em;
  698. }
  699.  
  700. .albumart {
  701. float:right;
  702. width:46px;
  703. margin:.7em 1em 0;
  704. }
  705.  
  706. .infobox {
  707. display:block;
  708. position:relative;
  709. text-align:center;
  710. overflow:hidden;
  711. align-items:center;
  712. vertical-align:center;
  713. min-height:calc(46px + 1em);
  714. }
  715.  
  716. .infobox .title {
  717. display:block;
  718. font-size:15px;
  719. font-weight:700;
  720. margin:0;
  721. letter-spacing:.5px;
  722. }
  723.  
  724. .infobox .artist, .infobox .album {
  725. display:block;
  726. font-size:9.5px;
  727. margin:0;
  728. }
  729.  
  730. /* question */
  731.  
  732. #askbox {
  733. display:block;
  734. width:{select:post width}px;
  735. }
  736.  
  737. .question,
  738. .answer {
  739. display:block;
  740. padding:15px;
  741. margin:0;
  742. }
  743.  
  744. .question {
  745. background:{color:accent};
  746. }
  747.  
  748. .answer {
  749. background:rgba({RGBcolor:text},.12);
  750. }
  751.  
  752. a.asker,
  753. a.answerer,
  754. .asker,
  755. .answerer {
  756. padding:0;
  757. border:0;
  758. float:left;
  759. margin-right:.5em;
  760. font-weight:700;
  761. color:{color:text};
  762. font-style:italic;
  763. background:none;
  764. }
  765.  
  766. .asker-question, .answerer-answer {
  767. display:inline-block;
  768. }
  769.  
  770. /* video */
  771.  
  772. .video {
  773. display:block;
  774. position:relative;
  775. border-radius:3px;
  776. }
  777.  
  778. .video iframe {
  779. display:block;
  780. margin:auto;
  781. max-width:calc({select:post width}px - 8px);
  782. }
  783.  
  784. .tumblr_video_container {
  785. display:block;
  786. margin:auto;
  787. max-width:calc({select:post width}px - 8px);
  788. }
  789.  
  790. #youtube_iframe {
  791. display:block;
  792. margin:auto;
  793. max-height:calc({select:post width}px * 0.67);
  794. max-width:calc({select:post width}px - 8px);
  795. }
  796.  
  797. .instagram-media {
  798. max-height:none!important;
  799. }
  800.  
  801. /** caption **/
  802.  
  803. .caption .tumblr_parent {
  804. margin:0;
  805. padding:0;
  806. border:0;
  807. color:{color:text};
  808. margin-bottom:.5em;
  809. }
  810.  
  811. .caption .tumblr_parent:last-child, .caption .tumblr_parent:last-of-type {
  812. margin-bottom:0px;
  813. }
  814.  
  815. .caption .tumblr_avatar {
  816. display:none;
  817. }
  818.  
  819. .caption a.tumblr_blog {
  820. display:inline-block;
  821. color:{color:link};
  822. float:left;
  823. border:0;
  824. padding:0;
  825. background:none;
  826. margin-right:.5em;
  827. vertical-align:center!important;
  828. }
  829.  
  830. .caption a:hover.tumblr_blog {
  831. color:{color:text};
  832. opacity:.5;
  833. }
  834.  
  835. .caption .tumblr_parent blockquote {
  836. margin:0;
  837. padding:0;
  838. border:0;
  839. }
  840.  
  841. /* permalink */
  842.  
  843. #permalink {
  844. display:block;
  845. width:100%;
  846. padding:10px;
  847. margin:0;
  848. background:{color:background};
  849. }
  850.  
  851. #permalink svg,
  852. .nts svg {
  853. display:inline-block;
  854. width:12px;
  855. height:auto;
  856. opacity:1;
  857. padding:0;
  858. overflow:visible;
  859. fill:{color:accent};
  860. margin:.25em 1em 0 0;
  861. stroke:{color:accent};
  862. stroke-width:20;
  863. stroke-linecap:square;
  864. vertical-align:top;
  865. }
  866.  
  867. .nts {
  868. display:block;
  869. float:left;
  870. height:100%;
  871. }
  872.  
  873. .btns {
  874. display:inline-block;
  875. float:right;
  876. vertical-align:top!important;
  877. }
  878.  
  879. .btns a {
  880. border:0;
  881. padding:0;
  882. background:none;
  883. }
  884.  
  885. #tags {
  886. display:block;
  887. width:{select:post width}px;
  888. margin-bottom:10px;
  889. overflow-wrap: break-word;
  890. word-wrap: break-word;
  891. -ms-word-break: break-all;
  892. /* Instead use this non-standard one: */
  893. word-break: break-word;
  894. }
  895.  
  896. #tags a {
  897. display:inline-block;
  898. border:0;
  899. padding:0;
  900. background:0;
  901. margin:0 .5em;
  902. }
  903.  
  904. #tags a:first-of-type {
  905. margin-top:0;
  906. margin-left:0;
  907. }
  908.  
  909. #tags a :last-of-type {
  910. margin-right:0;
  911. }
  912.  
  913. #tags a:only-of-type {
  914. margin:0;
  915. }
  916.  
  917. .post_permalink,
  918. .post_permalink a {
  919. border:0;
  920. padding:0;
  921. background:none;
  922. }
  923.  
  924. .post_permalink {
  925. position: relative;
  926. margin:10px 0;
  927. line-height: 20px;
  928. white-space: nowrap;
  929. overflow: hidden;
  930. }
  931.  
  932. .post_permalink.draggable .post_permalink_inner {
  933. cursor: col-resize;
  934. -webkit-touch-callout: none;
  935. -webkit-user-select: none;
  936. -khtml-user-select: none;
  937. -moz-user-select: none;
  938. -ms-user-select: none;
  939. user-select: none;
  940. }
  941.  
  942. .post_permalink_inner {
  943. float: left;
  944. position: relative;
  945. padding: 0px 20px 0px 0;
  946. }
  947.  
  948. .post_permalink:after {
  949. content: '';
  950. position: absolute;
  951. top: 0;
  952. right: 0;
  953. bottom: 0;
  954. width: 20px;
  955. background: -moz-linear-gradient(left, rgba(255,255,255,0) 0, rgba(255,255,255,1) 100%);
  956. background: -webkit-gradient(linear, left top, right top, color-stop(0%, rgba(255, 255, 255, 0)), color-stop(100%, #FFF));
  957. background: -webkit-linear-gradient(left, rgba(255, 255, 255, 0) 0, #FFF 100%);
  958. background: -o-linear-gradient(left, rgba(255,255,255,0) 0, rgba(255,255,255,1) 100%);
  959. background: -ms-linear-gradient(left, rgba(255,255,255,0) 0, rgba(255,255,255,1) 100%);
  960. background: linear-gradient(to right, rgba(255, 255, 255, 0) 0, #FFF 100%);
  961. }
  962.  
  963. #date,
  964. #notes,
  965. #sources {
  966. display:inline-block;
  967. width:calc(100% / 3)!important;
  968. padding:.5em;
  969. vertical-align:top;
  970. text-align:center;
  971. font-size:9.5px;
  972. }
  973.  
  974. #date b,
  975. #notes b,
  976. #sources b {
  977. display:block;
  978. font-size:12px;
  979. letter-spacing:1px;
  980. text-transform:uppercase;
  981. margin-bottom:.5em;
  982. }
  983.  
  984. /* caption */
  985.  
  986. .textcaption {
  987. width:70%;
  988. display:inline-block;
  989. margin:0 0 0 1em;
  990. }
  991.  
  992. .caption .tumblr_parent {
  993. margin:0;
  994. padding:0;
  995. border:0;
  996. color:rgba({RGBcolor:text},.7);
  997. margin-bottom:.5em;
  998. }
  999.  
  1000. .caption .tumblr_parent:last-child, .caption .tumblr_parent:last-of-type {margin-bottom:0px;}
  1001. .caption .tumblr_avatar {display:none;}
  1002. .caption a.tumblr_blog {
  1003. display:inline-block;
  1004. color:rgba({RGBcolor:text},1);
  1005. float:left;
  1006. border:0;
  1007. padding:0;
  1008. margin-right:.5em;
  1009. vertical-align:center!important;
  1010. }
  1011.  
  1012. .caption .tumblr_parent blockquote {
  1013. margin:0;
  1014. padding:0;
  1015. border:0;
  1016. }
  1017.  
  1018. /* like button */
  1019.  
  1020. .like-b {
  1021. position:relative;
  1022. display:inline-block;
  1023. height:1em;
  1024. line-height:1em;
  1025. overflow:hidden;
  1026. margin-bottom:-2px;
  1027. margin-top:3.5px;
  1028. }
  1029.  
  1030. .like-b .like_button iframe {
  1031. position:absolute;
  1032. top:0;
  1033. left:0;
  1034. bottom:0;
  1035. right:0;
  1036. z-index:2;
  1037. opacity:0;
  1038. }
  1039. .like-b .liked + .b {
  1040. color:inherit;
  1041. }
  1042. .like-b .liked + .b:after {
  1043. content:'d';
  1044. }
  1045.  
  1046. /* tooltip */
  1047.  
  1048. [tooltip] {
  1049. position: relative;
  1050. z-index: 9;
  1051. cursor: pointer;
  1052. }
  1053.  
  1054. [tooltip]:before,
  1055. [tooltip]:after {
  1056. visibility: hidden;
  1057. -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
  1058. filter: progid: DXImageTransform.Microsoft.Alpha(Opacity=0);
  1059. opacity: 0;
  1060. pointer-events: none;
  1061. }
  1062.  
  1063. [tooltip]::before {
  1064. content: "";
  1065. position: absolute;
  1066. top:-6px;
  1067. left:50%;
  1068. transform: translateX(-50%);
  1069. border-width: 4px 6px 0 6px;
  1070. border-style: solid;
  1071. border-color: rgba({RGBcolor:accent},0.7) transparent transparent transparent;
  1072. z-index: 100;
  1073. }
  1074.  
  1075. [tooltip]::after {
  1076. content: attr(tooltip);
  1077. position: absolute;
  1078. left:50%;
  1079. top:-6px;
  1080. transform: translateX(-50%) translateY(-100%);
  1081. background: rgba({RGBcolor:accent},0.7);
  1082. text-align: center;
  1083. color: {color:text};
  1084. padding:4px 2px;
  1085. font-size: 12px;
  1086. min-width: 80px;
  1087. border-radius: 5px;
  1088. pointer-events: none;
  1089. }
  1090.  
  1091. [tooltip]:hover:before,
  1092. [tooltip]:hover:after {
  1093. visibility: visible;
  1094. transition:.6s;
  1095. -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
  1096. filter: progid: DXImageTransform.Microsoft.Alpha(Opacity=100);
  1097. opacity: 1;
  1098. }
  1099.  
  1100. /* post notes */
  1101.  
  1102. ol.notes {
  1103. display:block;
  1104. width:{select:post width}px;
  1105. list-style-type:none;
  1106. margin:0;
  1107. border-left:1px solid {color:borders};
  1108. border-right:1px solid {color:borders};
  1109. border-bottom:1px solid {color:borders};
  1110. }
  1111.  
  1112. ol.notes a {
  1113. border:0;
  1114. padding:0;
  1115. color:{color:link};
  1116. background:none;
  1117. }
  1118.  
  1119. ol.notes li.note {
  1120. display:block;
  1121. position:relative;
  1122. line-height:16px;
  1123. border-top:1px solid {color:borders};
  1124. padding:10px 0 10px 35px;
  1125. }
  1126.  
  1127. ol.notes li.note a {
  1128. border:none;
  1129. padding:0px;
  1130. margin:0 .5em;
  1131. }
  1132.  
  1133. ol.notes li:before {
  1134. left:15px;
  1135. position:absolute;
  1136. vertical-align:baseline!important;
  1137. content:'';
  1138. font-family: "fontello";
  1139. font-weight:700;
  1140. font-style:normal;
  1141. speak:none;
  1142. vertical-align:middle;
  1143. font-size:10px;
  1144. }
  1145.  
  1146. ol.notes li.note.reblog:before {content: '\e803'; color:{color:accent};}
  1147. ol.notes li.note.like:before {content: '\e804'; color:{color:accent};}
  1148. ol.notes li.note img.avatar {display:none;}
  1149. ol.notes li.note span.action {font-weight:normal!important;}
  1150.  
  1151. ol.notes li.note blockquote {
  1152. border-left:1px solid {color:borders};
  1153. padding-left:10px;
  1154. margin:8px 16px 0 0px;
  1155. font-weight:normal;
  1156. font-style:none;
  1157. text-align:block;
  1158. text-transform:none;
  1159. line-height:17px;
  1160. }
  1161.  
  1162. @import url('https://fonts.googleapis.com/css?family=Noto+Serif');
  1163.  
  1164. a.cr {
  1165. border:0;
  1166. padding:0;
  1167. bottom:15px;
  1168. right:15px;
  1169. position:fixed;
  1170. font-size:20px;
  1171. background:none;
  1172. font-style:italic;
  1173. font-weight:lighter;
  1174. letter-spacing:-5px;
  1175. text-decoration:none;
  1176. font-family: 'Noto Serif', serif;
  1177. }
  1178.  
  1179. .cr:before {
  1180. content:'a';
  1181. color:#F4B099;
  1182. }
  1183.  
  1184. .cr:after {
  1185. content:'t';
  1186. color:#A6A5CF;
  1187. }
  1188.  
  1189. {CustomCSS}
  1190.  
  1191. </style>
  1192.  
  1193. <body>
  1194.  
  1195. <div class="sidebar">
  1196.  
  1197. <nav class="navbar navbar-expand-lg navbar-light bg-light">
  1198. <a class="navbar-brand" href="/">{name}</a>
  1199. <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNavDropdown" aria-controls="navbarNavDropdown" aria-expanded="false" aria-label="Toggle navigation">
  1200. <span class="navbar-toggler-icon"></span>
  1201. </button>
  1202. <div class="collapse navbar-collapse" id="navbarNavDropdown">
  1203. <ul class="navbar-nav justify-content-end">
  1204. {block:AskEnabled}<li class="nav-item">
  1205. <a class="nav-link" href="/ask">mssg</a>
  1206. </li>{/block:AskEnabled}
  1207. {block:ifLink1}<li class="nav-item">
  1208. <a class="nav-link" href="{text:Link1 URL}">{text:Link1}</a>
  1209. </li>{/block:ifLink1}
  1210. {block:ifLink2}<li class="nav-item">
  1211. <a class="nav-link" href="{text:Link2 URL}">{text:Link2}</a>
  1212. </li>{/block:ifLink2}
  1213. {block:ifLink3}<li class="nav-item">
  1214. <a class="nav-link" href="{text:Link3 URL}">{text:Link3}</a>
  1215. </li>{/block:ifLink3}
  1216. {block:ifLink4}<li class="nav-item">
  1217. <a class="nav-link" href="{text:Link4 URL}">{text:Link4}</a>
  1218. </li>{/block:ifLink4}
  1219. {block:ifDropDownMenu}
  1220. <li class="nav-item dropdown">
  1221. <a class="nav-link dropdown-toggle" href="#" id="navbarDropdownMenuLink" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">navigation</a>
  1222. <div class="dropdown-menu" aria-labelledby="navbarDropdownMenuLink">
  1223. {block:ifDropDownLink1}<a class="dropdown-item" href="{text:DropDownLink1 URL}">{text:DropDownLink1}</a>{/block:ifDropDownLink1}
  1224. {block:ifDropDownLink2}<a class="dropdown-item" href="{text:DropDownLink2 URL}">{text:DropDownLink2}</a>{/block:ifDropDownLink2}
  1225. {block:ifDropDownLink3}<a class="dropdown-item" href="{text:DropDownLink3 URL}">{text:DropDownLink3}</a>{/block:ifDropDownLink3}
  1226. {block:ifDropDownLink4}<a class="dropdown-item" href="{text:DropDownLink4 URL}">{text:DropDownLink4}</a>{/block:ifDropDownLink4}
  1227. {block:ifDropDownLink5}<a class="dropdown-item" href="{text:DropDownLink5 URL}">{text:DropDownLink5}</a>{/block:ifDropDownLink5}
  1228. {block:ifDropDownLink6}<a class="dropdown-item" href="{text:DropDownLink6 URL}">{text:DropDownLink6}</a>{/block:ifDropDownLink6}
  1229. </div>
  1230. </li>
  1231. {/block:ifDropDownMenu}
  1232. </ul>
  1233. </div>
  1234. </nav>
  1235.  
  1236. <div id="stext">
  1237. <div id="titlebar">{title}</div>
  1238. {description}
  1239. </div>
  1240.  
  1241. {block:Pagination}<div id="pagination">
  1242. {block:JumpPagination length="3"}
  1243. {block:CurrentPage}<a class="current_page">{PageNumber}</a>{/block:CurrentPage}
  1244. {block:JumpPage}<a href="{URL}">{PageNumber}</a>{/block:JumpPage}
  1245. {/block:JumpPagination}
  1246. </div>{/block:Pagination}
  1247.  
  1248. </div>
  1249.  
  1250. <section class="entry">
  1251.  
  1252. {block:Posts}
  1253. <div class="posts" id="{PostID}" data-aos="fade-in">
  1254.  
  1255. {block:Quote}<div class="quote"><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" width="512.5px" height="512.5px" viewBox="0 0 512.5 512.5" style="enable-background:new 0 0 512.5 512.5;" xml:space="preserve"><path d="M112.5,208.25c61.856,0,112,50.145,112,112s-50.144,112-112,112s-112-50.145-112-112l-0.5-16c0-123.712,100.288-224,224-224v64c-42.737,0-82.917,16.643-113.137,46.863c-5.817,5.818-11.126,12.008-15.915,18.51C100.667,208.723,106.528,208.25,112.5,208.25z M400.5,208.25c61.855,0,112,50.145,112,112s-50.145,112-112,112s-112-50.145-112-112l-0.5-16c0-123.712,100.287-224,224-224v64c-42.736,0-82.918,16.643-113.137,46.863c-5.818,5.818-11.127,12.008-15.916,18.51C388.666,208.723,394.527,208.25,400.5,208.25z"/></svg>{Quote}</div>{block:Source}<div id="s"><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" width="404.308px" height="404.309px" viewBox="0 0 404.308 404.309" style="enable-background:new 0 0 404.308 404.309;" xml:space="preserve"><path d="M0,101.08h404.308L202.151,303.229L0,101.08z"/>
  1256. </svg>{Source}</div>{/block:Source}{/block:Quote}
  1257.  
  1258. {block:Text}{block:Title}<h2 style="margin:5px;">{Title}</h2>{/block:Title}<div class="caption" id="post">{Body}</div>{/block:Text}
  1259.  
  1260. {block:Link}<a href="{URL}" class="titles">{Name}</a>{block:Description}<div class="caption" id="post">{Description}</div>{/block:Description}{/block:Link}
  1261.  
  1262. {block:Chat}<div class="chat">{block:Title}<h2>{Title}</h2>{/block:Title}<ul>{block:Lines}<li class="l {Alt}">{block:Label}<span class="label">{Label}</span>{/block:Label}<span class="line">{Line}</span></li>{/block:Lines}</ul></div>{/block:Chat}
  1263.  
  1264. {block:Video}<div class="video">{Video-500}</div>{/block:Video}
  1265.  
  1266. {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}
  1267.  
  1268. {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}" /></a></div>{/block:Photo}
  1269.  
  1270. {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)" style="cursor:pointer;"><img src="{PhotoURL-HighRes}" /></div>{/block:Photos}</div>{/block:Photoset}
  1271.  
  1272. {block:Answer}<div id="askbox"><div class="question"><div class="asker">{Asker} said:</div><div class="asker-question">{Question}</div></div>{block:Answerer}<div class="answer"><div class="answerer">{Answerer}</div><div class="answerer-answer">{Answer}</div></div>{/block:Answerer}<div class="caption answer">{Replies}</div></div>{/block:Answer}
  1273.  
  1274. {block:Date}
  1275. <div id="permalink">
  1276.  
  1277. {block:PermalinkPage}{block:HasTags}<div id="tags">{block:Tags}<a href="{TagURL}">#{Tag}</a>{/block:Tags}</div>{/block:HasTags}
  1278.  
  1279. <div class="post_permalink draggable">
  1280. <div class="post_permalink_inner">
  1281.  
  1282. <div id="date">
  1283. <b>publish time</b>
  1284. {DayOfMonthWithZero} {ShortMonth}, {Year}
  1285. </div>
  1286.  
  1287. {block:NoteCount}<div id="notes">
  1288. <b>note count</b>
  1289. {NoteCountWithLabel}
  1290. </div>{/block:NoteCount}
  1291.  
  1292. {block:RebloggedFrom}<div id="sources">
  1293. <b>reblogged from</b>
  1294. <a href="{ReblogParentURL}">{ReblogParentName}</a>
  1295. </div>
  1296. <div id="sources">
  1297. <b>source</b>
  1298. <a href="{ReblogRootURL}">{ReblogRootName}</a>
  1299. </div>{/block:RebloggedFrom}
  1300. {block:NotReblog}<div id="sources">
  1301. <b>source</b>
  1302. <a href="{Permalink}">{name}</a>
  1303. </div>{/block:NotReblog}
  1304.  
  1305. </div>
  1306. </div>
  1307.  
  1308. {block:Caption}<div class="caption">{caption}</div>{/block:Caption}{/block:PermalinkPage}
  1309.  
  1310. {block:IndexPage}<span class="nts">
  1311. <a href="{permalink}" tooltip="{timeago}" style="padding:0;background:none;border:0;"><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" width="612px" height="612px" viewBox="0 0 612 612" style="enable-background:new 0 0 612 612;" xml:space="preserve"><path d="M587.572,186.881c-32.266-75.225-87.096-129.934-162.949-162.285C386.711,8.427,346.992,0.168,305.497,0.168c-41.488,0-80.914,8.181-118.784,24.428C111.488,56.861,56.415,111.535,24.092,186.881C7.895,224.629,0,264.176,0,305.664c0,41.496,7.895,81.371,24.092,119.127c32.323,75.346,87.403,130.348,162.621,162.621c37.877,16.247,77.295,24.42,118.784,24.42c41.489,0,81.214-8.259,119.12-24.42c75.853-32.352,130.683-87.403,162.956-162.621C603.819,386.914,612,347.16,612,305.664C612,264.176,603.826,224.757,587.572,186.881z M538.724,440.853c-24.021,41.195-56.929,73.876-98.375,98.039c-41.195,24.021-86.332,36.135-134.845,36.135c-36.47,0-71.27-7.024-104.4-21.415c-33.129-14.384-61.733-33.294-85.661-57.215c-23.928-23.928-42.973-52.811-57.214-85.997c-14.199-33.065-21.08-68.258-21.08-104.735c0-48.52,11.921-93.428,35.807-134.509c23.971-41.231,56.886-73.947,98.039-98.04c41.146-24.092,85.99-36.142,134.502-36.142c48.52,0,93.649,12.121,134.845,36.142c41.446,24.164,74.283,56.879,98.375,98.039c24.092,41.153,36.135,85.99,36.135,134.509C574.852,354.185,562.888,399.399,538.724,440.853z"/><path d="M324.906,302.988V129.659c0-10.372-9.037-18.738-19.41-18.738c-9.701,0-18.403,8.366-18.403,18.738v176.005c0,0.336,0.671,1.678,0.671,2.678c-0.671,6.024,1.007,11.043,5.019,15.062l100.053,100.046c6.695,6.695,19.073,6.695,25.763,0c7.694-7.695,7.188-18.86,0-26.099L324.906,302.988z"/></svg></a>
  1312.  
  1313. {block:NoteCount}<a href="{permalink}">{NoteCount}</a>{/block:NoteCount}
  1314. </span>
  1315.  
  1316. {block:Caption}<div class="caption textcaption">{caption}</div>{/block:Caption}
  1317.  
  1318. <span class="btns">
  1319. <a class="like-b" href="#">{LikeButton}<span class="b">like</span></a>
  1320. <a href="{reblogurl}" style="margin-left:.5em;">reblog</a>
  1321. </span>{/block:IndexPage}
  1322.  
  1323. </div>
  1324. {/block:Date}
  1325.  
  1326. </div>
  1327.  
  1328. {/block:Posts}
  1329. {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}-->
  1330.  
  1331. </section>
  1332.  
  1333. <a class="cr" href="https://aurthms.tumblr.com" target="_blank"></a>
  1334.  
  1335. <!--
  1336.  
  1337. * Bootstrap
  1338.  
  1339. 1.JQuery
  1340. 2.Tooltip
  1341. 3.Unnest captions by neothm
  1342. 4.Responsive video by nouvae
  1343. 5.Smoothscroll
  1344. 6.Animate On Scroll Library
  1345.  
  1346. -->
  1347.  
  1348. <script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
  1349. <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js" integrity="sha384-UO2eT0CpHqdSJQ6hJty5KVphtPhzWj9WO1clHTMGa3JDZwrnQq4sF86dIHNDz0W1" crossorigin="anonymous"></script>
  1350. <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js" integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM" crossorigin="anonymous"></script>
  1351.  
  1352. <script src="//code.jquery.com/jquery-2.2.4.min.js"></script>
  1353. <script type="text/javascript" src="https://static.tumblr.com/tiu5k68/xTkm8wqw2/tumblr-title-qtip.js"></script>
  1354. <script src="https://static.tumblr.com/wgg6svp/OoTofxa0c/unnest.min.js"></script>
  1355. <script src="https://rawgit.com/robinpx/tumblr/master/scripts/flexibleFrames/flexibleFrames.min.js"></script>
  1356. <script type="text/javascript" src="https://static.tumblr.com/bkd4m5b/Citm42m8i/smoothscroll.js"></script>
  1357.  
  1358. <script src="https://unpkg.com/[email protected]/dist/aos.js"></script>
  1359.  
  1360. <script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.4/jquery-ui.min.js"></script>
  1361.  
  1362. <script type="text/javascript">
  1363. $(document).ready(function() {
  1364. flexibleFrames($(".video")); // $(".video") is the class selector passed in the argument
  1365. });
  1366.  
  1367. function flexFrame() {
  1368. $(".caption").each(function() {
  1369. $(this).find("iframe").wrap("<div class='iframe-flex'></div>"); // wrap iframe
  1370. flexibleFrames($(".iframe-flex"));
  1371. });
  1372. flexibleFrames($(".video"));
  1373. }
  1374.  
  1375. $(document).ready(flexFrame);
  1376.  
  1377. $(document).ready(function(){
  1378. $('.posts').unnest({
  1379. yourCaption: ".caption",
  1380. wrapName: ".tumblr_parent",
  1381. newCaptionUsername: true,
  1382. originalPostCaptionUsername: false,
  1383. tumblrAvatars: true,
  1384. tumblrAvatarClass: ".tumblr_avatar",
  1385. usernameColon: false
  1386. });
  1387. });
  1388.  
  1389. function gatherData(images, arr) {
  1390. for (let i = 0; i < images.length; i++) {
  1391. let currentData = {
  1392. "width": images[i].getAttribute('data-width'),
  1393. "height": images[i].getAttribute('data-height'),
  1394. "low_res": images[i].getAttribute('data-lowres'),
  1395. "high_res": images[i].getAttribute('data-highres')
  1396. };
  1397. arr.push(currentData);
  1398. }
  1399. }
  1400. function getIndex(elem) {
  1401. let i = 0;
  1402. while( (elem = elem.previousElementSibling) != null ) i++;
  1403. return i;
  1404. }
  1405. function lightbox(elem) {
  1406. let currentPhotoset = elem.parentNode;
  1407. let photosetPhotos = currentPhotoset.getElementsByTagName('div');
  1408. let data = [];
  1409. gatherData(photosetPhotos, data);
  1410. Tumblr.Lightbox.init(data, getIndex(elem) + 1);
  1411. }
  1412.  
  1413. $(document).ready(function(){
  1414. $(".post_permalink_inner").draggable({
  1415. axis : "x",
  1416. scroll: false,
  1417. stop: function() {
  1418. var __left = $(this).css("left").replace(/[^-\d\.]/g, '');
  1419. if(__left > 0){
  1420. $(this).animate({left: 0}, 400, 'easeOutExpo');
  1421. }
  1422. var __width = $(this).outerWidth();
  1423. var __parentWidth = $(".post_permalink.draggable").outerWidth();
  1424. if(__width > __parentWidth) {
  1425. if(__left < __parentWidth-__width){
  1426. $(this).animate({left: __parentWidth-__width}, 400, 'easeOutExpo');
  1427. }
  1428. } else {
  1429. $(this).animate({left: 0}, 400, 'easeOutExpo');
  1430. }
  1431. }
  1432. });
  1433. });
  1434.  
  1435. AOS.init({
  1436. easing: 'ease-in-out-sine'
  1437. });
  1438.  
  1439. </script>
  1440.  
  1441. </body>
  1442. </html>
Advertisement
Add Comment
Please, Sign In to add comment