Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- <!DOCTYPE html>
- <html>
- <!--
- - theme #9: 'nevertheless' by fallingforthemes
- - please don't steal my code
- - let me know of any problems or questions
- - Enjoy!
- Credits:
- - Feather icons
- - Octomoosey for resizing audio player button
- - Seyche for optional tumblr controls
- - Stackoverflow for corner borders: https://stackoverflow.com/questions/14387690/how-can-i-show-only-corner-borders
- - Annasthms for CSS Photosets
- - Glenthemes for NPF Post Support
- If you need any help, feel free to send me a message at fallingforthemes.tumblr.com/ask
- -->
- <head>
- <title>{Title}</title>
- <!---------------- META -------------->
- <meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1">
- <meta name="if:Custom Title" content="on"/>
- <meta name="if:Custom Font" content=""/>
- <meta name="if:Notes Hidden" content=""/>
- <meta name="if:Tags Hidden" content=""/>
- <meta name="if:Tags Hover" content="on"/>
- <meta name="if: Four Corners" content=""/>
- <meta name="if:Link 1" content="on"/>
- <meta name="if:Link 2" content="on"/>
- <meta name="if:Link 3" content="on"/>
- <meta name="image:About Image" content="">
- <meta name="color:Current Page Index" content="#ffcfd2">
- <meta name="color:Other Page Indices" content="#fde4cf">
- <meta name="color:Background" content="#ffffff">
- <meta name="color:Pin" content="#f94144">
- <meta name="color:Post" content="#ffffff">
- <meta name="color:Post Font" content="#000000">
- <meta name="color:Post Link" content="#cb2f66">
- <meta name="color:Post Link Hover" content="#000000">
- <meta name="color:Section Borders" content="#000000">
- <meta name="color:Post Accent" content="#222222">
- <meta name="color:Drop Shadow" content="#888888">
- <meta name="color:Sidebar Link Font" content="#000000">
- <meta name="color:Sidebar Link Hover" content="#fde4cf">
- <meta name="color:Sidebar Link Background" content="#ffcfd2">
- <meta name="color:Description Background" content="#ffffff">
- <meta name="color:Description Font" content="#000000">
- <meta name="font:Body" content="sans-serif"/>
- <meta name="text:Custom Title" content="" />
- <meta name="text:URL 1 Icon" content="link" />
- <meta name="text:URL 1 Label" content="Link 1" />
- <meta name="text:URL 1" content="" />
- <meta name="text:URL 2 Icon" content="link-2" />
- <meta name="text:URL 2 Label" content="Link 2" />
- <meta name="text:URL 2" content="" />
- <meta name="text:URL 3 Icon" content="external-link" />
- <meta name="text:URL 3 Label" content="Link 3" />
- <meta name="text:URL 3" content="" />
- <meta name="text:About Image Alt" content="" />
- <meta name="select:Text Size" content="10px"/>
- <meta name="select:Text Size" content="11px"/>
- <meta name="select:Text Size" content="12px"/>
- <meta name="select:Text Size" content="13px"/>
- <meta name="select:Text Size" content="14px"/>
- <meta name="select:Text Size" content="15px"/>
- <meta name="select:Text Size" content="16px"/>
- <meta name="select:Text Size" content="17px"/>
- <meta name="select:Text Size" content="18px"/>
- <meta name="select:Post Size" content="540px"/>
- <meta name="select:Post Size" content="600px"/>
- <meta name="select:Post Size" content="650px"/>
- <meta name="select:Post Size" content="700px"/>
- <meta name="select:Font" content="Lato"/>
- <meta name="select:Font" content="Poppins"/>
- <meta name="select:Photoset Gap Spacing" content="0px"/>
- <meta name="select:Photoset Gap Spacing" content="1px"/>
- <meta name="select:Photoset Gap Spacing" content="2px"/>
- <meta name="select:Photoset Gap Spacing" content="3px"/>
- <meta name="select:Photoset Gap Spacing" content="4px"/>
- <meta name="select:Photoset Gap Spacing" content="5px"/>
- <meta name="select:Photoset Gap Spacing" content="6px"/>
- <meta name="select:Photoset Gap Spacing" content="7px"/>
- <meta name="select:Photoset Gap Spacing" content="8px"/>
- <meta name="select:Photoset Gap Spacing" content="9px"/>
- <meta name="select:Photoset Gap Spacing" content="10px"/>
- <!---------------- FEATHER ICONS -------------->
- <script src="https://unpkg.com/feather-icons"></script>
- <!---------------- FONT (POPPINS + LATO) ---------------->
- <link rel="preconnect" href="https://fonts.googleapis.com">
- <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
- <link href="https://fonts.googleapis.com/css2?family=Lato:wght@300&family=Poppins:wght@200&display=swap" rel="stylesheet">
- <!---------------- TOOLTIPS SCALE ANIMATION -------------->
- <link rel="stylesheet" href="https://unpkg.com/tippy.js@6/animations/scale.css"/>
- <!---------------- JQUERY -------------->
- <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
- <!---------------- NO.JS Photosets ---------------->
- <link href="https://static.tumblr.com/0podkko/oDSpg7y88/photosets.css" rel="stylesheet">
- <!--
- NPF images fix v3.0 by @glenthemes [2021]
- 💌 git.io/JRBt7
- --->
- <script src="//npf-images-v3.github.io/script.js"></script>
- <link rel="stylesheet" href="//npf-images-v3.github.io/recon.css">
- <style tmblr-npf>
- :root {
- --NPF-Caption-Spacing:1em;
- --NPF-Image-Spacing:4px;
- }
- </style>
- <style type="text/css">
- /*********** GENERAL: BODY, IMGS, LISTS ************/
- * {
- margin: 0;
- padding: 0;
- box-sizing: border-box;
- }
- body {
- word-wrap: break-word;
- font-family: {font:Body}, sans-serif;
- font-size: {select:Text Size};
- letter-spacing: 0.05em;
- background-color: {color:Background};
- }
- {block:IfCustomFont}
- body {
- font-family: {select:Font}, sans-serif;
- }
- {/block:IfCustomFont}
- img {
- border: 0; /*Precaution for IE*/
- max-width: 100%; /*Prevent imgs from spilling over*/
- width: 100%; /*For Google Chrome*/
- }
- ol, ul {
- padding: 0 35px;
- }
- ul {
- list-style-type: square;
- }
- input {
- outline: none;
- }
- input:focus {
- outline: solid;
- }
- a {
- text-decoration: none;
- }
- #sidebar, #content {
- border: 5px solid {color:Section Borders};
- border-radius: 5px;
- box-shadow: 1em 1em 1em {color:Drop Shadow};
- position: fixed;
- overflow: scroll;
- }
- .user, .close {
- display: none;
- z-index: 2;
- }
- /**** TUMBLR CONTROL SETTINGS ****/
- .controls-button svg {
- cursor: help;
- color: {color:Sidebar Link Font};
- }
- .tmblr-iframe-compact .tmblr-iframe--unified-controls {
- z-index: 999999999!important;
- margin-top: 1.5em;
- opacity: 0;
- visibility: hidden;
- -webkit-transition: all 0.5s;
- -moz-transition: all 0.5s;
- -ms-transition: all 0.5s;
- -o-transition: all 0.5s;
- transition: all 0.5s;
- }
- body.controls-click .tmblr-iframe {
- opacity: 1.0;
- visibility: visible;
- -webkit-transition: all 0.5s;
- -moz-transition: all 0.5s;
- -ms-transition: all 0.5s;
- -o-transition: all 0.5s;
- transition: all 0.5s;
- }
- /**** GENERAL TITLES ****/
- .title, .post_title {
- font-weight: bold;
- }
- /*********** SIDEBAR/HEADER ************/
- #sidebar {
- height: 22em;
- width: 17em;
- left: 14%;
- bottom: 4%;
- background-color: {color:Description Background};
- color: {color:Description Font};
- text-align: justify;
- padding: 1em;
- line-height: 2em;
- }
- #sidebar .title {
- text-align: center;
- color: {color:Description Font};
- }
- {block:IfCustomTitle}
- #sidebar .default_title {
- display: none;
- }
- {/block:IfCustomTitle}
- #sidebar img {
- display: block;
- width: 5em;
- height: 5em;
- margin: 0 auto;
- border-radius: 100%;
- }
- /*SIDEBAR NAVIGATION*/
- .user, .controls-button, .close {
- padding: 7px 10px;
- border-radius: 100%;
- position: relative;
- }
- .controls-button {
- float: right;
- }
- .links {
- position: absolute;
- }
- .links a {
- border: 3px solid {color:Section Borders};
- border-radius: 100%;
- padding: 0.5em;
- line-height: 13px;
- display: inline-block;
- color: {color:Sidebar Link Font};
- background-color: {color:Sidebar Link Background};
- position: relative;
- }
- .links a:hover {
- background-color: {color:Sidebar Link Hover};
- }
- #links_1 {
- left: 12em;
- top: 16em;
- }
- #links_1 a:nth-child(2){
- top: 60px;
- right: 60px;
- }
- #links_1 a:nth-child(3) {
- top: 33px;
- right: 37px;
- }
- #links_1 a:last-child {
- bottom: 25px;
- right: 65px;
- }
- #links_2 {
- right: 3em;
- bottom: 6em;
- }
- #links_2 a:first-child {
- left: 68px;
- bottom: 40px;
- }
- #links_2 a:nth-child(2){
- right: 20px;
- }
- #links_2 a:nth-child(3) {
- left: 20px;
- }
- #links_2 a:last-child {
- right: 67px;
- top: 40px;
- }
- .link1, .link2, .link3 {
- visibility: hidden;
- }
- {block:IfLink1}
- .link1 {
- visibility: visible;
- }
- {/block:IfLink1}
- {block:IfLink2}
- .link2 {
- visibility: visible;
- }
- {/block:IfLink2}
- {block:IfLink3}
- .link3 {
- visibility: visible;
- }
- {/block:IfLink3}
- /*********** ABOUT ************/
- #desc a, .post_content caption a {
- text-decoration: underline;
- }
- #nav {
- text-align: center;
- }
- #pagination {
- z-index: 2;
- padding: 10px 10px 20px 10px;
- border-radius: 5px;
- }
- #pagination a {
- color: {color:Post Font};
- }
- .current_page, .page_num, .jump_page, .prev, .next {
- padding: 7px 12px;
- margin: 0 10px;
- border-radius: 5px;
- background-color: {color:Other Page Indices};
- }
- .current_page {
- background-color: {color:Current Page Index};
- }
- /*********** CONTENT ************/
- #content {
- width: 70%;
- height: 75%;
- right: 3em;
- top: 3em;
- }
- /*********** POSTS ************/
- .note_count{
- float: right;
- }
- .date {
- position: relative;
- left: calc({select:Post Size} - 50px);
- }
- {block:IfNotesHidden}
- .note_count {
- display: none;
- }
- {/block:IfNotesHidden}
- /*GENERAL POST*/
- .pin {
- display: none;
- }
- .pinned .pin {
- display: block;
- text-align: center;
- color: {color:Pin};
- }
- .posts {
- width: {select:Post Size};
- break-inside: avoid;
- margin: 0 auto 1.5em;
- }
- .posts:first-child {
- margin-top: 1.5em;
- }
- .post_content {
- position: relative;
- padding: 1.5em;
- margin: 5px 0 5px;
- background-color: {color:Post};
- color: {color:Post Font};
- }
- .post_content:before, .post_content>:first-child:before {
- position: absolute;
- content: ' ';
- border-style: solid;
- border-color: {color:Post Accent};
- width: 30px;
- height: 30px;
- }
- .post_content:before {
- top: 0;
- left: 0;
- border-width: 3px 0 0 3px;
- }
- .post_content>:first-child:before {
- bottom: 0;
- right: 0;
- border-width: 0 3px 3px 0
- }
- {block:IfFourCorners}
- .post_content:after, .post_content>:first-child:after {
- position: absolute;
- content: ' ';
- border-style: solid;
- border-color: {color:Post Accent};
- width: 30px;
- height: 30px;
- }
- .post_content:after {
- top: 0;
- right: 0;
- border-width: 3px 3px 0 0;
- }
- .post_content>:first-child:after {
- bottom: 0;
- left: 0;
- border-width: 0 0 3px 3px
- }
- {/block:IfFourCorners}
- .posts a, #note_list a {
- color: {color:Post Link};
- }
- .posts a:hover, #note_list a:hover {
- color: {color:Post Link Hover};
- }
- /* POST ICON */
- .reblog-icon img {
- width: 40px;
- height: 40px;
- border-radius: 40%;
- position: absolute;
- left: -50px;
- top: 5px;
- }
- .reblog-header {
- margin-top: 5px;
- }
- /*TEXT POSTS*/
- .text_post .caption p:not(.reblog-list .caption p):not(blockquote .caption p){
- padding: 10px 0;
- }
- .reblog-list .caption p {
- padding-bottom: 10px;
- }
- /*CHAT POSTS*/
- .chat {
- list-style-type: none;
- }
- .chat li:nth-child(even), .npf_chat:nth-child(even) {
- text-align: right;
- }
- .chat li{
- padding-bottom: 5px;
- }
- .npf_chat b:only-of-type {
- display: block;
- }
- /*PHOTO POSTS*/
- .html_photoset iframe, .embed_iframe{
- width: 100%;
- }
- .photo_post .caption {
- display: none;
- }
- {block:PermalinkPage}
- .photo_post .caption {
- display: block;
- }
- {/block:PermalinkPage}
- [photoset-layout] {
- grid-gap: {select:Photoset Gap Spacing};
- }
- [photoset-layout] div {
- cursor: pointer;
- }
- /*AUDIO POSTS*/
- .audio_post .caption {
- padding-bottom: 30px;
- }
- .audio_container {
- text-align: center;
- }
- .audio_name {
- font-weight: bold;
- }
- .audio_image {
- height: 50%;
- width: 50%;
- margin: 0 auto;
- }
- .audio_image img {
- border-radius: 5px;
- }
- .audio_player_box {
- position: relative;
- top: 10em;
- }
- .audio_player {
- width: 33px;
- height: 33px;
- overflow: hidden;
- margin: 0 auto;
- }
- /*ASK POSTS*/
- .asker {
- font-size: 0.95em;
- font-family: 'Poppins', sans-serif;
- font-weight: bold;
- }
- .answer {
- padding-top: 10px;
- text-align: right;
- }
- /*QUOTE POSTS*/
- .quote {
- padding-top: 10px;
- }
- .source {
- padding-left: 20px;
- }
- /*CAPTIONS*/
- blockquote {
- padding: 10px 20px;
- border-left: 2px solid rgba(220,220,220,0.5);
- margin-top: 5px;
- }
- .chat, .caption {
- padding-top: 10px;
- }
- /***POST END***/
- .post_end a {
- color: {color:Post Link};
- }
- .post_end a:hover {
- color: {color:Post Link Hover};
- }
- /*LIKE/REBLOG STYLING*/
- .like-b {
- position:relative;
- overflow:hidden;
- margin-bottom:-1px;
- padding-right: 10px;
- }
- .like-b .like_button iframe {
- position:absolute;
- top:0;
- left:0;
- bottom:0;
- right:0;
- z-index:2;
- opacity:0;
- }
- .like-b .liked + .b {
- color:inherit;
- }
- .like-b .liked + .b:after {
- content:'d';
- }
- /*TAG STYLING*/
- .posts .tags .comma {
- color: {color:Post};
- }
- .posts .tags .comma:last-child, .posts .tags .comma:last-child {
- display: none;
- }
- {block:IfTagsHidden}
- .posts .tags {
- display: none;
- }
- {block:IfTagsHidden}
- {block:IfTagsHover}
- .posts .tags {
- display: none;
- }
- {block:IfTagsHover}
- /*** LIST OF NOTES ***/
- #note_list {
- margin: 0 auto;
- width: {select:Post Size};
- font-size: {select:Text Size};
- border: 2px solid {color:Post Accent};
- border-radius: 5px;
- padding: 10px 20px;
- break-inside: avoid;
- }
- #note_list a:first-child {
- margin-left: 5px;
- }
- #note_list ol.notes {
- list-style-type: none;
- margin: 0;
- padding: 0;
- }
- #note_list img.avatar {
- margin-right: 10px;
- width: 16px;
- height: 16px;
- }
- /**********RESPONSIVE STYLING************/
- #mini_pagination {
- display: none;
- }
- @media only screen and (max-height: 600px) {
- #links_1 {
- top: 7em;
- }
- }
- @media only screen and (max-width: 912px) {
- #links_1 {
- left: 6em;
- }
- .posts {
- width: 80%;
- }
- .date {
- left: calc(80% + 50px);
- }
- }
- @media only screen and (max-width: 795px) {
- .controls-button {
- display: none;
- }
- .tmblr-iframe.iframe-controls--phone-mobile {
- display: none !important;
- }
- .tmblr-iframe-pushdown {
- padding-top: 0 !important;
- }
- .user {
- display: inline-block;
- }
- #sidebar, #content {
- box-shadow: 0 0 0;
- border: 0;
- width: 100%;
- }
- #content {
- top: 4em;
- right: 0;
- height: calc(100% - 13em);
- position: relative;
- }
- #sidebar {
- width: 100%;
- height: fit-content;
- max-height: 50vh;
- top: 0;
- left: 0;
- bottom: 0;
- padding: 2em;
- overflow: scroll;
- position: absolute;
- display: none;
- }
- #pagination {
- left: calc((100% - 178px)/2);
- }
- .posts {
- margin: 0 0 1.5em 4em;
- }
- .date {
- left: calc(80% - 50px + 4em);
- }
- .links {
- position: absolute;
- }
- .links a{
- position: relative;
- border-radius: 0%;
- border-right: 0;
- }
- #links_1, #links_2 {
- top: 4em;
- right: 0 !important;
- bottom: 0 !important;
- }
- #links_1 {
- display: inline-block;
- left: calc((100% - 339px)/2);
- }
- #links_2 {
- display: inline;
- left: calc((100% - 3px)/2);
- }
- #links_1 a, #links_2 a {
- top: 0 !important;
- left: 0 !important;
- right: 0 !important;
- bottom: 0 !important;
- }
- #links_1 a:first-child {
- border-radius: 5px 0 0 5px;
- }
- #links_2 a:last-child {
- border-radius: 0 5px 5px 0;
- border-right: 3px solid {color:Section Borders};
- }
- }
- @media only screen and (min-width: 540px) {
- .posts {
- margin: 0 auto 1.5em;
- }
- }
- @media only screen and (max-width: 280px) {
- .reblog-icon {
- display: none;
- }
- .posts {
- margin: 0 auto;
- }
- #links_1, #links_2 {
- left: calc((100% - 171px)/2);
- }
- #links_1 {
- top: 2em;
- }
- #links_2 {
- top: calc(2em + 50px);
- }
- #links_1 a:first-child,#links_2 a:first-child {
- border-radius: 5px 0 0 5px;
- }
- #links_2 a:last-child, #links_1 a:last-child {
- border-radius: 0 5px 5px 0;
- border-right: 3px solid {color:Section Borders};
- }
- #content {
- top: 5em;
- }
- }
- {CustomCSS}
- </style>
- <link href="https://static.tumblr.com/0podkko/oDSpg7y88/photosets.css" rel="stylesheet">
- </head>
- <body>
- <!-------------- TUMBLR CONTROLS BUTTON -------------->
- <div class="user"><i data-feather="user"></i></div>
- <div class="close"><i data-feather="x"></i></div>
- <a class="controls-button"><i data-feather="settings"></i></a>
- <!-------------- MAIN CONTENT -------------->
- <main id="content">
- {block:Posts inlineMediaWidth="1280" inlineNestedMediaWidth="1280"}
- <!-------------- POSTS -------------->
- <article class="{PostType}_post posts {block:PinnedPostLabel}pinned{/block:PinnedPostLabel}" post-type="{PostType}" id="{PostID}">
- <!-------------- DATE -------------->
- <span class="pin">PINNED</span>
- <a href="{Permalink}" class="date">
- {block:Date}{ShortMonth} {DayOfMonth}{/block:Date}
- </a>
- <div class="post_content">
- <!-------------- POST START -------------->
- <div class="post_start">
- <!--------- POST ICON ---------->
- <!---- ORIGINAL ---->
- <div class="reblog-icon">
- <a target="_blank" class="original" href="/"><img src="{PortraitURL-40}"></a>
- </div>
- {block:RebloggedFrom}
- {block:Reblogs}
- <!---- REBLOGGED ---->
- <div class="reblog-icon">
- {block:IsActive}
- <a target="_blank" class="active reblogged_from" href="{ReblogParentURL}"><img src="{ReblogParentPortraitURL-40}"></a>
- {/block:IsActive}
- {block:IsDeactivated}
- <span class="inactive reblogged_from"><img src="{ReblogParentPortraitURL-40}"></span>
- {/block:IsDeactivated}
- </div>
- {/block:Reblogs}
- {/block:RebloggedFrom}
- </div>
- {block:Title}
- <!-------------- POST TITLE -------------->
- <div class="post_title">{Title}</div>
- {/block:Title}
- {block:Photo}
- <!-------------- PHOTO POST -------------->
- {LinkOpenTag}<img src="{PhotoURL-HighRes}" alt="{PhotoAlt}"/>{LinkCloseTag}
- {/block:Photo}
- {block:Photoset}
- <!-------------- PHOTOSET POST -------------->
- <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>
- {/block:Photoset}
- {block:Panorama}
- <!-------------- PANORAMA POST -------------->
- <img src="{PhotoUrl-Panorama}" alt="{PhotoAlt}">
- {/block:Panorama}
- {block:Video}
- <!-------------- VIDEO POST -------------->
- {Video-500}
- {/block:Video}
- {block:Audio}
- <!-------------- ADUIO POST -------------->
- <div class="audio_container" alt="Album art for {block:TrackName}{Trackname}{/block:TrackName}">
- <div class="audio_image">
- {block:AudioPlayer}
- <div class="audio_player_box">
- {AudioPlayer}
- </div>
- {/block:AudioPlayer}
- {block:AlbumArt}
- <img src="{AlbumArtURL}" alt="{block:TrackName}
- {TrackName}
- {/block:TrackName}">
- {/block:AlbumArt}
- </div>
- <div class="audio_info">
- {block:Album}
- <div class="audio_album">
- {Album}
- </div>
- {/block:Album}
- {block:TrackName}
- <div class="audio_name">
- {TrackName}
- </div>
- {/block:TrackName}
- {block:Artist}
- <div class="audio_artist">
- {Artist}
- </div>
- {/block:Artist}
- </div>
- </div>
- {/block:Audio}
- {block:Quote}
- <!-------------- QUOTE POST -------------->
- <div class="quote">"{Quote}"</div>
- {block:Source}<div class="source"><br>— {Source}</div>{/block:Source}
- {/block:Quote}
- {block:Text}
- <!-------------- TEXT POST -------------->
- {block:NotReblog}
- <!-------------- ORIGINAL POST/NOT REBLOGGED -------------->
- <div class="caption">{Body}</div>
- {/block:NotReblog}
- {block:RebloggedFrom}
- <!-------------- REBLOGGED POST -------------->
- <div class="reblog-list">
- {block:Reblogs}
- <div class="reblog-item">
- <div class="reblog-header">
- {block:IsActive}
- <a target="_blank" class="active reblogged_from" href="{Permalink}">{Username}</a>
- {/block:IsActive}
- {block:IsDeactivated}
- <span class="inactive reblogged_from">{Username}</span>
- {/block:IsDeactivated}
- </div>
- <div class="post-reblog-content">
- <div class="caption">{Body}</div>
- </div>
- </div>
- {/block:Reblogs}
- </div>
- {/block:RebloggedFrom}
- {/block:Text}
- {block:Answer}
- <!-------------- ASK POST -------------->
- <div class="asking">
- <div class="asker">{Asker} asked:</div>
- <div class="question">{Question}</div>
- </div>
- <div class="answering">
- {block:Answerer}
- <div class="answerer">{Answerer}</div>
- {/block:Answerer}
- <div class="answer">{Answer}</div>
- </div>
- {/block:Answer}
- {block:Chat}
- <!-------------- CHAT POST -------------->
- <ul class="chat">
- {block:Lines}
- <li>
- {block:Label}
- <div class="chat_label">
- <strong>{Label}</strong>
- </div>
- {/block:Label}
- <div class="chat_line">
- {Line}
- </div>
- </li>
- {/block:Lines}
- </ul>
- {/block:Chat}
- {block:Link}
- <!-------------- LINK POST -------------->
- <a href="{URL}" class="post_link">{Name}</a>
- {block:Description}<div class="link_desc"><br>{Description}</div>{/block:Description}
- {/block:Link}
- {block:Caption}
- <!-------------- CAPTION -------------->
- <div class="caption">
- {Caption}
- </div>
- {/block:Caption}
- </div>
- <!-------------- POST END AKA LIKE & REBLOG -------------->
- {block:Date}
- <div class="post_end">
- <a class="like-b" href="#">{LikeButton}<span class="b">like</span></a>
- <a href="{ReblogURL}" target="_blank" class="reblog_button">reblog</a>
- <!-- NOTES -->
- <a href="{Permalink}" class="note_count">
- {NoteCountWithLabel}
- </a>
- </div>
- <!-------------- TAGS -------------->
- {block:HasTags}
- <div class="tags">
- {block:Tags}
- <a href="{TagURL}">#{Tag}</a><span class="comma">, </span>
- {/block:Tags}
- </div>
- {/block:HasTags}
- {/block:Date}
- </article>
- {block:PostNotes}
- <!-- LIST OF NOTES (user liked/reblogged this) -->
- <div id="note_list">{PostNotes}</div>
- {/block:PostNotes}
- {/block:Posts}
- <!--- PAGINATION --->
- <nav id="nav">
- {block:Pagination}
- <div id="pagination">
- {block:JumpPagination length="5"}
- {block:JumpPage}
- <a href="{URL}" class="page_num">{PageNumber}</a>
- {/block:JumpPage}
- {block:CurrentPage}<span class="current_page">{PageNumber}</span>{/block:CurrentPage}
- {/block:JumpPagination}
- </div>
- {/block:Pagination}
- </nav>
- </main>
- <!-------------- NAVIGATION -------------->
- <nav id="links_1" class="links">
- <!-- DO NOT REMOVE THEME CREDITS -->
- <!-------------- CUSTOM LINKS -------------->
- <a href="/" class="home"><i data-feather="home"></i></a>
- <a href="{block:AskEnabled}/ask{/block:AskEnabled}" class="ask"><i data-feather="help-circle"></i></a>
- <a href="{block:SubmissionsEnabled}/submit{/block:SubmissionsEnabled}" class="submit_link"><i data-feather="mail"></i></a>
- <a href="/archive" class="archive"><i data-feather="book"></i></a>
- </nav>
- <nav id="links_2" class="links">
- <!-- DO NOT REMOVE THEME CREDITS -->
- <!-------------- CUSTOM LINKS -------------->
- <a href="{text:URL 1}" class="link1"><i data-feather="{text:URL 1 Icon}"></i></a>
- <a href="{text:URL 2}" class="link2"><i data-feather="{text:URL 2 Icon}"></i></a>
- <a href="{text:URL 3}" class="link3"><i data-feather="{text:URL 3 Icon}"></i></a>
- <a href="https://fallingforthemes.tumblr.com" class="thememaker"><i data-feather="code"></i></a>
- </nav>
- <!-------------- SIDEBAR -------------->
- <aside id="sidebar">
- <img src="{image:About Image}" class="siderbar_icon"/>
- <a href="/"><header class="default_title title">{Title}</header></a>
- <!-------------- USER INPUT TITLE -------------->
- {block:IfCustomTitle}
- <a href="/"><header class="custom_title title">{text:Custom Title}</header></a>
- {/block:IfCustomTitle}
- <div id="desc" class="desc">
- {Description}
- </div>
- </aside>
- <!-------------- SCRIPTS -------------->
- <script src="https://unpkg.com/@popperjs/core@2"></script>
- <script src="https://unpkg.com/tippy.js@6"></script>
- <script>
- tippy(".home",{
- content: 'Home',
- placement: 'bottom',
- animation: 'scale',
- });
- tippy(".ask",{
- content: 'Ask',
- placement: 'bottom',
- animation: 'scale',
- });
- tippy(".submit_link",{
- content: 'Submit',
- placement: 'bottom',
- animation: 'scale',
- });
- tippy(".archive",{
- content: 'Archive',
- placement: 'bottom',
- animation: 'scale',
- });
- tippy(".link1",{
- content: '{text:URL 1 Label}',
- placement: 'bottom',
- animation: 'scale',
- });
- tippy(".link2",{
- content: '{text:URL 2 Label}',
- placement: 'bottom',
- animation: 'scale',
- });
- tippy(".link3",{
- content: '{text:URL 3 Label}',
- placement: 'bottom',
- animation: 'scale',
- });
- tippy(".prev",{
- content: 'Prev',
- placement: 'bottom',
- animation: 'scale',
- });
- tippy(".next",{
- content: 'Next',
- placement: 'bottom',
- animation: 'scale',
- });
- tippy(".thememaker",{
- content: "thememaker",
- placement: 'bottom',
- animation: 'scale',
- });
- </script>
- <script>
- feather.replace()
- </script>
- <script>
- $('.controls-button').click(function(){
- $('body').toggleClass('controls-click');
- });
- $('.user').click(function(){
- $('#sidebar').toggle();
- $('.user').css('display', 'none');
- $('.close').css('display', 'inline-block');
- });
- $('.close').click(function(){
- $('#sidebar').toggle();
- $('.close').css('display', 'none');
- $('.user').css('display', 'inline-block');
- });
- {block:IfTagsHover}
- $('.posts').hover(function(){
- let str = "#" + this.id + " .tags";
- $(str).toggle("300");
- });
- {/block:IfTagsHover}
- </script>
- <script>
- function gatherData(images, arr) {
- for (let i = 0; i < images.length; i++) {
- let currentData = {
- "width": images[i].getAttribute('data-width'),
- "height": images[i].getAttribute('data-height'),
- "low_res": images[i].getAttribute('data-lowres'),
- "high_res": images[i].getAttribute('data-highres')
- };
- arr.push(currentData);
- }
- }
- function getIndex(elem) {
- let i = 0;
- while( (elem = elem.previousElementSibling) != null ) i++;
- return i;
- }
- function lightbox(elem) {
- let currentPhotoset = elem.parentNode;
- let photosetPhotos = currentPhotoset.getElementsByTagName('div');
- let data = [];
- gatherData(photosetPhotos, data);
- Tumblr.Lightbox.init(data, getIndex(elem) + 1);
- }
- </script>
- </body>
- </html>
Add Comment
Please, Sign In to add comment