Mangolias

Ryuk Light Theme

Sep 17th, 2019
1,670
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 26.02 KB | None | 0 0
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4.  
  5. <!--
  6.  
  7. Ryuk (Light) Theme by Mangolias
  8.  
  9. ~ mangolias.tumblr.com ~
  10.  
  11. Credits: pxu photosets by pixel union
  12. icons by feathericons.com
  13. responsive videos by nouvae.tumblr.com
  14.  
  15. -->
  16.  
  17. <title>{Title}</title>
  18. <link rel="shortcut icon" href="{Favicon}">
  19. {block:Description}
  20. <meta name="description" content="{MetaDescription}">
  21. {/block:Description}
  22. <meta name="viewport" content="width=device-width, initial-scale=1.0">
  23.  
  24. <meta name="image:Sidebar" content="">
  25. <meta name="if:Show Avatar" content="">
  26. <meta name="if:Full Photosets" content="">
  27. <meta name="if:Infinite Scroll" content="0">
  28.  
  29. <meta name="color:Background" content"#ffffff"/>
  30. <meta name="color:Sidebar" content"#ffffff"/>
  31. <meta name="color:Posts" content="#ffffff"/>
  32. <meta name="color:Text" content="#9fb4a9"/>
  33. <meta name="color:Post Text" content="#b0b0b0"/>
  34. <meta name="color:Audio Color" content="#f5f5f5"/>
  35. <meta name="color:Hover Color" content="#f5f5f5"/>
  36. <meta name="color:Borders" content="#ffffff"/>
  37. <meta name="color:Shadow" content="#efefef"/>
  38. <meta name="color:Button" content="#ffffff"/>
  39. <meta name="color:Scrollbar" content="#9fb4a9"/>
  40.  
  41. <meta name="text:Home" content="Home">
  42. <meta name="text:Ask" content="Ask">
  43. <meta name="text:Submit" content="Submit">
  44. <meta name="text:Archive" content="Archive">
  45.  
  46. <meta name="text:Link One" content="">
  47. <meta name="text:Link One URL" content="">
  48. <meta name="text:Link Two" content="">
  49. <meta name="text:Link Two URL" content="">
  50. <meta name="text:Link Three" content="">
  51. <meta name="text:Link Three URL" content="">
  52.  
  53. <meta name="text:Tag One" content="">
  54. <meta name="text:Tag Two" content="">
  55. <meta name="text:Tag Three" content="">
  56.  
  57. <link href="https://fonts.googleapis.com/css?family=Karla:400,400i,700,700i&display=swap" rel="stylesheet">
  58.  
  59. <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
  60.  
  61. <style type="text/css">
  62.  
  63. .tmblr-iframe-compact .tmblr-iframe--unified-controls {display:none!important;}
  64.  
  65. body {
  66. margin: 0;
  67. background-color: {color:Background};
  68. color: {color:Text};
  69. font-size: 12px;
  70. font-family: 'Karla', sans-serif;
  71. word-spacing: 1px;
  72. word-wrap: break-word;
  73. -webkit-font-smoothing: antialiased;
  74. font-smoothing: antialiased
  75. }
  76.  
  77. a {
  78. text-decoration: none;
  79. color: {color:Text};
  80. -webkit-transition: 0.4s;
  81. transition: 0.4s;
  82. }
  83.  
  84. a:hover {
  85. color: {color:Hover Color};
  86. }
  87.  
  88. h1, h2, h3, h4 {
  89. font-size: 13px;
  90. font-weight: 700;
  91. font-family: 'Karla', sans-serif;
  92. }
  93.  
  94. hr {
  95. border: none;
  96. box-shadow: 0;
  97. margin: 1em auto;
  98. border-top: 1px solid {color:Background};
  99. }
  100.  
  101. img {
  102. border: 0;
  103. height: auto;
  104. max-width: 100%;
  105. display: block;
  106. }
  107.  
  108. b, strong {
  109. font-weight: 700;
  110. }
  111.  
  112. ul {
  113. list-style: none;
  114. padding: 0;
  115. }
  116.  
  117. .thin {
  118. font-weight: 400;
  119. }
  120.  
  121. .title {
  122. font-weight: bold;
  123. }
  124.  
  125. .up {
  126. text-transform: uppercase;
  127. }
  128.  
  129. .accent {
  130. font-style: italic;
  131. }
  132.  
  133. blockquote {
  134. margin: 0;
  135. }
  136.  
  137. blockquote img {
  138. width: 100%;
  139. height: auto;
  140. }
  141.  
  142. p img {
  143. width: 100%;
  144. height: auto;
  145. }
  146.  
  147. /* aside */
  148.  
  149. aside {
  150. padding: 50px 100px 40px;
  151. background-color: {color:Sidebar};
  152. text-align: right;
  153. }
  154.  
  155. nav {
  156. line-height: 12px;
  157. font-size: 11px;
  158. }
  159.  
  160. nav li {
  161. list-style-type: none;
  162. display: inline-block;
  163. }
  164.  
  165. nav a {
  166. display: inline-block;
  167. margin: 0 .5em .5em 0;
  168. color: {color:Text};
  169. border-bottom: 2px solid {color:Text};
  170. }
  171.  
  172. aside section {
  173. margin: 0 auto;
  174. max-width: 300px;
  175. min-width: 100px;
  176. }
  177.  
  178. aside section:not(:first-child) {
  179. margin-top: 1.8em;
  180. }
  181.  
  182. aside .sideimg {
  183. display: none;
  184. }
  185.  
  186. aside .avatar {
  187. width: 50px;
  188. border-radius: 3px;
  189. margin-bottom: 40px;
  190. }
  191.  
  192. aside .avatar.circle {
  193. border-radius: 50%;
  194. }
  195.  
  196. aside .avatar img {
  197. display: block;
  198. }
  199.  
  200. aside .title a {
  201. font-family: 'Karla', sans-serif;
  202. font-weight: normal;
  203. font-weight: 700;
  204. }
  205.  
  206.  
  207. aside .description {
  208. font-size: 12px;
  209. padding: 10px 0 0 0;
  210. }
  211.  
  212. .taglist {
  213. font-style: italic;
  214. list-style-type: none;
  215. opacity: .5;
  216. line-height: 14px;
  217. }
  218.  
  219. .taglist li {
  220. display: inline-block;
  221. padding-right: 3px;
  222. }
  223.  
  224. /* content */
  225.  
  226. #content {
  227. background-color: {color:Background};
  228.  
  229. }
  230.  
  231. .entry {
  232. position: relative;
  233. width: 100%;
  234. padding: 20px;
  235. -moz-box-sizing: border-box;
  236. box-sizing: border-box;
  237. }
  238.  
  239. {block:IndexPage}
  240. .entry {
  241. opacity:0;
  242. z-index:-1;
  243. }
  244. {/block:IndexPage}
  245.  
  246. .entry:last-child {
  247. margin-bottom: 0;
  248. }
  249.  
  250. .post {
  251. max-width: 300px;
  252. margin: 0 auto;
  253. padding: 0;
  254. border: 1px solid {color:Borders};
  255. -moz-box-shadow: 2px 2px 20px {color:Shadow};
  256. -webkit-box-shadow: 2px 2px 20px {color:Shadow};
  257. box-shadow: 2px 2px 20px {color:Shadow};
  258. border-radius: 4px;
  259. }
  260.  
  261. .post img {
  262. border-radius: 3px;
  263. }
  264.  
  265. .post .media {
  266. position: relative;
  267. }
  268.  
  269. {block:IndexPage}
  270. .post:hover {
  271. opacity: 1;
  272. -webkit-transition: 0.7s;
  273. transition: 0.7s;
  274. }
  275. {/block:IndexPage}
  276.  
  277. .post .hv {
  278. opacity: 0;
  279. z-index: 10000001;
  280. position: absolute;
  281. top: 50%;
  282. left: 50%;
  283. transform: translate(-50%, -50%);
  284. }
  285.  
  286. {block:IndexPage}
  287. .post:hover .hv {
  288. opacity: 1;
  289. -webkit-transition: 0.6s;
  290. transition: 0.6s;
  291. }
  292. {/block:IndexPage}
  293.  
  294. .button {
  295. background-color: {color:Button};
  296. padding: 5px 7px;
  297. border-radius: 3px;
  298. }
  299.  
  300. /* posts */
  301.  
  302. .text {
  303. margin: 20px;
  304. }
  305.  
  306. .quote {
  307. margin: 20px;
  308. text-align: center;
  309. font-weight: 700;
  310. font-size: 13px;
  311. font-family: 'Karla', sans-serif;
  312. }
  313.  
  314. .quotetext {
  315. margin: 0 20px 20px 20px;
  316. padding: 5px 0;
  317. }
  318.  
  319. .mark {
  320. font-size: 20px;
  321. line-height: 13px;
  322. font-weight: 700;
  323. }
  324.  
  325. .chat {
  326. line-height: 20px;
  327. }
  328.  
  329. .asker {
  330. margin: 20px 40px 5px 20px;
  331. }
  332.  
  333. .asker a {
  334. margin: 20px 0 5px 0;
  335. }
  336.  
  337. .question {
  338. padding: 15px;
  339. border-radius: 0 7px 7px 7px;
  340. background-color: {color:Audio Color};
  341. line-height: 15px;
  342. margin: 0 20px;
  343. }
  344.  
  345. .answerer {
  346. margin: 20px 0 20px;
  347. }
  348.  
  349. .answer {
  350. padding: 5px 15px 5px 5px;
  351. border-radius: 7px 0 7px 7px;
  352. line-height: 15px;
  353. margin: 0 20px;
  354. }
  355.  
  356. .video {
  357. max-width: 100%;
  358. height: auto;
  359. }
  360.  
  361. .soundcloud_audio_player {
  362. max-height: 200px!important;
  363. }
  364.  
  365. .spotify_audio_player {
  366. max-height: 80px!important;
  367. }
  368.  
  369. .link {
  370. position: relative;
  371. padding: 10px;
  372. border-radius: 3px;
  373. }
  374.  
  375. .linkname {
  376. padding: 10px;
  377. line-height: 20px;
  378. font-weight: bold;
  379. }
  380.  
  381. .link a {
  382. border-bottom: 2px solid {color:Text};
  383. }
  384.  
  385. .linkdesc {
  386. padding-top: 10px;
  387. line-height: 15px;
  388. font-weight: normal;
  389. }
  390.  
  391. /* audio */
  392.  
  393. .audio {
  394. position: relative;
  395. background-color: {color:Audio Color};
  396. padding: 40px 20px;
  397. border-radius: 3px;
  398. }
  399.  
  400. .player {
  401. width: 30px;
  402. height: 30px;
  403. overflow: hidden;
  404. position: absolute;
  405. margin: 0 0 0 5px;
  406. opacity: .5;
  407. }
  408.  
  409. .track {
  410. margin: 0 0 0 45px;
  411. vertical-align: middle;
  412. font-family: 'Karla', sans-serif;
  413. font-weight: 700;
  414. font-size: 13px;
  415. padding-left: 5px;
  416. }
  417.  
  418. /* controls */
  419.  
  420. .controls {
  421. padding-bottom: 20px;
  422. }
  423.  
  424. .controlsreblog {
  425. color: {color:Post Text};
  426. box-sizing: border-box;
  427. float: right;
  428. border-bottom: 2px solid {color:Text};
  429. }
  430.  
  431. .timestamp {
  432. color: {color:Post Text};
  433. box-sizing: border-box;
  434. float: left;
  435. border-bottom: 2px solid {color:Text};
  436. }
  437.  
  438. .pagination {
  439. display: none;
  440. position: relative;
  441. width: 85%;
  442. max-width: 500px;
  443. text-align: center;
  444. margin: 0 auto;
  445. left: 0;
  446. bottom: 20px;
  447. color: {color:Post Text};
  448. }
  449.  
  450. /* info */
  451.  
  452. .info {
  453. padding: 0;
  454. color: {color:Post Text};
  455. }
  456.  
  457. .info a {
  458. color: {color:Post Text};
  459. }
  460.  
  461. .info a:hover {
  462. color: {color:Hover Color};
  463. }
  464.  
  465. .comma:last-child {
  466. display: none;
  467. }
  468.  
  469. .tags a {
  470. text-decoration: none;
  471. }
  472.  
  473. .tags a:hover {
  474. color: {color:Hover Color};
  475. }
  476.  
  477. .caption {
  478. padding: 0px 20px;
  479. background-color: {color:Posts};
  480. }
  481.  
  482. .caption img {
  483. max-width: 100%;
  484. height: auto;
  485. }
  486.  
  487. .permalink {
  488. padding: 20px;
  489. background-color: {color:Posts};
  490. }
  491.  
  492. /* notecontainer */
  493.  
  494. .notecontainer {
  495. padding-top: 20px;
  496. margin-top: 15px;
  497. background-color: {color:Posts};
  498. margin-bottom: 20px;
  499. }
  500.  
  501. .notecontainer ol.notes {
  502. list-style-type: none;
  503. padding-left: 20px;
  504. }
  505.  
  506. .notecontainer img.avatar {
  507. vertical-align: middle;
  508. width: 26px;
  509. margin: 6px 0;
  510. opacity: 0.6;
  511. -webkit-transition: 0.4s;
  512. transition: 0.4s;
  513. border-radius: 0;
  514. }
  515.  
  516. .notecontainer img.avatar:last-child {
  517. padding-right: 5px;
  518. }
  519.  
  520. .notecontainer img.avatar:hover {
  521. opacity: 1;
  522. }
  523.  
  524. .notecontainer ol.notes li.note {
  525. overflow: hidden;
  526. width: 38px;
  527. height: 38px;
  528. display: inline-block;
  529. }
  530.  
  531. .notecontainer ol.notes li.note:last-child {
  532. display: block;
  533. width: 225px;
  534. padding: 10px 0 30px;
  535. }
  536.  
  537. /* media screen */
  538.  
  539. @media only screen and (min-width: 900px) {
  540. .content {
  541. margin: 60px 40px 40px 530px;
  542. }
  543.  
  544. .entry {
  545. margin: 0px;
  546. float: left;
  547. width: 300px;
  548. display: -moz-inline-stack;
  549. display: inline-block;
  550. }
  551.  
  552. .post {
  553. margin: 0;
  554. }
  555.  
  556. .entry:nth-child(4n+0) {
  557. clear: left;
  558. }
  559.  
  560. aside {
  561. position: fixed;
  562. float: right;
  563. top: 0;
  564. left: 0;
  565. bottom: 0;
  566. margin: 0;
  567. width: 470px;
  568. padding: 80px 100px 40px;
  569. -moz-box-sizing: border-box;
  570. box-sizing: border-box;
  571. border-right: 1px solid {color:Borders};
  572. }
  573.  
  574. aside .sideimg {
  575. display: block;
  576. }
  577.  
  578. aside nav li {
  579. display: block;
  580. }
  581.  
  582. .pagination {
  583. margin: 0 40px;
  584. }
  585.  
  586. .taglist {
  587. padding-top: 10px;
  588. }
  589.  
  590. .taglist li {
  591. display: block;
  592. }
  593.  
  594. }
  595.  
  596. /* other */
  597.  
  598. #theme {
  599. position: fixed;
  600. font-size: 13px;
  601. right: 15px;
  602. bottom: 25px;
  603. width: 16px;
  604. height: 15px;
  605. padding: 2px 2px 3px;
  606. text-align: center;
  607. color: #929292;
  608. background-color: #ffffff;
  609. border-radius: 50%;
  610.  
  611. }
  612.  
  613. ::-webkit-scrollbar {
  614. width: 15px;
  615. height: 15px;
  616. }
  617.  
  618. ::-webkit-scrollbar {
  619. background-color: {color:Background};
  620. }
  621.  
  622. ::-webkit-scrollbar-track {
  623. background-color: {color:Background};
  624. border: 5px solid {color:Background};
  625. }
  626.  
  627. ::-webkit-scrollbar-thumb {
  628. background-color: {color:Scrollbar};
  629. border: 5px solid {color:Background};
  630. border-radius: 10px;
  631. min-height: 24px;
  632. min-width: 24px;
  633. }
  634.  
  635. ::-webkit-scrollbar-corner {
  636. background-color:{color:Background};
  637. }
  638.  
  639.  
  640. </style>
  641.  
  642. <!-- pixel union photoset for margins -->
  643. <link href="https://static.tumblr.com/qudkd6d/OcDnl99gb/style.css" rel="stylesheet" type="text/css"/>
  644. <script src="https://static.tumblr.com/qudkd6d/Az6nkemqr/pxuphotoset.min.js"></script>
  645.  
  646. <!-- feathericons.com -->
  647. <link href="https://static.tumblr.com/kmw8hta/oSwpvpnik/feather.css" rel="stylesheet">
  648.  
  649. <!-- nouvae responsive videos -->
  650. <script src="https://rawgit.com/robinpx/tumblr/master/scripts/flexibleFrames/flexibleFrames.min.js"></script>
  651.  
  652. <script>
  653.  
  654. $(document).ready(function() {
  655. flexibleFrames($(".video"));
  656. });
  657.  
  658. </script>
  659.  
  660. </head>
  661.  
  662. <body>
  663.  
  664. <aside>
  665.  
  666. {block:IfSidebarImage}
  667. <section>
  668. <a href="/"><img class="sideimg" src="{image:Sidebar}"></a>
  669. </section>
  670. {/block:IfSidebarImage}
  671.  
  672. <section>
  673.  
  674. {block:IfShowAvatar}
  675. <a href="/"><img src="{PortraitURL-128}" class="avatar {AvatarShape}"></a>
  676. {/block:IfShowAvatar}
  677.  
  678. <div class="title"><a href="/">{Title}</a></div>
  679.  
  680. <div class="description">{Description}</div>
  681.  
  682. </section>
  683.  
  684. <section><nav class="title">
  685.  
  686. {block:IfHome}
  687. <a href="/">{text:Home}</a>
  688. {/block:IfHome}
  689.  
  690. {block:AskEnabled}
  691. {block:IfAsk}
  692. <li><a href="/ask">{text:Ask}</a></li>
  693. {/block:IfAsk}
  694. {/block:AskEnabled}
  695.  
  696. {block:SubmissionsEnabled}
  697. {block:IfSubmit}
  698. <li><a href="/submit">{text:Submit}</a></li>
  699. {/block:IfSubmit}
  700. {/block:SubmissionsEnabled}
  701.  
  702. {block:IfArchive}
  703. <li><a href="/archive">{text:Archive}</a></li>
  704. {/block:IfArchive}
  705.  
  706. <!-- {block:HasPages}{block:Pages}
  707. <li><a href="{URL}">{Label}</a></li>
  708. {/block:Pages}{/block:HasPages} -->
  709.  
  710. {block:IfLinkOne}<li><a href="{text:Link One URL}">{text:Link One}</a>{/block:IfLinkOne}
  711.  
  712. {block:IfLinkTwo}<li><a href="{text:Link Two URL}">{text:Link Two}</a>{/block:IfLinkTwo}
  713.  
  714. {block:IfLinkThree}<li><a href="{text:Link Three URL}">{text:Link Three}</a>{/block:IfLinkThree}
  715.  
  716. </nav>
  717.  
  718. <div class="taglist">
  719. {block:IfTagOne}<li><a href="/tagged/{text:Tag One}">#{text:Tag One} </a></li>{/block:IfTagOne}
  720. {block:IfTagTwo}<li><a href="/tagged/{text:Tag Two}">#{text:Tag Two} </a></li>{/block:IfTagTwo}
  721. {block:IfTagThree}<li><a href="/tagged/{text:Tag Three}">#{text:Tag Three} </a></li>{/block:IfTagThree}
  722. </div>
  723.  
  724. </section>
  725.  
  726. </aside>
  727.  
  728. <div class="content"> {block:Posts}
  729.  
  730. <article class="entry" id="{PostID}">
  731.  
  732. <section class="post">
  733.  
  734. <span class="hv">
  735.  
  736. <a href="{Permalink}" class="accent button">
  737. <span class="fx fx-eye"></span> see post
  738. </a>
  739.  
  740. </span>
  741.  
  742. <!-- audio -->
  743. {block:Audio}
  744. <div class="audio">
  745.  
  746. {block:AudioPlayer}
  747. <div class="player">{AudioPlayer}</div>
  748. {/block:AudioPlayer}
  749.  
  750. {block:TrackName}
  751. <div class="track">{TrackName}
  752. {/block:TrackName}
  753. <br>
  754. {block:Artist}
  755. <span class="accent thin">— by {Artist}</span></div>
  756. {/block:Artist}
  757.  
  758. </div>
  759. {/block:Audio}
  760.  
  761. <!-- photo -->
  762. {block:Photo}
  763. <div class="media">
  764. {LinkOpenTag}
  765. <a href="{Permalink}">
  766. <img src="{PhotoURL-HighRes}"/></a>
  767. {LinkCloseTag}
  768. </div>
  769. {/block:Photo}
  770.  
  771. <!-- photoset -->
  772. {block:Photoset}
  773. <div class="media photoset">
  774.  
  775. {block:PermalinkPage}
  776. <!-- pixel union photosets -->
  777. <div class="photo-slideshow" id="photoset_{PostID}" data-layout="{PhotosetLayout}">
  778. {block:Photos}
  779. <div class="photo-data">
  780. <div class="pxu-photo">
  781. <img src="{PhotoURL-500}" width="{PhotoWidth-500}" height="{PhotoHeight-500}" data-highres="{PhotoURL-HighRes}" data-width="{PhotoWidth-HighRes}" data-height="{PhotoHeight-HighRes}">
  782. </div>
  783. <a class="tumblr-box" rel="post-{PostID}" href="{PhotoURL-HighRes}"></a>
  784. </div>{/block:Photos}
  785. </div>
  786. <!-- pxel union photoset ends -->
  787. {/block:PermalinkPage}
  788.  
  789. {block:ifFullPhotosets}
  790. {block:IndexPage}
  791.  
  792. <!-- pixel union photosets -->
  793. <div class="photo-slideshow" id="photoset_{PostID}" data-layout="{PhotosetLayout}">
  794. {block:Photos}
  795. <div class="photo-data">
  796. <div class="pxu-photo">
  797. <img src="{PhotoURL-500}" width="{PhotoWidth-500}" height="{PhotoHeight-500}" data-highres="{PhotoURL-HighRes}" data-width="{PhotoWidth-HighRes}" data-height="{PhotoHeight-HighRes}">
  798. </div>
  799. <a class="tumblr-box" rel="post-{PostID}" href="{PhotoURL-HighRes}"></a>
  800. </div>{/block:Photos}
  801. </div>
  802. <!-- pxel union photoset ends -->
  803.  
  804. {/block:IndexPage}
  805. {/block:ifFullPhotosets}
  806.  
  807. {block:ifNotFullPhotosets}
  808. {block:IndexPage}
  809. {block:Photos}<img src="{PhotoURL-HighRes}">
  810. <!--{/block:Photos}-->
  811. {/block:IndexPage}
  812. {/block:ifNotFullPhotosets}
  813.  
  814. </div>
  815. {/block:Photoset}
  816.  
  817. <!-- text -->
  818. {block:Text}
  819. {block:Title}<h1 class="text">{Title}</h1>{/block:Title}
  820. <div class="text">{Body}</div>
  821. {/block:Text}
  822.  
  823. <!-- quote -->
  824. {block:Quote}
  825. <div class="quote"><span class="mark">“ </span>{Quote}<span class="mark"> „</span></div>
  826. {block:Source}<div class="quotetext">— {Source}</div>{/block:Source}
  827. {/block:Quote}
  828.  
  829. <!-- video -->
  830. {block:Video}
  831. <div class="videowrap">
  832. <div class="video">
  833. {Video-250}
  834. </div></div>
  835. {/block:Video}
  836.  
  837. <!-- questions and answers -->
  838. {block:Answer}
  839. <div class="asker"><span class="title">{Asker}:</span><br/></div>
  840. <div class="question">{Question}<br/></div>
  841. <div class="answer">{Answer}</div>
  842. {/block:Answer}
  843.  
  844. <!-- chat posts -->
  845. {block:Chat}
  846. <div class="chat text">
  847. {block:Title}<div class="title">{Title}</div>{/block:Title}
  848. {block:Lines}
  849. {block:Label}<strong>{Label}</strong>{/block:Label} {Line}<br/>
  850. {/block:Lines}</div>
  851. {/block:Chat}
  852.  
  853. <!-- link posts -->
  854. {block:Link}<div class="link">
  855. <div class="linkname"><a href="{URL}">{Name}</a>
  856. <div class="linkdesc">{block:Excerpt}{Excerpt}{/block:Excerpt}</div></div>
  857. </div>{/block:Link}
  858.  
  859. <!-- info -->
  860. {block:Date}
  861. <div class="info">
  862.  
  863. {block:PermalinkPage}
  864. <div class="permalink">
  865.  
  866. {block:Date}<div class="controls title">
  867. <a href="{Permalink}" class="timestamp">{ShortMonth} {dayofmonth}{dayofmonthsuffix}</a>
  868.  
  869. <a href="{ReblogURL}" target="_blank" class="controlsreblog">
  870. <span class="fx fx-external-link"></span>
  871. Reblog</a>
  872. </div>{/block:Date}
  873.  
  874. <!-- caption -->
  875. {block:Caption}
  876. <div class="caption">
  877. {Caption}
  878. </div>
  879. {/block:Caption}
  880.  
  881. {block:RebloggedFrom}
  882. Via: <a href="{ReblogParentURL}">{ReblogParentName}</a><br>
  883. {block:ContentSource}
  884. Source: <a href="{ReblogRootURL}">{ReblogRootName}</a>
  885. {/block:ContentSource}
  886. {/block:RebloggedFrom}
  887.  
  888. <!-- tags -->
  889. {block:HasTags}
  890. <div class="tags">Tagged:
  891. {block:Tags}
  892. <a href="{TagURL}"> {Tag}</a><span class="comma">,</span>
  893. {/block:Tags}
  894. </div>
  895. {/block:HasTags}
  896. {/block:PermalinkPage}
  897. </div> {/block:Date}
  898.  
  899. </section>
  900.  
  901.  
  902. </article>
  903.  
  904. <!-- post notes -->
  905. {block:PostNotes}
  906. <article class="entry">
  907. <section class="post notecontainer">
  908. <span class="text title">{block:NoteCount}{NoteCountWithLabel}{/block:NoteCount}</span>
  909. {PostNotes-64}
  910. </section>
  911. </article>
  912. {/block:PostNotes}
  913.  
  914. {/block:Posts}
  915.  
  916. <!-- {block:ContentSource}{SourceURL}{/block:ContentSource}{block:RebloggedFrom}{ReblogRootURL}{ReblogParentURL}{/block:RebloggedFrom} -->
  917.  
  918. <!-- pagination -->
  919. <div class="pagination">
  920. {/block:Pagination}
  921. {block:PreviousPage}
  922. <a class="previous_page" href="{PreviousPage}">Previous /</a>
  923. {/block:PreviousPage}
  924.  
  925. {block:NextPage}
  926. <a class="next_page" href="{NextPage}"> Next page</a>
  927. {/block:NextPage}
  928.  
  929. </div>
  930. {/block:Pagination}
  931.  
  932.  
  933. </div> <!-- div class content end -->
  934.  
  935. <a id="theme" href="https://mangolias.tumblr.com/" target="_blank">+</a></div>
  936.  
  937. <!-- inf maso pixel union-->
  938. {block:IndexPage}
  939. <script src="https://static.tumblr.com/6hsqxdt/QBym35odk/jquery.masonry.js"></script>
  940. {block:ifInfiniteScroll}
  941. <script src="https://static.tumblr.com/wgijwsy/u2vm2hxv6/jquery.infinitescroll.min.js"></script>
  942. {/block:ifInfiniteScroll}
  943. {/block:IndexPage}
  944. <script>
  945. $(document).ready(function(){
  946. $('.photo-slideshow').pxuPhotoset({
  947. lightbox: true,
  948. rounded: false,
  949. gutter: '1px',
  950. photoset: '.photo-slideshow',
  951. photoWrap: '.photo-data',
  952. photo: '.pxu-photo'
  953. });
  954.  
  955. {block:IndexPage}
  956. var $container = $('.content');
  957. $container.masonry({ itemSelector: '.entry' });
  958. $container.imagesLoaded(function(){
  959. $container.masonry();
  960. $container.find('.entry').animate({ opacity: 1, zIndex: 1 });
  961. });
  962. {block:ifInfiniteScroll}
  963. $container.infinitescroll({
  964. itemSelector: '.entry',
  965. navSelector: '.pagination',
  966. nextSelector: '.next_page',
  967. loadingImg: '',
  968. loadingText: '<em></em>',
  969. bufferPx: 2000
  970. },
  971.  
  972. function( newElements ) {
  973. var $newElems = $( newElements );
  974. $newElems.find('.photo-slideshow').pxuPhotoset({
  975. lightbox: true,
  976. rounded: false,
  977. gutter: '1px',
  978. photoset: '.photo-slideshow',
  979. photoWrap: '.photo-data',
  980. photo: '.pxu-photo'
  981. },
  982. function(){
  983. $container.masonry();
  984. });
  985. $newElems.imagesLoaded(function(){
  986. $container.masonry( 'appended', $newElems );
  987. $newElems.animate({ opacity: 1, zIndex: 1 });
  988. });
  989.  
  990. });
  991.  
  992. {/block:ifInfiniteScroll}
  993. {/block:IndexPage}
  994. });
  995. </script>
  996.  
  997.  
  998. </body>
  999. </html>
Advertisement
Add Comment
Please, Sign In to add comment