Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "//www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
- <!-- octomoosey @ tumblr -->
- <html xmlns="//www.w3.org/1999/xhtml" xml:lang="en" lang="en">
- <head><title>{Title}</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}
- <!--- ••• Colour Variables ••• --->
- <meta name="color:background" content="#fff"/>
- <meta name="color:sidebarbg" content="#ff6f61"/>
- <meta name="color:sidebartext" content="#fff"/>
- <meta name="color:permalinkbg" content="#ff6f61"/>
- <meta name="color:permalinktext" content="#fff"/>
- <meta name="color:text" content="#6a6a6a"/>
- <meta name="color:bold" content="#ff6f61"/>
- <meta name="color:italic" content="#ff6f61"/>
- <meta name="color:scrollbar" content="#ff6f61"/>
- <meta name="color:borders" content="##ff6f61"/>
- <meta name="color:links" content="#ff6f61"/>
- <meta name="color:linkshover" content="#6a6a6a"/>
- <meta name="color:headertitle" content="#6a6a6a"/>
- <!--- ••• Image Variables ••• --->
- <meta name="image:header" content=""/>
- <!--- ••• If Variables ••• --->
- <meta name="if:infobox1" content="1"/>
- <meta name="if:infobox2" content="1"/>
- <meta name="if:infobox3" content="1"/>
- <meta name="if:infobox4" content="1"/>
- <meta name="if:infobox5" content="1"/>
- <!--- ••• Text Variables ••• --->
- <meta name="text:fontsize" content="11"/>
- <meta name="text:headertitle" content="octomoosey"/>
- <meta name="text:headersubtitle" content="Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aliquam nisi lorem, pulvinar id, commodo feugiat, vehicula et, mauris."/>
- <!--- ••• Links ••• --->
- <meta name="text:link 1" content="link 1"/>
- <meta name="text:link 1 url" content="/"/>
- <meta name="text:link 2" content="link 2"/>
- <meta name="text:link 2 url" content="/"/>
- <meta name="text:link 3" content="link 3"/>
- <meta name="text:link 3 url" content="/"/>
- <meta name="text:infotitle1" content="info one"/>
- <meta name="text:info1" content="Lorem ipsum dolor sit amet."/>
- <meta name="text:infotitle2" content="info two"/>
- <meta name="text:info2" content="Consectetuer adipiscing elit."/>
- <meta name="text:infotitle3" content="info three"/>
- <meta name="text:info3" content="Lorem ipsum dolor sit amet."/>
- <meta name="text:infotitle4" content="info four"/>
- <meta name="text:info4" content="Consectetuer adipiscing elit."/>
- <meta name="text:infotitle5" content="info five"/>
- <meta name="text:info5" content="Lorem ipsum dolor sit amet."/>
- <!--- ••• Fonts ••• --->
- <link href="//fonts.googleapis.com/css?family=Open+Sans:400,400i,700,700i" rel="stylesheet">
- <link rel="stylesheet" href="//use.fontawesome.com/releases/v5.7.2/css/all.css" integrity="sha384-fnmOCqbTlWIlj8LyTjo7mOUStjsKC4pOpQbqyi7RrhN7udi9RwhKkMHpvLbHG9Sr" crossorigin="anonymous">
- <style type="text/css">
- iframe.tmblr-iframe {
- z-index:99999999999999!important;
- top:10px!important;
- right:0!important;
- padding-right:20px;
- transform:scale(0.6);
- transform-origin:100% 0;
- -webkit-transform:scale(0.6);
- -webkit-transform-origin:100% 0;
- -o-transform:scale(0.6);
- -o-transform-origin:100% 0;
- -moz-transform:scale(0.6);
- -moz-transform-origin:100% 0;
- -ms-transform:scale(0.6);
- -ms-transform-origin:100% 0;}
- #tumblr_lightbox {
- background-color:rgba(255, 255, 255, .9)!important;
- z-index:99999!important;}
- #tumblr_lightbox img {opacity:0;}
- #tumblr_lightbox_caption {
- font-weight:normal!important;
- text-shadow:none!important;}
- #tumblr_lightbox_center_image, #tumblr_lightbox_left_image, #tumblr_lightbox_right_image {
- -moz-box-shadow:none!important;
- -webkit-box-shadow:none!important;
- box-shadow:none!important;
- -moz-border-radius:0px!important;
- -webkit-border-radius:0px!important;
- border-radius:0px!important;
- opacity:1!important;}
- #tumblr_lightbox_left_image, #tumblr_lightbox_right_image {opacity:.4!important;}
- ::-webkit-scrollbar{
- height:3px;
- width:4px;
- background:inherit;}
- ::-webkit-scrollbar-thumb {background:{color:scrollbar};}
- ::-webkit-scrollbar-track {background:{color:background};}
- ::-moz-selection {
- color:{color:selectiontext};
- background:{color:selectionbg};}
- ::selection {
- color:{color:selectiontext};
- background:{color:selectionbg};}
- body {
- overflow-x:hidden;
- background:{color:background};
- color:{color:text};
- font-family: 'Open Sans', sans-serif;
- line-height:150%;
- font-size: {text:fontsize}px;
- font-weight:normal;
- margin:0;}
- blockquote {
- padding-left:10px;
- border-left:1px solid {color:borders};
- margin:10px 0px 10px 0px;}
- .caption blockquote {
- margin:10px 0px 10px 0px;}
- blockquote img {
- max-width:100%;
- height:auto;}
- blockquote iframe {
- max-width:100%;
- height:auto;}
- img {
- max-width:100%;
- height:auto;}
- .caption img {
- max-width:100%;
- height:auto;}
- .post img {
- max-width:100%;
- margin-top:0px;
- margin-bottom:0px;}
- pre {
- font-family: 'Roboto', sans-serif;
- white-space: pre-wrap;
- white-space: -moz-pre-wrap;
- white-space: -pre-wrap;
- white-space: -o-pre-wrap;
- word-wrap: break-word;}
- a {
- text-decoration:none;
- font-size:calc({text:fontsize}px - 2px);
- text-transform:uppercase;
- color:{color:links};
- letter-spacing:1px;
- cursor:help;
- -webkit-transition: all 0.7s ease;
- transition: all 0.7s ease;
- -moz-transition: all 0.7s ease;
- -o-transition: all 0.7s ease;}
- a:hover {
- letter-spacing:1px;
- color:{color:linkshover};}
- p {
- margin:0px 0 10px 0;}
- b, strong {
- font-size:calc({text:fontsize}px - 2px);
- text-transform:uppercase;
- color:{color:bold};}
- i, em {
- color:{color:italic};}
- small, big {
- font-size:1em;}
- h1, h2, h3, h4 {
- font-size:26px;
- letter-spacing:2px;
- line-height:30px;
- text-align:center;}
- .media {
- margin-bottom:10px;}
- /* ---••• Post Styles •••--- */
- #content {
- margin-bottom:0px;
- margin-left:80px;
- width:calc(100% - 400px);
- opacity:0;
- -webkit-animation:fadeIn ease-in 1;
- -moz-animation:fadeIn ease-in 1;
- animation:fadeIn ease-in 1;
- -webkit-animation-fill-mode:forwards;
- -moz-animation-fill-mode:forwards;
- animation-fill-mode:forwards;
- -webkit-animation-duration:1.5s;
- -moz-animation-duration:1.5s;
- animation-duration:1.5s;
- -webkit-animation-delay: 0.2s;
- animation-delay: 0.2s;}
- @-webkit-keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
- @-moz-keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
- @keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
- #entries {
- margin:0px 0px 180px 0px;
- padding-top:50px;
- position:relative;
- left:50%;
- margin-left:-225px;
- width:500px;}
- .post {
- font-size{text:fontsize}px;
- position:relative;
- margin-bottom:100px;
- width:500px;}
- .perma {
- background:{color:permalinkbg};
- font-size: 8px;
- line-height:10px;
- margin-top:10px;
- text-transform:uppercase;
- letter-spacing:1px;
- text-align:center;
- color:{color:permalinktext};
- padding:15px;}
- .perma a {
- text-transform:uppercase;
- font-size:8px;
- letter-spacing:2px;
- padding-bottom:3px;
- color: {color:permalinktext};
- background-image: linear-gradient({color:permalinktext}, {color:permalinktext});
- background-position: calc(100% - 2px) 100% ;
- background-repeat: no-repeat;
- background-size: 0px 1px;
- transition: background-size 0.4s;}
- .perma a:hover {
- background-position: 0% 100%;
- background-size: calc(100% - 2px) 1px;}
- .pperma {
- margin-top:10px;}
- .pperma a {
- margin-right:5px;}
- .like-b {
- position:relative;
- display:inline-block;
- overflow:hidden;
- padding-bottom:1px;
- margin-bottom:-5px;}
- .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';}
- .tags {
- display: inline;}
- /* ---••• Post Notes •••--- */
- ol.notes {
- padding:0px;
- margin:25px 0px 0px -10px;
- list-style-type:none;}
- ol.notes li.note {
- padding:10px;}
- ol.notes li.note img.avatar {
- vertical-align:-4px;
- margin-right:10px;
- width:16px;
- height:16px;}
- ol.notes li.note span.action {
- font-weight:none;}
- ol.notes li.note .answer_content {
- font-weight:normal;}
- ol.notes li.note blockquote {
- padding:4px 10px;
- margin:10px 0px 0px 25px;}
- ol.notes li.note blockquote a {
- text-decoration:none;}
- /* ---••• Post Type Styling •••--- */
- .posttitle {
- font-weight:700;
- text-align:center;
- margin-bottom:5px;
- text-transform:uppercase;
- font-size:calc({text:fontsize}px + 4px);
- letter-spacing:2px;}
- /* ---••• Audio Player •••--- */
- .playwrap {
- margin-top:0px;
- position:relative;}
- .playbutton {
- position:relative;
- top:23px;
- margin-left:23px;
- z-index:6;
- width:33px;
- height:30px;
- overflow:hidden;}
- .albumart img {
- border:10px solid {color:permalinkbg};
- position:relative;
- margin-top:-30px;
- margin-left:0px
- height:60px;
- width:60px;}
- .trackinfo {
- margin-bottom:10px;
- color:{color:text};
- position:relative;
- margin-left:100px;
- height:70px;
- margin-top:-80px;
- margin-bottom:20px;}
- .trackname {
- position:relative;
- padding-top:25px;
- text-align:left;
- font-size:10px;
- text-transform:uppercase;
- font-weight: bold;
- letter-spacing:2px;}
- .artist {
- text-align:left;
- font-size:10px;
- text-transform:uppercase;
- letter-spacing:4px;}
- .album {
- text-align:left;
- font-style: italic;
- letter-spacing:4px;}
- /* ---••• Ask Posts •••--- */
- .question {
- padding:15px;
- margin-bottom:10px;
- background:{color:permalinkbg};
- color:{color:permalinktext};}
- .asker {
- text-transform:uppercase;
- text-align:center;
- font-size:calc({text:fontsize}px + 2px);
- margin-bottom:5px;}
- .asker a {
- color:{color:permalinktext};}
- /* ---••• Quote Posts •••--- */
- .quote {
- text-transform:uppercase;
- letter-spacing:2px;
- font-weight:700;}
- .source {
- text-align:center;
- margin:10px 0px;}
- /* ---••• Chat Posts •••--- */
- .ch {
- margin-bottom:10px;}
- /* ---••• Header •••--- */
- {block:IndexPage}
- #header {
- position:relative;
- margin-left:80px;
- width:calc(100% - 80px);
- height:calc(100vh - 80px);}
- #headerside {
- position:relative;
- height:calc(100% - 100px);
- margin-top:50px;
- margin-left:50px;
- width:calc(100% - 370px);
- background:#eee;
- background-image: url('{image:header}');
- background-position:center;
- background-repeat:no-repeat;
- background-attachment: absolute;
- -webkit-background-size: cover;
- -moz-background-size: cover;
- -o-background-size: cover;
- background-size: cover;
- overflow-x:hidden;}
- #headertitle {
- color:{color:headertitle};
- width:500px;
- text-align:right;
- position:absolute;
- bottom:130px;
- right:50px;
- font-size:44.5px;
- text-transform:uppercase;}
- #headersubtitle {
- margin-top:20px;
- font-size:calc({text:fontsize}px + 1px);}
- {/block:IndexPage}
- /* ---••• Sidebar •••--- */
- #sidebar {
- right:0px;
- padding:50px;
- width:220px;
- height:calc(100% - 100px);
- {block:IndexPage}
- position:absolute;
- margin-top:0px;
- {block:IndexPage}
- {block:PermalinkPage}
- position:fixed;
- top:0px;
- {/block:PermalinkPage}}
- #sidebar.sticky {
- position:fixed;
- top:0px;
- -webkit-transition: all 0.6s;
- -moz-transition: all 0.6s;
- -ms-transition:all 0.6s;
- -o-transition: all 0.6s;
- transition: all 0.6s;}
- #desc {
- margin-bottom:15px;
- width:220px;}
- .num {
- display:block;
- margin-bottom:3px;}
- .stats {
- display:inline-block;
- padding:0px 4px;
- text-transform:uppercase;
- letter-spacing:1px;
- font-weight:bold;
- position:relative;
- background:{color:text};
- color:{color:background};
- font-size:8px;
- margin-right:4px;}
- /* ---••• Navbar •••--- */
- #side {
- z-index:7;
- position:fixed;
- top:0px;
- left:0px;
- height:100%;
- width:80px;
- background:{color:sidebarbg};}
- #sidelinks {
- line-height:100%;
- position:fixed;
- bottom:70px;
- left:37px;
- transform: rotate(-90deg);
- transform-origin: 0% 0%;}
- #sidelinks a {
- text-transform:uppercase;
- font-size:11px;
- letter-spacing:2px;
- margin-right:15px;
- padding-bottom:3px;
- color: {color:sidebartext};
- background-image: linear-gradient({color:sidebartext}, {color:sidebartext});
- background-position: calc(100% - 2px) 100% ;
- background-repeat: no-repeat;
- background-size: 0px 1px;
- transition: background-size 0.4s;}
- #sidelinks a:hover {
- background-position: 0% 100%;
- background-size: calc(100% - 2px) 1px;}
- /* ---••• Footer •••--- */
- #footer {
- z-index:6;
- position:fixed;
- left:0px;
- bottom:0px;
- width:100%;
- background:{color:sidebarbg};
- color:{color:sidebartext};
- text-align:center;
- height:80px;}
- /* ---••• Search •••--- */
- #searchpos {
- top:30px;
- right:50px;
- position:absolute;}
- .sfm input {
- background:transparent;
- font-size: 10px;
- border: 0px;
- text-transform: uppercase;
- margin-top: 0px;
- color: {color:sidebartext};
- letter-spacing: 1px;
- padding: 4px 8px;}
- *:focus {
- outline: none;}
- input[type=text] {
- border-bottom:1px solid {color:sidebartext};}
- /* ---••• Pagination •••--- */
- #pagination {
- text-align:center;
- position:relative;
- background:{color:permalinkbg};
- color:{color:permalinktext};
- padding:15px}
- #pagination a {
- color:{color:permalinktext};
- margin:0px 3px;
- text-transform:uppercase;
- font-size:8px;
- letter-spacing:2px;}
- /* ---••• Misc •••--- */
- .item-wrapper {display:none;}
- .page-1 {display:block;}
- .om {
- position:fixed;
- bottom:34px;
- color:{color:sidebartext};}
- .om i {
- font-size:10px;
- color:{color:sidebartext};
- margin-left:37px;}
- #s-m-t-tooltip {
- max-width:300px;
- letter-spacing:1px;
- margin:10px;
- padding:5px 5px 5px 6px;
- border-radius:0px;
- background:{color:sidebarbg};
- color:{color:sidebartext};
- border:1px solid {color:sidebartext};
- z-index:999999;
- font-size:9px;
- font-style:none;
- font-weight:lighter;
- font-family:helvetica;
- text-transform:uppercase;}
- {CustomCSS}
- </style>
- </head>
- <!---••• Scripts Misc •••--->
- <script src="//static.tumblr.com/yzs4yqx/lOsokx99u/smoothscroll.min.js"></script>
- <script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
- <script src="//unpkg.com/imagesloaded@4/imagesloaded.pkgd.min.js"></script>
- <!---••• Tooltips •••--->
- <script src="//static.tumblr.com/fiw4iub/4jdnu5ta4/jquery.style-my-tooltips.js"></script>
- <script>
- (function($){
- $(document).ready(function(){
- $("a[title]").style_my_tooltips({
- tip_follows_cursor:true,
- tip_delay_time:90,
- tip_fade_speed:600,
- attribute:"title"
- });
- });
- })(jQuery);
- </script>
- <!---••• Sticky •••--->
- <script type="text/javascript">
- $(function(){
- var header = $('#sidebar').offset().top;
- $(window).scroll(function(){
- if( $(window).scrollTop() > header ) {
- $('#sidebar').addClass("sticky");
- } else {
- $('#sidebar').removeClass("sticky");
- }
- });
- });
- </script>
- <body>
- <div id="side">
- <div id="sidelinks">
- <a href="/">home</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}
- </div>
- <div class="om"><a href="//octomoosey.tumblr.com/" title="theme by octomoosey"><i class="fas fa-code"></i></a></div>
- </div>
- <div id="footer">
- <div id="searchpos">
- <form action="/search" method="get" class="sfm">
- <input type="submit" value="Search" id="sb"/>
- <input type="text" name="q" value="{SearchQuery}" id="sf"/>
- </form>
- </div>
- </div>
- {block:IndexPage}
- <div class="item-wrapper page-{CurrentPage}">
- <div id="header">
- <div id="headerside"></div>
- <div id="headertitle">{text:headertitle}
- <div id="headersubtitle">{text:headersubtitle}</div>
- </div>
- </div>
- </div>
- {/block:IndexPage}
- <div id="sidebar">
- <div id="desc">
- {description}
- </div>
- {block:ifinfobox1}<div class="num"><div class="stats">{text:infotitle1}:</div>{text:info1}</div>{/block:ifinfobox1}
- {block:ifinfobox2}<div class="num"><div class="stats">{text:infotitle2}:</div>{text:info2}</div>{/block:ifinfobox2}
- {block:ifinfobox3}<div class="num"><div class="stats">{text:infotitle3}:</div>{text:info3}</div>{/block:ifinfobox3}
- {block:ifinfobox4}<div class="num"><div class="stats">{text:infotitle4}:</div>{text:info4}</div>{/block:ifinfobox4}
- {block:ifinfobox5}<div class="num"><div class="stats">{text:infotitle5}:</div>{text:info5}</div>{block:ifinfobox5}
- </div>
- </div>
- <div id="content">
- <div id="entries">
- {block:Posts}
- <div data-aos="fade-up" class="post" id="{PostID}">
- {block:Text}
- {block:Title}<div class="posttitle">{Title}</div>{/block:Title}
- {Body}
- {/block:Text}
- {block:Link}
- <div class="posttitle"><a href="{URL}" >{Name}</a></div>
- {block:Description}{Description}{/block:Description}
- {/block:Link}
- {block:Photo}
- <div class="media">{LinkOpenTag}<img src="{PhotoURL-HighRes}" width="100%">{LinkCloseTag}</div>
- {/block:Photo}
- {block:Photoset}
- {Photoset-500}
- {/block:Photoset}
- {block:Video}
- {Video-500}
- {/block:Video}
- {block:Audio}
- {block:AudioPlayer}
- <div class="playwrap">
- <div class="playbutton">{AudioPlayerGrey}</div>
- {block:AlbumArt}<div class="albumart"><img src="{AlbumArtURL}"></div>{/block:AlbumArt}
- <div class="trackinfo">
- <div class="trackname">
- {block:TrackName}{TrackName}{/block:TrackName}
- </div>
- <div class="artist">
- {block:Artist}{Artist}{/block:Artist}
- </div>
- <div class="album">
- {block:Album}{Album}{/block:Album}
- </div>
- </div>
- </div>
- {/block:AudioPlayer}
- {/block:Audio}
- {block:Quote}
- <div class="quote">"{Quote}"</div>
- {block:Source}<div class="source">{Source}</div>{/block:Source}
- {/block:Quote}
- {block:Chat}
- {block:Title}<div class="posttitle">{Title}</div>{/block:Title}
- <div class="ch">{block:Lines}
- {block:Label}<strong>{Label}</strong> {Line}</br>{/block:Label}
- {/block:Lines}</div>
- {/block:Chat}
- {block:Answer}
- <div class="question">
- <div class="asker">{Asker}</div>
- {Question}
- </div>
- {Answer}
- {/block:Answer}
- {block:Caption}<div class="caption">{Caption}</div>{/block:Caption}
- {block:Date}
- <div class="perma">
- <a href="{Permalink}">{DayOfMonthWithZero}.{MonthNumberWithZero}</a> · {block:NoteCount}<a href="{Permalink}">{NoteCount}n</a> · {/block:NoteCount}
- <a href="{ReblogURL}">reblog</a> ·
- <a class="like-b" href="#">{LikeButton}<span class="b">Like</span></a>
- </div>
- {block:Date}
- {block:PermalinkPage}
- <div class="pperma">
- {block:Date}
- <a href="{ReblogParentURL}" title="{ReblogParentName}"><i class="fas fa-bookmark"></i> {lang:via}</a> <a href="{ReblogRootURL}" title="{ReblogRootName}"><i class="fas fa-bookmark"></i> {lang:source}</a>{/block:RebloggedFrom}
- {/block:Date}
- {block:HasTags}
- <div class="tags">
- {block:Tags}<a href="{TagURL}"><i class="fas fa-hashtag"></i> {Tag}</a>{/block:Tags}.
- </div>
- {/block:HasTags}
- {block:PostNotes}
- {PostNotes}
- {/block:PostNotes}
- </div>
- {/block:PermalinkPage}
- </div>
- {/block:Posts}
- {block:IndexPage}
- <div data-aos="fade-up" id="pagination">
- {block:Pagination}
- {block:PreviousPage}<a href="{PreviousPage}">Prev</a>{/block:PreviousPage}
- {lang:Page CurrentPage of TotalPages}
- {block:NextPage}<a href="{NextPage}">Next</a>{/block:NextPage}
- {/block:Pagination}
- </div>
- {/block:IndexPage}
- </div>
- {block:ContentSource}<!-- {SourceURL}
- {block:SourceLogo}<img src="{BlackLogoURL}"width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" />{/block:SourceLogo}
- {block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo} -->
- {/block:ContentSource}
- <!--{block:NoRebloggedFrom}{block:RebloggedFrom}{ReblogParentName}{/block:RebloggedFrom}{/block:NoRebloggedFrom} -->
- </div>
- </div>
- <!---••• AOS •••--->
- <link rel="stylesheet" href="//static.tumblr.com/uopakca/prpov76n6/aos.css" />
- <script src="//static.tumblr.com/uopakca/L8aov76mb/aos.js"></script>
- <script>
- AOS.init();
- </script>
- </body>
- </html>
Add Comment
Please, Sign In to add comment