Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- <!DOCTYPE html>
- <!---
- state of grace @ hawkinsgrocery.tumblr.com
- basecode: seyche
- PLEASE DO NOT:
- remove the credits;
- claim as your own;
- use as a base, take parts of the theme, repost as your own
- YOU CAN:
- edit as much as you want for your own personal use only.
- --->
- <html>
- <head>
- <title>{Title} {block:TagPage}/ #{Tag}{/block:TagPage}{block:PostSummary}: {PostSummary}{/block:PostSummary}</title>
- <link rel="shortcut icon" href="{Favicon}">
- <link rel="alternate" type="application/rss+xml" href="{RSS}">
- {block:Description}<meta name="description" content="{MetaDescription}"/>{/block:Description}
- <meta charset="utf-8">
- <meta name="viewport" content="width=device-width, initial-scale=1.0">
- <!-- scripts -->
- <link href='https://static.tumblr.com/m2fiocp/rlrqq9wlt/outicons.css' rel='stylesheet' type='text/css'>
- <link href="https://fonts.googleapis.com/css?family=Karla:400,400italic,700,700italic,900,900italic" rel="stylesheet">
- <link href="https://fonts.googleapis.com/css?family=Poppins:400,400italic,700,700italic,900,900italic" rel="stylesheet">
- <link href="https://fonts.googleapis.com/css?family=Quicksand:400,400italic,700,700italic,900,900italic" rel="stylesheet">
- <!----- VARIABLES AND OPTIONS ----->
- <meta name="image:Sidebar" content=""/>
- <meta name="color:Background" content="#ffffff"/>
- <meta name="color:Text" content="#707070"/>
- <meta name="color:Link" content="#313131"/>
- <meta name="color:Accent" content="#f2a8d7"/>
- <meta name="color:Borders" content="#e3e3e3">
- <meta name="select:Font" content="Karla" title="Karla"/>
- <meta name="select:Font" content="Poppins" title="Poppins"/>
- <meta name="select:Font" content="Quicksand" title="Quicksand"/>
- <meta name="select:Font Size" content="12px" title="12px"/>
- <meta name="select:Font Size" content="13px" title="13px"/>
- <meta name="select:Font Size" content="14px" title="14px"/>
- <meta name="select:Font Size" content="15px" title="15px"/>
- <meta name="select:Font Size" content="16px" title="16px"/>
- <meta name="select:Font Size" content="17px" title="17px"/>
- <meta name="select:Font Size" content="18px" title="18px"/>
- <meta name="select:Border Style" content="solid" title="solid">
- <meta name="select:Border Style" content="dotted" title="dotted">
- <meta name="select:Border Style" content="dashed" title="dashed">
- <meta name="select:Border Style" content="double" title="double">
- <meta name="select:Border Style" content="ridge" title="ridge">
- <meta name="text:Border Size" content="1px"/>
- <meta name="select:Post Width" content="400px" title="400px"/>
- <meta name="select:Post Width" content="500px" title="500px"/>
- <meta name="select:Post Width" content="540px" title="540px"/>
- <meta name="if:Borders" content="0" />
- <meta name="text:Post Margin" content="150"/>
- <meta name="if:Sidelinks on one line" content="">
- <meta name="text:Home Link" content="home"/>
- <meta name="text:Ask Link" content="ask"/>
- <meta name="text:Archive Link" content="archive"/>
- <meta name="text:Submit Link" content=""/>
- <meta name="text:Link 1 URL" content=""/>
- <meta name="text:Link 1" content=""/>
- <meta name="text:Link 2 URL" content=""/>
- <meta name="text:Link 2" content=""/>
- <meta name="text:Link 3 URL" content=""/>
- <meta name="text:Link 3" content=""/>
- <meta name="text:Link 4 URL" content=""/>
- <meta name="text:Link 4" content=""/>
- <meta name="text:Link 5 URL" content=""/>
- <meta name="text:Link 5" content=""/>
- <!-- custom icons -->
- <link href="//solrainha.github.io/saturnicons/saturnicons.css" rel="stylesheet">
- <!-- custom icons -->
- <!-- script -->
- <link href='https://static.tumblr.com/m2fiocp/rlrqq9wlt/outicons.css' rel='stylesheet' type='text/css'>
- <!----- CSS ----->
- <style type="text/css">
- /*----- BASIC STYLING -----*/
- body {
- font-family: '{select:font}', sans-serif;
- font-size: {select:font size};
- color: {color:text};
- background-color: {color:background};
- line-height: 160%;
- word-wrap: break-word;
- letter-spacing: 0.04em;
- margin: 0;
- padding: 0;
- }
- a {
- color: {color:link};
- text-decoration: none;
- -webkit-transition: all 0.3s;
- -moz-transition: all 0.3s;
- -ms-transition: all 0.3s;
- -o-transition: all 0.3s;
- transition: all 0.3s;
- }
- a:hover {
- color: {color:accent};
- -webkit-transition: all 0.3s;
- -moz-transition: all 0.3s;
- -ms-transition: all 0.3s;
- -o-transition: all 0.3s;
- transition: all 0.3s;
- }
- blockquote {
- padding: 0 0 0 1.5em;
- margin: 1.5em 0 1.5em 1.5em;
- border-left:{text:Border Size} {select:Border Style} {color:Borders};
- }
- h1, h2, h3, h4, h5, .title {
- font-size: {select:font size};
- letter-spacing: 0.06em;
- line-height: 115%;
- font-weight: bold;
- }
- h1, .title {font-size: 1.5em;}
- h2 {font-size: 1.3em;}
- h3 {font-size: 1.25em;}
- h4 {font-size: 1.1em;}
- h5 {font-size: 1em;}
- small {font-size: 0.9em;}
- big {font-size: 1.1em;}
- hr {
- height: 1px;
- box-shadow: none;
- border-width: {text:Border Size} 0px 0px 0px;
- border-style: {select:Border Style};
- border-color: {color:Borders};
- }
- pre {
- line-height: inherit;
- font-size: inherit;
- white-space: pre-wrap;
- white-space: -moz-pre-wrap;
- white-space: -pre-wrap;
- white-space: -o-pre-wrap;
- word-wrap: break-word;
- }
- .tmblr-iframe-compact .tmblr-iframe--unified-controls {z-index: 999999999!important;}
- .navbg {
- box-sizing: border-box;
- padding: 2em;
- background-color: {color:nav background};
- color: {color:nav links};
- {block:ifNotSolidPosts}
- {block:ifRoundedCorners}border-radius: 8px;{/block:ifRoundedCorners}
- {/block:ifNotSolidPosts}
- }
- .navbg a {color: {color:nav links};}
- .navbg a:hover {color: {color:accent};}
- .navbg .title, .navbg .subtitle, .navbg.subtitle {color: {color:nav title};}
- /* borders on date info, asks, under description title and quote */
- .short-border { /* info border */
- border-color: {color:Borders};
- display: inline-block;
- width:35px;
- margin:-8px 5px;
- border-width: {text:Border Size} 0px 0px 0px;
- border-style: {select:Border Style};
- vertical-align:middle;
- }
- .short-border2 {
- border-color: {color:Borders};
- display: inline-block;
- width:85px;
- color:{color:accent};
- margin:25px 0 5px;
- border-width: {text:Border Size} 0px 0px 0px;
- border-style: {select:Border Style};
- vertical-align:bottom;
- }
- /*----- SIDEBAR -----*/
- #sidebar {
- width:110px;
- display:block;
- position:fixed;
- padding-right:100px;
- margin-left:50px;
- margin-bottom:50px;
- text-align:right;
- font-size:10px;
- }
- {block:ifSidebarImage}
- #side-img {
- display:inline-block;
- margin:10px 0;
- max-width:50px;
- border-radius: 10%;
- }
- {/block:ifSidebarImage}
- #description, nav {margin-top: 1.25em;}
- nav a {
- margin-top:-2px
- display:inline-block;
- padding-right:5px;
- {block:IfNotSidelinksOnOneLine}
- display:block;
- padding:0px;
- margin-right:0px;
- {/block:IfNotSidelinksOnOneLine}
- {block:IfSidelinksOnOneLine}
- display:inline;
- {/block:IfSidelinksOnOneLine}
- }
- nav a:after {
- content:'⊹';
- color:{color:accent};
- margin-left:7px;
- font-weight:600;
- display:inline-block;
- }
- /*----- POSTS -----*/
- main {
- position: relative;
- width: calc(250px + {select:post width} + 150px);
- margin: auto;
- margin-top: -50px;
- {block:ifBorders}
- border: {text:Border Size} {select:Border Style} {color:Borders};
- {/block:ifBorders}
- }
- section {
- position: relative;
- width: {select:post width};
- margin-left: 400px;
- }
- article {
- width: 100%;
- position: relative;
- margin: {text:post margin}px auto;
- }
- .posts li, .posts blockquote, figure, video, iframe, .video, .video iframe, figure.tmblr-embed.tmblr-full, figure.tmblr-embed.tmblr-full iframe, .caption iframe {
- max-width: 100%;
- {block:ifCaptionBorder}
- outline: {text:Border Size} {select:Border Style} {color:Borders};
- {/block:ifCaptionBorder}
- }
- /*----- CAPTIONS -----*/
- .caption {
- margin-top: 2em;
- list-style-type: none;
- {block:ifCaptionBorder}
- outline: {text:Border Size} {select:Border Style} {color:Borders};
- {/block:ifCaptionBorder}
- }
- .text-caption:first-of-type {margin-top: 0;}
- .user-icon, .ask-icon {
- border-radius:15%;
- display: inline-block;
- vertical-align: middle;
- width: 2em;
- height: 2em;
- margin-right: 1em;
- }
- .username {
- display: inline-block;
- vertical-align: middle;
- font-weight: bold;
- }
- .deactive::after {
- content: '(deactivated)';
- margin-left: 1em;
- opacity: 0.75;
- color: {color:text};
- }
- p.tmblr-attribution {margin-top: 1em !important;}
- /*----- TEXT -----*/
- h1.post-title {margin-top: 0;}
- /*----- LINK -----*/
- a.link-wrap {display: block; border: 1px solid {color:borders};}
- .link {padding: 2em;}
- .link-host, .link-txt {margin-top: 1.5em;}
- .npf-link-block {
- margin-top: 1.5em;
- background-color: inherit;
- border: 1px solid inherit;
- color: inherit;
- }
- /*----- PHOTO -----*/
- img {
- margin: 0;
- display: block;
- height: auto;
- max-width: 100%;
- }
- .photo img {width: 100%;}
- .vignette, #vignette {opacity: 0;}
- .tmblr-lightbox, #tumblr_lightbox {background-color: rgba(130, 130, 130, 0.75) !important;}
- .lightbox-image, #tumblr_lightbox img {
- box-shadow: none !important;
- border-radius: 0 !important;
- max-width: none;
- }
- #tumblr_lightbox_caption, .lightbox-caption {
- color: #fff !important;
- font-family: inherit;
- margin-top: 1em !important;
- }
- /*----- PHOTOSET -----*/
- .post-content div.npf_row, .post div.npf_row, body div.npf_row {
- margin-left: 0 !important;
- margin-right: 0 !important;
- }
- /*----- QUOTE -----*/
- .quote {
- line-height: 160%;
- font-size: 1.25em;
- {block:ifCaptionBorder}
- outline: {text:Border Size} {select:Border Style} {color:Borders};
- {/block:ifCaptionBorder}
- }
- .quote p:first-of-type {margin-top: 0;}
- .quote p:last-of-type {margin-bottom: 0;}
- .source {margin-top: 1.5em;}
- /*----- CHAT -----*/
- .chat {padding: 0; margin: 0;}
- .chat li {list-style-type: none; margin-top: 1em;}
- .chat li:first-of-type {margin-top: 0;}
- .chatter {font-weight: bold;}
- p.npf_chat, p.npf_chat b {
- font-family: inherit;
- {block:ifCaptionBorder}
- outline: {text:Border Size} {select:Border Style} {color:Borders};
- {/block:ifCaptionBorder}
- }
- /*----- ANSWER -----*/
- .ask-wrap {
- border-bottom: 1px solid {color:borders};
- padding-bottom: 2em;
- {block:ifCaptionBorder}
- outline: {text:Border Size} {select:Border Style} {color:Borders};
- {/block:ifCaptionBorder}
- }
- .ask-wrap .asking {
- display: inline-block;
- margin-left: 1em;
- font-weight: bold;
- }
- .question {
- margin-top: 1em;
- {block:ifCaptionBorder}
- border-bottom:0px;
- padding-bottom:0px;
- {/block:ifCaptionBorder}
- }
- .question p:first-of-type {margin-top: 0;}
- .question p:last-of-type {margin-bottom: 0;}
- /*----- AUDIO -----*/
- .audiopost {padding: 2em; border: 1px solid {color:borders};}
- .album-art {
- z-index: 1;
- display: inline-block;
- vertical-align: middle;
- float: left;
- width: 100px;
- height: 100px;
- }
- .audio-player-wrap {
- width: 100px;
- height: 100px;
- display: inline-block;
- }
- .button {
- width: 30px;
- height: 30px;
- overflow: hidden;
- position: relative;
- z-index: 2;
- margin: 7px;
- }
- .audiobox {
- background-color: #f2f2f2;
- z-index: 3;
- position: absolute;
- margin: 28px 0 0 28px;
- border-radius: 50%;
- }
- .audioinfo {
- display: inline-block;
- height: 100px;
- max-width: calc(100% - 100px);
- margin-left: 100px;
- display: flex;
- justify-content: center;
- flex-direction: column;
- box-sizing: border-box;
- padding-left: 2em;
- }
- .audioinfo li {list-style-type: none;}
- .track {font-weight: bold;}
- /*----- INFO -----*/
- .info {margin-top: 2em;}
- .info a {display: inline-block; vertical-align: middle;}
- .likeb {
- position: relative;
- display: inline-block;
- height: 1.6em;
- margin-bottom: -1px;
- }
- .likeb .like_button iframe {
- position: absolute;
- top: 0;
- left: 0;
- bottom: 0;
- right: 0;
- z-index: 2;
- opacity: 0;
- }
- .like_button iframe {width: 100% !important; height: 100% !important;}
- .likeb .liked + .actual-button {color: red;}
- .likeb .liked + .actual-button:after {content: 'd'; font-weight:bold;}
- .info a, .tags a {
- margin-right: 0.75em;
- }
- a.pinned-post {font-weight: bold; color: {color:accent};}
- /*---- POST NOTES -----*/
- .pagenotes {
- padding:10px;
- margin-top:10px;
- width:540px;
- border:0;
- }
- .pagenotes a {
- font-family:'Quicksand';
- font-weight:700;
- color:#444444;
- }
- .pagenotes ol, .pagenotes ul {
- display:block;
- padding:0;
- margin:0;
- }
- li.note {
- font-size:10px;
- display:block;
- padding:5px 0 5px 0;
- }
- ol.notes li.note img.avatar {display:none;}
- a.more_notes_link {
- display:block;
- margin-top:10px;
- text-align:center;
- }
- /*---- PAGINATION -----*/
- #page-navigation {
- text-align: inline-block;
- margin-top:20px;
- }
- #page-navigation a, .current-page {margin: 0 0.5em;}
- .current-page {font-weight: bold; color: {color:accent};}
- /* scroll to top */
- .scrollToTopBtn {
- background-color:transparent;
- border:none;
- color:{color:link};
- cursor: pointer;
- font-size: 16px;
- width:20px;
- height:16px;
- position: fixed;
- bottom:40px;
- right:13.5px;
- z-index: 100;
- opacity: 0;
- transition: all .5s ease
- }
- .showBtn {
- opacity: 1;
- }
- /*---- CREDIT -----*/
- #credit {
- position: fixed;
- bottom: 20px;
- right: 20px;
- font-size: 15px;
- }
- /*----
- MEDIA QUERIES AND RESPONSIVENESS:
- if you change the basic layout (i.e. sidebar to header), you MUST modify or delete this section, or else your theme will get screwed up on smaller screen sizes. if you're unfamiliar with media queries and/or you aren't interested in making responsive themes, I recommend deleting this whole section.
- -----*/
- /*--- for small desktop/tablet screens. converts sidebar to header ---*/
- @media only screen and (max-width: 1100px) {
- main {width: {select:post width};}
- #sidebar {
- position: relative;
- margin: {text:post margin}px auto;
- width: 100%;
- top: auto;
- }
- section {margin-left: 0;}
- }
- /*--- for mobile devices ---*/
- @media only screen and (max-width: 720px) {
- main, section {width: 80vw;}
- }
- /*---- END OF MEDIA QUERIES -----*/
- {CustomCSS}
- .views {
- position:fixed;
- bottom:15px;
- left:15px;
- font-size:10px
- }
- .credit {
- position:fixed;
- bottom:15px;
- right:15px;
- font-size:20px
- }
- .credit {
- position:fixed;
- bottom:15px;
- right:15px;
- font-size:20px
- }
- </style>
- </head>
- <!----- HTML ----->
- <body>
- <!-- scroll to top -->
- <div class="scrollToTopBtn"><svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 25 25" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-arrow-up"><line x1="12" y1="19" x2="12" y2="5"></line><polyline points="5 12 12 5 19 12"></polyline></svg>️</div>
- <!-- main = main container -->
- <main>
- <!----- SIDEBAR ----->
- <aside id="sidebar">
- {block:ifSidebarImage}<img src="{image:Sidebar}" id="side-img" alt="Sidebar image"/></a>{/block:ifSidebarImage}
- <div class="title"><a href="/">{Title}</a></div>
- {block:Description}<div id="description">{Description}</div>{/block:Description}
- <nav>
- {block:IfNotSidelinksOnOneLine}
- <div class="sidelinks">
- <a href="/">home</a>
- <a href="/ask">message</a>
- {block:IfLink1}<a href="{text:link 1 URL}">{text:link 1}</a>{/block:IfLink1}
- {block:IfLink2}<a href="{text:link 2 URL}">{text:link 2}</a>{/block:IfLink2}
- {block:IfLink3}<a href="{text:link 3 URL}">{text:link 3}</a>{/block:IfLink3}
- {block:IfLink4}<a href="{text:link 4 URL}" >{text:link 4}</a>{/block:IfLink4}
- {block:IfLink5}<a href="{text:link 5 URL}" >{text:link 5}</a>{/block:IfLink5}
- </div>
- </div>
- {/block:IfNotSidelinksOnOneLine}
- {block:IfSidelinksOnOneLine}
- <div class="sidelinks">
- <a href="/">index</a>
- <a href="/ask">ask</a>
- {block:IfLink1}
- <a href="{text:link 1 URL}">{text:link 1}</a>{/block:IfLink1}
- {block:IfLink2} <a href="{text:link 2 URL}">{text:link 2}</a>{/block:IfLink2}
- {block:IfLink3} <a href="{text:link 3 URL}" >{text:link 3}</a>{/block:IfLink3}
- {block:IfLink4} <a href="{text:link 4 URL}" >{text:link 4}</a>{/block:IfLink4}
- {block:IfLink5} <a href="{text:link 5 URL}" >{text:link 5}</a>{/block:IfLink5}
- </div>
- {/block:IfSidelinksOnOneLine}
- </nav>
- <div class="short-border2"></div>
- {block:Pagination}
- <article id="page-navigation">
- {block:PreviousPage}<a href="{PreviousPage}">←</a>{/block:PreviousPage}
- {block:JumpPagination length="3"}
- {block:CurrentPage}<span class="current-page" display="color:#000000">{PageNumber}</span>{/block:CurrentPage}
- {block:JumpPage}<a href="{URL}">{PageNumber}</a>{/block:JumpPage}
- {/block:JumpPagination}
- {block:NextPage}<a href="{NextPage}">→</a>{/block:NextPage}
- </article>
- {/block:Pagination}
- </aside>
- <!----- TAG AND DAY PAGES ----->
- <!-- section = post container -->
- <section>
- {block:TagPage}
- <article>
- #{Tag}
- </article>
- {/block:TagPage}
- {block:DayPage}
- <article>
- {Month} {DayOfMonth}, {Year}
- </article>
- {/block:DayPage}
- <!----- POSTS ----->
- {block:Posts}
- <article class="posts" id="{PostID}">
- {block:Text}
- {block:Title}<h1 class="post-title"><a href="{Permalink}">{Title}</a></h1>{/block:Title}
- {block:NotReblog}
- <li class="caption text-caption">
- {Body}
- </li>
- {/block:NotReblog}
- {block:RebloggedFrom}
- {block:Reblogs}
- <li class="caption text-caption">
- <img src="{PortraitURL-64}" class="user-icon">
- <div class="username {block:IsDeactivated}deactive{/block:IsDeactivated}"><a href="{Permalink}">{Username}</a></div>
- {Body}
- </li>
- {/block:Reblogs}
- {/block:RebloggedFrom}
- {/block:Text}
- {block:Link}
- <a href="{URL}" class="link-wrap">
- {block:Thumbnail}<img src="{Thumbnail-HighRes}">{/block:Thumbnail}
- <div class="link">
- <div class="title">{Name}</div>
- {block:Excerpt}<div class="link-txt">{Excerpt}</div>{/block:Excerpt}
- {block:Host}<div class="link-host">{Host}</div>{/block:Host}
- </div>
- </a>
- {block:Description}
- {block:NotReblog}
- <li class="caption">
- {Description}
- </li>
- {/block:NotReblog}
- {/block:Description}
- {block:RebloggedFrom}
- {block:Reblogs}
- <li class="caption">
- <img src="{PortraitURL-64}" class="user-icon">
- <div class="username {block:IsDeactivated}deactive{/block:IsDeactivated}"><a href="{Permalink}">{Username}</a></div>
- {Body}
- </li>
- {/block:Reblogs}
- {/block:RebloggedFrom}
- {/block:Link}
- {block:Photo}
- <div class="photo">
- {LinkOpenTag}<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}" alt="{PhotoAlt}"></a>{LinkCloseTag}
- </div>
- {block:Caption}
- {block:NotReblog}
- <li class="caption">
- {Caption}
- </li>
- {/block:NotReblog}
- {block:RebloggedFrom}
- {block:Reblogs}
- <li class="caption">
- <img src="{PortraitURL-64}" class="user-icon">
- <div class="username {block:IsDeactivated}deactive{/block:IsDeactivated}"><a href="{Permalink}">{Username}</a></div>
- {Body}
- </li>
- {/block:Reblogs}
- {/block:RebloggedFrom}
- {/block:Caption}
- {/block:Photo}
- {block:Photoset}
- <div class="photo">{Photoset-700}</div>
- {block:Caption}
- {block:NotReblog}
- <li class="caption">
- {Caption}
- </li>
- {/block:NotReblog}
- {block:RebloggedFrom}
- {block:Reblogs}
- <li class="caption">
- <img src="{PortraitURL-64}" class="user-icon">
- <div class="username {block:IsDeactivated}deactive{/block:IsDeactivated}"><a href="{Permalink}">{Username}</a></div>
- {Body}
- </li>
- {/block:Reblogs}
- {/block:RebloggedFrom}
- {/block:Caption}
- {/block:Photoset}
- {block:Video}
- <div class="video">{Video-500}</div>
- {block:Caption}
- {block:NotReblog}
- <li class="caption">
- {Caption}
- </li>
- {/block:NotReblog}
- {block:RebloggedFrom}
- {block:Reblogs}
- <li class="caption">
- <img src="{PortraitURL-64}" class="user-icon">
- <div class="username {block:IsDeactivated}deactive{/block:IsDeactivated}"><a href="{Permalink}">{Username}</a></div>
- {Body}
- </li>
- {/block:Reblogs}
- {/block:RebloggedFrom}
- {/block:Caption}
- {/block:Video}
- {block:Quote}
- <div class="quote">{Quote}</div>
- {block:Source}<div class="source">{Source}</div>{/block:Source}
- {/block:Quote}
- {block:Chat}
- {block:Title}<h1 class="post-title"><a href="{Permalink}">{Title}</a></h1>{/block:Title}
- <ul class="chat">{block:Lines}
- <li>
- {block:Label}<div class="chatter">{Label}</div>{/block:Label}
- {Line}
- </li>
- {/block:Lines}</ul>
- {/block:Chat}
- {block:Answer}
- <div class="ask-wrap">
- <img src="{AskerPortraitURL-64}" class="ask-icon">
- <div class="asking">{Asker} asked</div>
- <div class="question">{Question}</div>
- </div>
- {block:Answerer}
- <li class="caption">
- <img src="{AnswererPortraitURL-64}" class="user-icon">
- <div class="username {block:IsDeactivated}deactive{/block:IsDeactivated}"><a href="{Permalink}">{Answerer}</a></div>
- {Answer}
- </li>
- {/block:Answerer}
- {block:NotReblog}
- <li class="caption">
- {Replies}
- </li>
- {/block:NotReblog}
- {block:RebloggedFrom}
- {block:Reblogs}
- <li class="caption">
- <img src="{PortraitURL-64}" class="user-icon">
- <div class="username {block:IsDeactivated}deactive{/block:IsDeactivated}"><a href="{Permalink}">{Username}</a></div>
- {Body}
- </li>
- {/block:Reblogs}
- {/block:RebloggedFrom}
- {/block:Answer}
- {block:Audio}
- <div class="audiopost">
- <div class="audiobox">
- <div class="button">
- {block:AudioPlayer}{AudioPlayer}{/block:AudioPlayer}
- </div>
- </div>
- {block:AlbumArt}
- <img src="{AlbumArtURL}" class="album-art">
- {/block:AlbumArt}
- <div class="audioinfo">
- {block:TrackName}<li class="track">{TrackName}</li>{/block:TrackName}
- {block:Artist}<li>{Artist}</li>{/block:Artist}
- {block:Album}<li>{Album}</li>{/block:Album}
- </div>
- </div>
- {block:Caption}
- {block:NotReblog}
- <li class="caption">
- {Caption}
- </li>
- {/block:NotReblog}
- {block:RebloggedFrom}
- {block:Reblogs}
- <li class="caption">
- <img src="{PortraitURL-64}" class="user-icon">
- <div class="username {block:IsDeactivated}deactive{/block:IsDeactivated}"><a href="{Permalink}">{Username}</a></div>
- {Body}
- </li>
- {/block:Reblogs}
- {/block:RebloggedFrom}
- {/block:Caption}
- {/block:Audio}
- <!----- INFO ----->
- {block:Date}
- <div class="info">
- {block:PinnedPostLabel}<a href="{Permalink}" style="text-transform:lowercase; text-transform:bold; color:{color:accent}" class="pinned-post"><span class="sf sf-push-pin-o"> pinned </span>{/block:PinnedPostLabel}
- <a href="{Permalink}" style="text-transform:lowercase;"><b>{ShortMonth} {DayOfMonth} </b></a>
- {block:NoteCount}<a href="{Permalink}" class="notecount"><b> {notecount}</b></a>{/block:NoteCount}
- <!-- reblog info and content source on permalink pages -->
- {block:PermalinkPage}
- {block:RebloggedFrom}
- <a href="{ReblogParentURL}">via</a>
- <a href="{ReblogRootURL}">source</a>
- {/block:RebloggedFrom}
- {block:ContentSource}<a href="{SourceURL}">{lang:Source}</a>{/block:ContentSource}
- {/block:PermalinkPage}
- <!-- like and reblog buttons -->
- <div class="short-border"></div>
- <a href="{ReblogURL}" target="_blank"><b> reblog</b></a>
- <a class="likeb" href="#">{LikeButton}<span class="actual-button"><b> like</b></span></a>
- </div>
- {/block:Date}
- <!----- TAGS ----->
- {block:HasTags}
- <div class="tags" style="font-size: 10px">
- {block:Tags}<a href="{TagURL}">#{Tag}</a>{/block:Tags}
- </div>
- {/block:HasTags}
- <!----- POST NOTES ----->
- {block:PermalinkPage}{block:Date}{block:PostNotes}
- <div class="notes">
- {block:NoteCount}<br><div class="title" style="font-size: 14px">{NoteCountWithLabel}</div>{/block:NoteCount}
- {PostNotes}
- </div>
- {/block:PostNotes}{/block:Date}{/block:PermalinkPage}
- </article>
- {/block:Posts}
- <!-- end of posts container -->
- </section>
- <!-- end of main container -->
- </a></div>
- <!----- NOTECOUNT ----->
- <script type="text/javascript" src="https://static.tumblr.com/i5s2zks/9Acok8oo2/bct-timeago.min.js"></script>
- <!----- MASONRY ----->
- <script src="https://unpkg.com/masonry-layout@4/dist/masonry.pkgd.js"></script>
- <script src="https://unpkg.com/imagesloaded@4/imagesloaded.pkgd.min.js"></script>
- <script type="text/javascript">
- $(document).ready(function(){
- /// MASONRY
- var $container = $('#container');
- $container.masonry({
- itemSelector: '.posts',
- gutter: 100,
- horizontalOrder: true
- });
- $container.imagesLoaded(function(){
- $container.masonry();
- $container.find('article').removeClass('masonry-load');
- });
- feather.replace()
- </script>
- <script>
- var scrollToTopBtn = document.querySelector(".scrollToTopBtn")
- var rootElement = document.documentElement
- function handleScroll() {
- var scrollTotal = rootElement.scrollHeight - rootElement.clientHeight
- if ((rootElement.scrollTop / scrollTotal ) > 0.05) {
- scrollToTopBtn.classList.add("showBtn")
- } else {
- scrollToTopBtn.classList.remove("showBtn")
- }
- }
- function scrollToTop() {
- rootElement.scrollTo({
- top: 0,
- behavior: "smooth"
- })
- }
- scrollToTopBtn.addEventListener("click", scrollToTop)
- document.addEventListener("scroll", handleScroll)
- </script>
- <div class="credit"><a href="https://hawkinsgrocery.tumblr.com" title="hawkinsgrocery"><i class="oi oi-heart"></i></a></div>
- </body></html>
Advertisement
Add Comment
Please, Sign In to add comment