emilycaldwell

nemo.html

Sep 25th, 2021
1,082
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. <!DOCTYPE html>
  2. <head>
  3.  
  4. <!------------------------------------------------------
  5.  
  6.     nemo @ wordbite
  7.    
  8.    - base code by sorrism
  9.    - no.js photosets by annasthms & espoirthemes
  10.    - scroll to top by paul underwood
  11.    - style my tooltips by malihu
  12.    - npf photoset fix by glenthemes
  13.    - timeAgo(); plugin by bychloethemes
  14.    - notecount shortener by shythemes
  15.    - smoothscroll by balazs galambosi
  16.    - outicons by anton saputro
  17.    - responsive iframes by nouvae
  18.    
  19. -------------------------------------------------------->
  20.  
  21. <meta name="viewport" content="width=device-width, initial-scale=1.0">
  22. <link rel="shortcut icon" href="{Favicon}">
  23. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  24. <title>{title} {block:TagPage}/ #{Tag}{/block:TagPage}{block:DayPage}/ @ {ShortMonth} {DayOfMonth}, {Year}{/block:DayPage} {block:PostSummary}/ {PostSummary}{/block:PostSummary}</title>
  25. {block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}
  26.  
  27. <meta name="image:Icon" content=""/>
  28.  
  29. <meta name="color:Background" content="#FFFFFF" />
  30. <meta name="color:Text" content="#000000" />
  31. <meta name="color:Links" content="#7B7B7B" />
  32. <meta name="color:Accent" content="#FB8C98" />
  33. <meta name="color:Borders" content="#EEEEEE" />
  34.  
  35. <meta name="select:Icon Shape" content="50%" title="circle" />
  36. <meta name="select:Icon Shape" content="5px" title="rounded" />
  37. <meta name="select:Icon Shape" content="0px" title="square" />
  38.  
  39. <meta name="if:Sidebar" content="" />
  40. <meta name="if:Hide Caption Icons" content="" />
  41. <meta name="if:Rounded Posts" content="" />
  42.  
  43. <meta name="text:Title" content="" />
  44. <meta name="text:Description" content="" />
  45.  
  46. <meta name="text:Google Font" content="Karla" />
  47.  
  48. <meta name="text:Font Size" content="13px" />
  49. <meta name="text:Post Width" content="540px" />
  50. <meta name="text:Sidebar Width" content="180px" />
  51. <meta name="text:Margin" content="150px" />
  52. <meta name="text:Photoset Gutter" content="3px" />
  53.  
  54. <meta name="text:Home Link" content="home" />
  55. <meta name="text:Ask Link" content="contact" />
  56. <meta name="text:Archive Link" content="archive" />
  57.  
  58. <meta name="text:Link 1 URL" content=""/>
  59. <meta name="text:Link 1" content=""/>
  60. <meta name="text:Link 2 URL" content=""/>
  61. <meta name="text:Link 2" content=""/>
  62. <meta name="text:Link 3 URL" content=""/>
  63. <meta name="text:Link 3" content=""/>
  64.  
  65. <!-- FONTS -->
  66.  
  67. <link href="https://fonts.googleapis.com/css?family={text:Google Font}:300,400,500,600,700|Karla:500" rel="stylesheet">
  68.  
  69. <!-- SCRIPTS -->
  70.  
  71. <link href="https://static.tumblr.com/0podkko/oDSpg7y88/photosets.css" rel="stylesheet">
  72. <link href='https://static.tumblr.com/m2fiocp/1fbqq9vgi/outicons.css' rel='stylesheet' type='text/css'>
  73. <script src="https://cdnjs.cloudflare.com/ajax/libs/smoothscroll/1.4.1/SmoothScroll.min.js"></script>
  74. <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
  75. <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
  76. <script src="https://static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script>
  77.  
  78. <!--
  79.       NPF IMAGES READJUSTMENT | @glenthemes
  80.       v2.0 [last updated: 2021-03-03]
  81. -->
  82. <link href="//dl.dropbox.com/s/bnoj86mka0bkplb/npf-override.css" rel="stylesheet">
  83. <script src="//dl.dropbox.com/s/vwrm94pcg4c9e71/npf-evenize.js"></script>
  84.  
  85. <style type="text/css">
  86. :root {
  87.     --NPF-Image-Spacing:{text:photoset gutter};
  88.     --NPF-Bottom-Gap-From-Captions:1em;
  89. }
  90. </style>
  91.  
  92. <script>
  93. $(document).ready(function() {
  94.   var $audio = $('iframe.tumblr_audio_player');
  95.   $audio.load(function() {
  96.     $(this).contents().find('head').append('<style type="text/css">' +
  97.       '.audio-player { background: transparent; color: {color:background} !important; }' +
  98.       '.simple-player .audio-player { width:27px; }' +
  99.       '.audio-player .progress { display:none; }' +
  100.     '</style>');
  101.   });
  102. });
  103. </script>
  104.  
  105. <script>
  106. function gatherData(images, arr) {
  107.   for (let i = 0; i < images.length; i++) {
  108.    let currentData = {
  109.      "width": images[i].getAttribute('data-width'),
  110.      "height": images[i].getAttribute('data-height'),
  111.      "low_res": images[i].getAttribute('data-lowres'),
  112.      "high_res": images[i].getAttribute('data-highres')
  113.    };
  114.    arr.push(currentData);
  115.  }
  116. }
  117. function getIndex(elem) {
  118.  let i = 0;
  119.  while( (elem = elem.previousElementSibling) != null ) i++;
  120.  return i;
  121. }
  122. function lightbox(elem) {
  123.  let currentPhotoset = elem.parentNode;
  124.  let photosetPhotos = currentPhotoset.getElementsByTagName('div');
  125.  let data = [];
  126.  gatherData(photosetPhotos, data);
  127.  Tumblr.Lightbox.init(data, getIndex(elem) + 1);
  128. }
  129. </script>
  130.  
  131. <script>
  132. $(document).ready(function(){
  133.     $(window).scroll(function(){
  134.         if ($(this).scrollTop() > 100) {
  135.             $('.top').fadeIn();
  136.         } else {
  137.             $('.top').fadeOut();
  138.         }
  139.     });
  140.    
  141.     $('.top').click(function(){
  142.         $('html, body').animate({scrollTop : 0},800);
  143.         return false;
  144.     });
  145.    
  146. });
  147. </script>
  148.  
  149. <script>
  150. (function($){
  151.     $(document).ready(function(){
  152.         $("[title]").style_my_tooltips({
  153.         tip_follows_cursor:true,
  154.         tip_delay_time:30,
  155.         tip_fade_speed:300,
  156.         attribute:"title"
  157.         });
  158.     });
  159. })(jQuery);
  160. </script>
  161.  
  162. <style type="text/css">
  163.  
  164. /* SELECTION */
  165.  
  166. ::-webkit-selection { background:{color:accent}; color:{color:background}; }
  167. ::-moz-selection{ background:{color:accent}; color:{color:background}; }
  168. ::selection { background:{color:accent}; color:{color:background}; }
  169.  
  170. ::marker { color:{color:accent}; }
  171.  
  172. /* LIGHTBOXES  */
  173.  
  174. .vignette, #vignette {
  175.     opacity:0;
  176. }
  177. .lightbox-image, #tumblr_lightbox img {
  178.     box-shadow:none!important;
  179.     border-radius:0!important;
  180.     max-width:none;
  181. }
  182.  
  183. .tmblr-lightbox, #tumblr_lightbox {
  184.     background-color:{color:background}D9!important;
  185. }
  186.  
  187. /* TOOLTIPS */
  188.  
  189. #s-m-t-tooltip {
  190.     position:absolute;
  191.     margin:1.4em;
  192.     text-transform:uppercase;
  193.     padding:1.1em;
  194.     border-radius:3px;
  195.     background:{color:accent};
  196.     color:{color:background};
  197.     letter-spacing:0.1em;
  198.     font:0.8em/0.8em karla, sans-serif;
  199.     font-weight:500;
  200. }
  201.  
  202. /* BASIC STYLES */
  203.  
  204. html {
  205.     -webkit-font-smoothing:antialiased;
  206.     -moz-osx-font-smoothing:grayscale;
  207. }
  208.  
  209. body {
  210.     font-family:'{text:google font}', sans-serif;
  211.     font-size:{text:font size};
  212.     line-height:2.5em;
  213.     letter-spacing:0.2px;
  214.     word-break:break-word;
  215.     background:{color:background};
  216.     color:{color:text};
  217. }
  218.  
  219. a {
  220.     cursor:help;
  221.     text-decoration:none;
  222.     color:{color:links};
  223.     transition:all 0.3s ease-in-out;
  224. }
  225.  
  226. a:hover {
  227.     color:{color:accent};
  228.     transition:all 0.3s ease-in-out;
  229. }
  230.  
  231. pre {
  232.     white-space:normal;
  233. }
  234.  
  235. small, big, sub, pre {
  236.     font-size:{text:font size}!important;
  237.     vertical-align:baseline!important;
  238. }
  239.  
  240. blockquote {
  241.     border-left:1px solid {color:borders};
  242.     margin:1.5em 0;
  243.     padding-left:1em;
  244. }
  245.  
  246. hr {
  247.     border:none;
  248.     box-shadow:0;
  249.     margin:2em 0;
  250.     width:100%;
  251.     border-top:1px solid {color:borders};
  252. }
  253.  
  254. ul { max-width:100%; list-style-type:circle; margin-left:-20px; }
  255. ol { max-width:100%; list-style-type:decimal-leading-zero; margin-left:-20px; }
  256.  
  257. /* FORMATTING */
  258.  
  259. section {
  260.     position:relative;
  261.     width:{text:post width};
  262.     margin:{text:margin} auto auto;
  263. }
  264.  
  265. .posts {
  266.     position:relative;
  267.     width:auto;
  268.     width:{text:post width};
  269.     margin:{text:margin} auto;
  270. }
  271.  
  272. header {
  273.     position:relative;
  274.     width:{text:post width};
  275.     margin:0 auto;
  276.     text-align:center;
  277.     {block:ifSidebar}
  278.     align-items:flex-end;
  279.     position:fixed;
  280.     width:{text:sidebar width};
  281.     margin-left:calc(-{text:margin} + -{text:sidebar width});
  282.     text-align:right;
  283.     {/block:ifSidebar}
  284. }
  285.  
  286. /* HEADER */
  287.  
  288. .icon {
  289.     display:block;
  290.     position:relative;
  291.     margin-bottom:1.5em;
  292.     line-height:1em;
  293. }
  294.  
  295. .icon img {
  296.     width:40px;
  297.     height:40px;
  298.     border-radius:{select:icon shape};
  299.     object-fit:cover;
  300. }
  301.  
  302. #blogtitle {
  303.     display:inline-block;
  304.     font-size:1.3em;
  305.     font-weight:bold;
  306.     line-height:1.2em;
  307.     color:{color:accent};
  308.     margin:0 0 1.5em;
  309. }
  310.  
  311. #blogtitle a { color:{color:accent}; }
  312. #blogtitle a:hover { color:{color:text}; }
  313.  
  314. #description { margin:0 0 1.5em; }
  315. #description a { color:{color:accent}; }
  316. #description a:hover { color:{color:text}; }
  317.  
  318. nav a {
  319.     display:inline-block;
  320.     border:0;
  321. }
  322.  
  323. nav span {
  324.     display:inline-block;
  325.     margin:0 0.5em;
  326.     {block:ifSidebar}
  327.     display:block;
  328.     margin:0;
  329.     {/block:ifSidebar}
  330. }
  331.  
  332. /* TEXT */
  333.  
  334. .title { font-size:1.1em; line-height:1em; font-weight:bold; }
  335. .title, .title a {
  336.     color:{color:text};
  337. }
  338.  
  339. /* PHOTO & PHOTOSET */
  340.  
  341. .ph img,
  342. .tmblr-full img, figure, video, iframe,
  343. .video, .video iframe,
  344. figure.tmblr-embed.tmblr-full,
  345. figure.tmblr-embed.tmblr-full iframe  {
  346.    width:100%;
  347.     display:block;
  348.     {block:ifRoundedPosts}
  349.     border-radius:5px;
  350.     {/block:ifRoundedPosts}
  351. }
  352.  
  353. [photoset-layout] {
  354.   grid-gap:{text:photoset gutter};
  355. }
  356.  
  357. [photoset-layout] div {
  358.   cursor:help;
  359. }
  360.  
  361. {block:ifRoundedPosts}
  362. [photoset-layout] img {
  363.     border-radius:0;
  364. }
  365.  
  366. div[photoset-layout] {
  367.     border-radius:5px;
  368.     overflow:hidden;
  369. }
  370. {/block:ifRoundedPosts}
  371.  
  372. /* AUDIO */
  373.  
  374. .spotify_audio_player {
  375.     height:80px;
  376.     width:100%!important;
  377. }
  378.  
  379. .soundcloud_audio_player {
  380.     max-height:116px!important;
  381. }
  382.  
  383. .bandcamp_audio_player {
  384.     height:120px!important;
  385.     width:100%!important;
  386. }
  387.  
  388. .player {
  389.     display:inline-block;
  390.     width:27px;
  391.     padding-right:20px;
  392. }
  393.  
  394. .player-wrap {
  395.     display:flex;
  396.     align-items:center;
  397.     justify-content:space-between;
  398.     background:{color:accent};
  399.     padding:15px;
  400.     {block:ifRoundedPosts}
  401.     border-radius:5px;
  402.     {/block:ifRoundedPosts}
  403. }
  404.  
  405. .audio-info {
  406.     display:inline-block;
  407.     color:{color:background};
  408.     margin-right:5px;
  409.     width:fit-content;
  410.     text-align:right;
  411.     line-height:1.75em;
  412. }
  413.  
  414. .track .oi, .artist .oi {
  415.     vertical-align:middle;
  416.     font-size:1.25em;
  417.     margin-left:0.75em;
  418. }
  419.  
  420. /* VIDEO */
  421.  
  422. .video, .tmblr-full > video {
  423.     width:{text:post width};
  424. }
  425.  
  426. /* QUOTE */
  427.  
  428. .quote {
  429.     font-size:1.2em;
  430.     font-weight:bold;
  431.     position:relative;
  432. }
  433.  
  434. .source {
  435.     margin-bottom:0.5em;
  436. }
  437.  
  438. /* CHAT */
  439.  
  440. .chat {
  441.     margin:0;
  442.     padding:0;
  443.     list-style:none;
  444. }
  445.  
  446. .label {
  447.     font-weight:bold;
  448. }
  449.  
  450. /* ASK */
  451.  
  452. .asker, .asker a {
  453.     line-height:1em;
  454.     font-weight:bold;
  455.     color:{color:text};
  456.     text-transform:lowercase;
  457.     border:0!important;
  458.     margin:0;
  459. }
  460.  
  461. .asker a:hover { color:{color:accent}; }
  462.  
  463. .question {
  464.     position:relative;
  465.     color:{color:background};
  466.     background:{color:accent};
  467.     padding:1em 1.5em;
  468.     margin:1em 0 2em;
  469.     border-radius:5px;
  470. }
  471.  
  472. .question:after {
  473.     display:block;
  474.     content:'';
  475.     position:absolute;
  476.     top:-10px;
  477.     left:15px;
  478.     width:0;
  479.     border-width:0px 10px 10px;
  480.     border-style:solid;
  481.     border-color:{color:accent} transparent;
  482. }
  483.  
  484. .question p:first-of-type {margin-top: 0;}
  485. .question p:last-of-type {margin-bottom: 0;}
  486.  
  487. /* CAPTION */
  488.  
  489. .caption { list-style-type:none;margin:2em 0 0; }
  490. .comment a { border-bottom:1px solid {color:accent}; }
  491. .user { display: inline-block; vertical-align: middle; }
  492. a.user:hover { color:{color:accent}; }
  493. .user-icon {
  494.     {block:ifHideCaptionIcons}
  495.     display:none;
  496.     {/block:ifHideCaptionIcons}
  497.     vertical-align:middle;
  498.     margin-right:8px;
  499.     border-radius:50%;
  500.     width:20px;
  501.     height:20px;
  502. }
  503.  
  504. .deactive::after {
  505.     content:'(deactivated)';
  506.     margin-left:0.5em;
  507.     opacity:0.75;
  508.     color:{color:text};
  509. }
  510.  
  511. /* PERMALINK */
  512.  
  513. .post-info {
  514.     display:block;
  515.     margin:1.5em 0 0;
  516. }
  517.  
  518. .date {
  519.     display:inline-block;
  520.     margin:0 1em 0 0;
  521. }
  522.  
  523. .date a {
  524.     color:{color:text};
  525. }
  526.  
  527. .date a:hover {
  528.     color:{color:accent};
  529. }
  530.  
  531. .date:first-of-type {
  532.     font-weight:bold;
  533. }
  534.  
  535. .likeb {
  536.     position:relative;
  537.     display:inline-block;
  538. }
  539.  
  540. .likeb .like_button iframe {
  541.     position:absolute;
  542.     margin:0;
  543.     z-index:2;
  544.     opacity:0;
  545. }
  546.  
  547. .like_button iframe {width:100%!important; height:100%!important;}
  548. .likeb .liked + .actual-button {color:{color:accent};}
  549. .likeb .liked + .actual-button:after {content:'d';}
  550.  
  551. .tags { display:block; }
  552. .tags a { display:inline; margin:0 1em 0 0; }
  553.  
  554. /* notes */
  555. ol.notes { padding:0; display:block; }
  556. .notes img, .notes-source img { display:inline-block; vertical-align:middle; width:20px; border-radius:50%; margin-right:1em; }
  557. li.note { display:block; margin:0 0 0 20px; padding:1em 0; border-top:1px solid {color:borders}; width:100%; }
  558. .notes-source { padding:1em 0; border-bottom:1px solid {color:borders}; }
  559. .notes-date { padding-top:1em; }
  560. .notes-date:before { content:''; background:{color:accent}; display:inline-block; vertical-align:middle; width:20px; height:20px; border-radius:50%; margin-right:1em; }
  561. li.note blockquote { padding:0 0 0 1em; margin:0.5em 0 0.5em 0.5em; }
  562. a.more_notes_link,.notes_loading { color:{color:text}; text-transform:lowercase; font-weight:bold; text-align:left!important; }
  563. a.more_notes_link:hover { color:{color:accent}; }
  564. .more_notes_link,.notes_loading {
  565.     display:inline-block;
  566.     width:inherit;
  567.     margin-top:0em;
  568. }
  569.  
  570. .more_notes_link:before,.notes_loading:before { content:''; background:{color:accent}; display:inline-block; vertical-align:middle; width:20px; height:20px; border-radius:50%; margin-right:1em; }
  571.  
  572. /* PAGINATION  */
  573.  
  574. footer { display:flex; align-items:center; justify-content:space-between; margin:{text:margin} 0; }
  575.  
  576. footer .oi {
  577.     font-size:1.5em;
  578. }
  579.  
  580. /* CUSTOM CSS */
  581.  
  582. {CustomCSS}
  583.  
  584. /* MEDIA QUERIES */
  585.  
  586. @media only screen and (max-width:1100px) {
  587.     section, .posts, header {
  588.         width:{text:post width};
  589.         margin:{text:margin} auto;
  590.     }
  591.    
  592.     header {
  593.         position:relative;
  594.         width: {text:post width};
  595.         margin:0 auto;
  596.         text-align:center;
  597.     }
  598.    
  599.     nav span {
  600.         display:inline-block;
  601.         margin:0 0.5em;
  602.     }
  603. }
  604.  
  605. @media only screen and (max-width: 720px) {
  606.     section, .posts, header, footer {
  607.         width:80vw;
  608.         margin:100px auto;
  609.     }
  610.    
  611.     .video, .tmblr-full > video {
  612.         width:80vw;
  613.     }
  614.    
  615.     .audio-info {
  616.         width:calc(80vw - 80px);
  617.         white-space:nowrap;
  618.         overflow:hidden;
  619.         text-overflow:ellipsis;
  620.     }
  621.  
  622.     .iframe-controls--phone-mobile {display: none!important;}
  623.     .tmblr-iframe-pushdown {padding-top: 0!important;}
  624.     .tmblr-iframe--app-cta-button {display: none!important;}
  625. }
  626.  
  627. /* CREDIT */
  628.  
  629. .credit .oi,.top .oi { font-size:21px; margin:0; }
  630. .top { left:1em; bottom:1em; display:none; }
  631. .credit { bottom:1em; right:1em; }
  632.  
  633. .top, .credit {
  634.     position:fixed;
  635.     line-height:1em;
  636.     padding:5px;
  637.     background-color:{color:background};
  638.     border-radius:3px;
  639. }
  640.  
  641. </style>
  642. </head>
  643. <body>
  644.  
  645. <section id="entries">
  646.  
  647. <header>
  648.     {block:ifIconImage}
  649.     <div class="icon"><img src="{image:Icon}"></div>
  650.     {/block:ifIconImage}
  651.     {block:ifTitle}
  652.     <div id="blogtitle"><a href="/">{text:Title}</a></div>
  653.     {/block:ifTitle}
  654.     {block:ifDescription}
  655.     <div id="description">{text:Description}</div>
  656.     {/block:ifDescription}
  657.     <nav>
  658.     {block:ifHomeLink}<span><a href="/">{text:home link}</a></span>{/block:ifHomeLink}
  659.     {block:ifAskLink}<span><a href="/ask">{text:ask link}</a></span>{/block:ifAskLink}
  660.     {block:ifArchiveLink}<span><a href="/archive">{text:archive link}</a></span>{/block:ifArchiveLink}
  661.     {block:HasPages}{block:Pages}<span><a href="{URL}">{Label}</a></span>{/block:Pages}{/block:HasPages}
  662.     {block:ifLink1}<span><a href="{text:Link 1 URL}">{text:Link 1}</a></span>{/block:ifLink1}
  663.     {block:ifLink2}<span><a href="{text:Link 2 URL}">{text:Link 2}</a></span>{/block:ifLink2}
  664.     {block:ifLink3}<span><a href="{text:Link 3 URL}">{text:Link 3}</a></span>{/block:ifLink3}
  665.     </nav>
  666. </header>
  667.  
  668. {block:posts}
  669.     <div class="posts {block:caption}captioned{/block:caption}" post-type="{PostType}">
  670.  
  671. <!-- {block:NoRebloggedFrom}
  672. {block:RebloggedFrom}{ReblogParentName}{/block:RebloggedFrom}
  673. {/block:NoRebloggedFrom} -->    
  674. {block:ContentSource}<!-- {SourceURL}
  675. {block:SourceLogo}<img src="{BlackLogoURL}"width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" />{/block:SourceLogo}
  676. {block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo} -->
  677. {/block:ContentSource}
  678.  
  679. {block:Quote}
  680. {block:Source}<div class="source">{source} said:</div>{/block:Source}
  681. <div class="quote">{quote}</div>
  682. {/block:Quote}
  683.  
  684. {block:Text}
  685. {block:Title}<div class="title">{Title}</div>{/block:Title}
  686. {block:RebloggedFrom}
  687.     {block:Reblogs}
  688.         <li class="caption">
  689.         <img src="{PortraitURL-64}" class="user-icon">
  690.             <a {block:haspermalink}href="{permalink}"{/block:haspermalink} class="user {block:IsDeactivated}deactive{/block:IsDeactivated}" target="_blank">{username}</a>
  691.             <div class="comment">{body}</div>
  692.         </li>
  693.     {/block:Reblogs}
  694. {/block:RebloggedFrom}
  695. {block:NotReblog}
  696.     <li class="caption">
  697.         <div class="comment">{body}</div>
  698.     </li>
  699. {/block:NotReblog}
  700. {/block:Text}
  701.  
  702. {block:Link}
  703. <a class="link" href="{URL}">
  704.     <span>{name} <i class="oi oi-link"></i></span>
  705. </a>
  706. {block:Excerpt}<div>{Excerpt}</div>{/block:Excerpt}
  707.     {block:NotReblog}
  708.         <div class="caption">
  709.             <div class="comment">{description}</div>
  710.         </div>
  711.     {/block:NotReblog}
  712. {/block:Description}
  713. {block:RebloggedFrom}
  714.     {block:Reblogs}
  715.         <li class="caption">
  716.         <img src="{PortraitURL-64}" class="user-icon">
  717.             <a {block:haspermalink}href="{permalink}"{/block:haspermalink} class="user {block:IsDeactivated}deactive{/block:IsDeactivated}" target="_blank">{username}</a>
  718.             <div class="comment">{body}</div>
  719.         </li>
  720.     {/block:Reblogs}
  721. {/block:RebloggedFrom}
  722. {/block:Link}
  723.  
  724. {block:Chat}
  725. {block:Title}<div class="title">{Title}</div>{/block:Title}
  726. <ol class="chat text">
  727. {block:Lines}
  728. <li class="line {Alt}">
  729. {block:Label}<span class="label">{Label}</span>{/block:Label}
  730. {Line}
  731. </li>
  732. {/block:Lines}
  733. </ol>
  734. {/block:Chat}
  735.  
  736. <div class="ph">
  737.  
  738. {block:Photo}
  739. <a class="photo" 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}"></a>
  740. {/block:Photo}
  741.  
  742. {block:Photoset}
  743. <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}" /></div>{/block:Photos}</div>
  744. {/block:Photoset}
  745.  
  746. {block:Video}
  747. <div class="video">{Video-500}</div>
  748. {/block:Video}
  749.  
  750. </div>
  751.  
  752. {block:Audio}
  753. <div class="audio">
  754.     <div class="player-wrap">
  755.         <div class="player">
  756.             {block:AudioPlayer}
  757.                 {AudioPlayer}
  758.             {/block:AudioPlayer}
  759.         </div>
  760.         <div class="audio-info">
  761.             <div class="track">{block:TrackName}<strong>{TrackName}</strong><i class="oi oi-playlist"></i>{/block:TrackName}</div>
  762.             <div class="artist">{block:Artist}{Artist}<i class="oi oi-disc"></i>{/block:Artist}</div>
  763.         </div>
  764.     </div>
  765. </div>
  766. {/block:Audio}
  767.  
  768. {block:caption}
  769.     {block:Reblogs}
  770.         <li class="caption">
  771.         <img src="{PortraitURL-64}" class="user-icon">
  772.             <a {block:haspermalink}href="{permalink}"{/block:haspermalink} class="user {block:IsDeactivated}deactive{/block:IsDeactivated}" target="_blank">{username}</a>
  773.             <div class="comment">{body}</div>
  774.         </li>
  775.     {/block:Reblogs}
  776.     {block:NotReblog}
  777.         <li class="caption">
  778.             <div class="comment">{caption}</div>
  779.         </li>
  780.     {/block:NotReblog}
  781. {/block:caption}
  782.  
  783. {block:Answer}
  784. <div class="q">
  785.     <span class="asker"><a>{asker}</a></span>
  786.     <div class="question">{question}</div>
  787. </div>
  788. {block:Answerer}
  789.     <div class="comment">
  790.         <div class="asker">{answerer}</div>
  791.         {answer}
  792.     </div>
  793. {/block:Answerer}
  794. {block:NotReblog}
  795.     <div class="comment">
  796.         {replies}
  797.     </div>
  798. {/block:NotReblog}
  799. {block:RebloggedFrom}
  800.     {block:Reblogs}
  801.         <div class="comment">
  802.             <a {block:haspermalink}href="{permalink}"{/block:haspermalink} class="asker" target="_blank">{username}</a>
  803.             {body}
  804.         </div>
  805.     {/block:Reblogs}
  806. {/block:RebloggedFrom}
  807. {/block:Answer}
  808.  
  809. {block:Date}
  810. <div class="post-info">
  811.     {block:PinnedPostLabel}
  812.     <div class="date"><a href="{Permalink}">pinned post</a></div>
  813.     {/block:PinnedPostLabel}
  814.     {block:NoteCount}
  815.     <div class="date"><a href="{Permalink}" class="notecount">{NoteCount} notes</a></div>
  816.     {/block:NoteCount}
  817.     <div class="date"><a href="{Permalink}" class="time-ago">{Timestamp}</a></div>
  818.     <div class="date"><a href="{ReblogURL}">reblog</a></div>
  819.     <div class="date"><a class="likeb" href="#">{LikeButton}<span class="actual-button">like</span></a></div>
  820. </div>
  821. {block:hastags}
  822.         <span class="tags">{block:Tags}<a href="{TagUrl}">{Tag}</a>{/block:Tags}</span>
  823.     {/block:hasTags}
  824. {/block:Date}
  825.  
  826. </div>
  827.  
  828. {block:PostNotes}
  829. <article class="posts">
  830.     <div class="pagenotes">
  831.         {block:NotReblog}
  832.         <div class="notes-source"><img src="{PortraitURL-24}">original post by <a href="{ReblogParentURL}">{Name}</a></div>
  833.     {/block:NotReblog}
  834.     {block:RebloggedFrom}
  835.         <div class="notes-source"><img src="{ReblogParentPortraitURL-24}">reblogged from <a href="{ReblogParentURL}">{ReblogParentName}</a></div>
  836.         {block:ContentSource}
  837.         <div class="notes-source"><img src="{ReblogRootPortraitURL-24}">originally by <a href="{ReblogRootURL}">{ReblogRootName}</a></div>
  838.         {/block:ContentSource}
  839.     {/block:RebloggedFrom}
  840.     </div>
  841.     <div class="notes-date">posted at <a href="{Permalink}">{12Hour}:{Minutes}:{Seconds} {CapitalAmPm}</a> on <a href="{Permalink}">{ShortDayOfWeek}, {ShortMonth}. {DayOfMonthWithZero}{DayOfMonthSuffix} {Year}</a>
  842.     </div>
  843.     {PostNotes}
  844. </article>
  845. {/block:PostNotes}
  846.  
  847. {/block:Posts}
  848.  
  849. {block:Pagination}
  850. <footer>
  851. {block:PreviousPage}
  852.     <span><a href="{PreviousPage}"><i class="oi oi-chevron-left"></i></a></span>
  853. {/block:PreviousPage}
  854.     <span>{CurrentPage} / {TotalPages}</span>
  855. {block:NextPage}
  856.     <span><a href="{NextPage}"><i class="oi oi-chevron-right"></i></a></span>
  857. {/block:NextPage}
  858. </footer>
  859. {/block:Pagination}
  860.  
  861. </section>
  862.  
  863. <script type="text/javascript" src="https://static.tumblr.com/i5s2zks/9Acok8oo2/bct-timeago.min.js"></script>
  864. <script>
  865. $('section').find('.notecount').each(function(){
  866.    var n = $(this).html().split(' ')[0].replace(/,/g, '');
  867.    if (n > 999) {
  868.        n = Math.floor(n / 100) / 10;
  869.        $(this).text(n + 'k notes');
  870.    }
  871. });
  872.  
  873. $(".time-ago").timeAgo({
  874.     time: "word",
  875.     spaces: true,
  876.     words: false,
  877.     suffix: "ago",
  878. });
  879. </script>
  880.  
  881. <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
  882. <script src="https://rawgit.com/robinpx/tumblr/master/scripts/flexibleFrames/flexibleFrames.min.js"></script>
  883.  
  884. <script>
  885. $(document).ready(function() {
  886.   flexibleFrames($(".video"));
  887. });
  888. </script>
  889.  
  890. </body>
  891.  
  892. <a href="#" title="back to top" class="top"><i class="oi oi-arrow-up"></i></a>
  893.  
  894. <div class="credit"><a href="https://wordbite.tumblr.com" title="nemo @ wordbite"><i class="oi oi-smile"></i></a></div>
  895.  
  896. </html>
RAW Paste Data