emilycaldwell

tempo.html

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