Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- <!DOCTYPE html>
- <html>
- <head>
- <!--
- Ryuk Theme by Mangolias
- ~ mangolias.tumblr.com ~
- Credits: pxu photosets by pixel union
- icons by feathericons.com
- responsive videos by nouvae.tumblr.com
- -->
- <title>{Title}</title>
- <link rel="shortcut icon" href="{Favicon}">
- {block:Description}
- <meta name="description" content="{MetaDescription}">
- {/block:Description}
- <meta name="viewport" content="width=device-width, initial-scale=1.0">
- <meta name="image:Sidebar" content="">
- <meta name="if:Show Avatar" content="">
- <meta name="if:Full Photosets" content="">
- <meta name="if:Infinite Scroll" content="0">
- <meta name="color:Background" content"#2a2a2a"/>
- <meta name="color:Sidebar" content"#272727"/>
- <meta name="color:Posts" content="#242424"/>
- <meta name="color:Text" content="#929292"/>
- <meta name="color:Post Text" content="#b0b0b0"/>
- <meta name="color:Audio Color" content="#f5f5f5"/>
- <meta name="color:Hover Color" content="#f5f5f5"/>
- <meta name="color:Borders" content="#282828"/>
- <meta name="color:Shadow" content="#242424"/>
- <meta name="color:Button" content="#242424"/>
- <meta name="color:Scrollbar" content="#222222"/>
- <meta name="text:Home" content="Home">
- <meta name="text:Ask" content="Ask">
- <meta name="text:Submit" content="Submit">
- <meta name="text:Archive" content="Archive">
- <meta name="text:Link One" content="">
- <meta name="text:Link One URL" content="">
- <meta name="text:Link Two" content="">
- <meta name="text:Link Two URL" content="">
- <meta name="text:Link Three" content="">
- <meta name="text:Link Three URL" content="">
- <meta name="text:Tag One" content="">
- <meta name="text:Tag Two" content="">
- <meta name="text:Tag Three" content="">
- <link href="https://fonts.googleapis.com/css?family=Karla:400,400i,700,700i&display=swap" rel="stylesheet">
- <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
- <style type="text/css">
- body {
- margin: 0;
- background-color: {color:Background};
- color: {color:Text};
- font-size: 12px;
- font-family: 'Karla', sans-serif;
- word-spacing: 1px;
- word-wrap: break-word;
- -webkit-font-smoothing: antialiased;
- font-smoothing: antialiased
- }
- a {
- text-decoration: none;
- color: {color:Text};
- -webkit-transition: 0.4s;
- transition: 0.4s;
- }
- a:hover {
- color: {color:Hover Color};
- }
- h1, h2, h3, h4 {
- font-size: 13px;
- font-weight: 700;
- font-family: 'Karla', sans-serif;
- }
- hr {
- border: none;
- box-shadow: 0;
- margin: 1em auto;
- border-top: 1px solid {color:Background};
- }
- img {
- border: 0;
- max-width: 100%;
- height: auto;
- display: block;
- }
- b, strong {
- font-weight: 700;
- }
- ul {
- list-style: none;
- padding: 0;
- }
- .thin {
- font-weight: 400;
- }
- .title {
- font-weight: bold;
- }
- .up {
- text-transform: uppercase;
- }
- .accent {
- font-style: italic;
- }
- blockquote {
- margin: 0;
- }
- blockquote img {
- width: 100%;
- height: auto;
- }
- p img {
- width: 100%;
- height: auto;
- }
- /* aside */
- aside {
- padding: 50px 100px 40px;
- background-color: {color:Sidebar};
- text-align: right;
- }
- nav {
- line-height: 12px;
- font-size: 11px;
- }
- nav li {
- list-style-type: none;
- display: inline-block;
- }
- nav a {
- display: inline-block;
- margin: 0 .5em .5em 0;
- color: {color:Text};
- border-bottom: 2px solid {color:Text};
- }
- aside section {
- margin: 0 auto;
- max-width: 300px;
- min-width: 100px;
- }
- aside section:not(:first-child) {
- margin-top: 1.8em;
- }
- aside .sideimg {
- display: none;
- }
- aside .avatar {
- width: 50px;
- border-radius: 3px;
- margin-bottom: 40px;
- }
- aside .avatar.circle {
- border-radius: 50%;
- }
- aside .avatar img {
- display: block;
- }
- aside .title a {
- font-family: 'Karla', sans-serif;
- font-weight: normal;
- font-weight: 700;
- }
- aside .description {
- font-size: 12px;
- padding: 10px 0 0 0;
- }
- .taglist {
- font-style: italic;
- list-style-type: none;
- opacity: .5;
- line-height: 14px;
- }
- .taglist li {
- display: inline-block;
- padding-right: 3px;
- }
- /* content */
- #content {
- background-color: {color:Background};
- }
- .entry {
- position: relative;
- width: 100%;
- padding: 20px;
- -moz-box-sizing: border-box;
- box-sizing: border-box;
- }
- {block:IndexPage}
- .entry {
- opacity:0;
- z-index:-1;
- }
- {/block:IndexPage}
- .entry:last-child {
- margin-bottom: 0;
- }
- .post {
- max-width: 300px;
- margin: 0 auto;
- padding: 0;
- border: 1px solid {color:Borders};
- -moz-box-shadow: 2px 2px 20px {color:Shadow};
- -webkit-box-shadow: 2px 2px 20px {color:Shadow};
- box-shadow: 2px 2px 20px {color:Shadow};
- border-radius: 4px;
- }
- .post img {
- border-radius: 3px;
- }
- .post .media {
- position: relative;
- }
- {block:IndexPage}
- .post:hover {
- opacity: 1;
- -webkit-transition: 0.7s;
- transition: 0.7s;
- }
- {/block:IndexPage}
- .post .hv {
- opacity: 0;
- z-index: 10000001;
- position: absolute;
- top: 50%;
- left: 50%;
- transform: translate(-50%, -50%);
- }
- {block:IndexPage}
- .post:hover .hv {
- opacity: 1;
- -webkit-transition: 0.6s;
- transition: 0.6s;
- }
- {/block:IndexPage}
- .button {
- background-color: {color:Button};
- padding: 5px 7px;
- border-radius: 3px;
- }
- /* posts */
- .text {
- margin: 20px;
- }
- .quote {
- margin: 20px;
- text-align: center;
- font-weight: 700;
- font-size: 13px;
- font-family: 'Karla', sans-serif;
- }
- .quotetext {
- margin: 0 20px 20px 20px;
- padding: 5px 0;
- }
- .mark {
- font-size: 20px;
- line-height: 13px;
- font-weight: 700;
- }
- .chat {
- line-height: 20px;
- }
- .asker {
- margin: 20px 40px 5px 20px;
- }
- .asker a {
- margin: 20px 0 5px 0;
- }
- .question {
- padding: 15px;
- border-radius: 0 7px 7px 7px;
- background-color: {color:Audio Color};
- line-height: 15px;
- margin: 0 20px;
- }
- .answerer {
- margin: 20px 0 20px;
- }
- .answer {
- padding: 5px 15px 5px 5px;
- border-radius: 7px 0 7px 7px;
- line-height: 15px;
- margin: 0 20px;
- }
- .video {
- max-width: 100%;
- height: auto;
- }
- .soundcloud_audio_player {
- max-height: 200px!important;
- }
- .spotify_audio_player {
- max-height: 80px!important;
- }
- .link {
- position: relative;
- padding: 10px;
- border-radius: 3px;
- }
- .linkname {
- padding: 10px;
- line-height: 20px;
- font-weight: bold;
- }
- .link a {
- border-bottom: 2px solid {color:Text};
- }
- .linkdesc {
- padding-top: 10px;
- line-height: 15px;
- font-weight: normal;
- }
- /* audio */
- .audio {
- position: relative;
- background-color: {color:Audio Color};
- padding: 40px 20px;
- border-radius: 3px;
- }
- .player {
- width: 30px;
- height: 30px;
- overflow: hidden;
- position: absolute;
- margin: 0 0 0 5px;
- opacity: .5;
- }
- .track {
- margin: 0 0 0 45px;
- vertical-align: middle;
- font-family: 'Karla', sans-serif;
- font-weight: 700;
- font-size: 13px;
- padding-left: 5px;
- }
- /* controls */
- .controls {
- padding-bottom: 20px;
- }
- .controlsreblog {
- color: {color:Post Text};
- box-sizing: border-box;
- float: right;
- border-bottom: 2px solid {color:Text};
- }
- .timestamp {
- color: {color:Post Text};
- box-sizing: border-box;
- float: left;
- border-bottom: 2px solid {color:Text};
- }
- .pagination {
- display: none;
- position: relative;
- width: 85%;
- max-width: 500px;
- text-align: center;
- margin: 0 auto;
- left: 0;
- bottom: 20px;
- color: {color:Post Text};
- }
- /* info */
- .info {
- padding: 0;
- color: {color:Post Text};
- }
- .info a {
- color: {color:Post Text};
- }
- .info a:hover {
- color: {color:Hover Color};
- }
- .comma:last-child {
- display: none;
- }
- .tags a {
- text-decoration: none;
- }
- .tags a:hover {
- color: {color:Hover Color};
- }
- .caption {
- padding: 0px 20px;
- background-color: {color:Posts};
- }
- .caption img {
- max-width: 100%;
- height: auto;
- }
- .permalink {
- padding: 20px;
- background-color: {color:Posts};
- }
- /* notecontainer */
- .notecontainer {
- padding-top: 20px;
- margin-top: 15px;
- background-color: {color:Posts};
- margin-bottom: 20px;
- }
- .notecontainer ol.notes {
- list-style-type: none;
- padding-left: 20px;
- }
- .notecontainer img.avatar {
- vertical-align: middle;
- width: 26px;
- margin: 6px 0;
- opacity: 0.6;
- -webkit-transition: 0.4s;
- transition: 0.4s;
- border-radius: 0;
- }
- .notecontainer img.avatar:last-child {
- padding-right: 5px;
- }
- .notecontainer img.avatar:hover {
- opacity: 1;
- }
- .notecontainer ol.notes li.note {
- overflow: hidden;
- width: 38px;
- height: 38px;
- display: inline-block;
- }
- .notecontainer ol.notes li.note:last-child {
- display: block;
- width: 225px;
- padding: 10px 0 30px;
- }
- /* media screen */
- @media only screen and (min-width: 900px) {
- .content {
- margin: 60px 40px 40px 530px;
- }
- .entry {
- margin: 0px;
- float: left;
- width: 300px;
- display: -moz-inline-stack;
- display: inline-block;
- }
- .post {
- margin: 0;
- }
- .entry:nth-child(4n+0) {
- clear: left;
- }
- aside {
- position: fixed;
- float: right;
- top: 0;
- left: 0;
- bottom: 0;
- margin: 0;
- width: 470px;
- padding: 80px 100px 40px;
- -moz-box-sizing: border-box;
- box-sizing: border-box;
- border-right: 1px solid {color:Borders};
- }
- aside .sideimg {
- display: block;
- }
- aside nav li {
- display: block;
- }
- .pagination {
- margin: 0 40px;
- }
- .taglist {
- padding-top: 10px;
- }
- .taglist li {
- display: block;
- }
- }
- /* other */
- #theme {
- position: fixed;
- font-size: 13px;
- right: 15px;
- bottom: 25px;
- width: 16px;
- height: 15px;
- padding: 2px 2px 3px;
- text-align: center;
- color: #929292;
- background-color: #272727;
- border-radius: 50%;
- }
- ::-webkit-scrollbar {
- width: 15px;
- height: 15px;
- }
- ::-webkit-scrollbar {
- background-color: {color:Background};
- }
- ::-webkit-scrollbar-track {
- background-color: {color:Background};
- border: 5px solid {color:Background};
- }
- ::-webkit-scrollbar-thumb {
- background-color: {color:Scrollbar};
- border: 5px solid {color:Background};
- border-radius: 10px;
- min-height: 24px;
- min-width: 24px;
- }
- ::-webkit-scrollbar-corner {
- background-color:{color:Background};
- }
- </style>
- <!-- pixel union photoset for margins -->
- <link href="https://static.tumblr.com/qudkd6d/OcDnl99gb/style.css" rel="stylesheet" type="text/css"/>
- <script src="https://static.tumblr.com/qudkd6d/Az6nkemqr/pxuphotoset.min.js"></script>
- <!-- feathericons.com -->
- <link href="https://static.tumblr.com/kmw8hta/oSwpvpnik/feather.css" rel="stylesheet">
- <!-- nouvae responsive videos -->
- <script src="https://rawgit.com/robinpx/tumblr/master/scripts/flexibleFrames/flexibleFrames.min.js"></script>
- <script>
- $(document).ready(function() {
- flexibleFrames($(".video"));
- });
- </script>
- </head>
- <body>
- <aside>
- {block:IfSidebarImage}
- <section>
- <a href="/"><img class="sideimg" src="{image:Sidebar}"></a>
- </section>
- {/block:IfSidebarImage}
- <section>
- {block:IfShowAvatar}
- <a href="/"><img src="{PortraitURL-128}" class="avatar {AvatarShape}"></a>
- {/block:IfShowAvatar}
- <div class="title"><a href="/">{Title}</a></div>
- <div class="description">{Description}</div>
- </section>
- <section><nav class="title">
- {block:IfHome}
- <a href="/">{text:Home}</a>
- {/block:IfHome}
- {block:AskEnabled}
- {block:IfAsk}
- <li><a href="/ask">{text:Ask}</a></li>
- {/block:IfAsk}
- {/block:AskEnabled}
- {block:SubmissionsEnabled}
- {block:IfSubmit}
- <li><a href="/submit">{text:Submit}</a></li>
- {/block:IfSubmit}
- {/block:SubmissionsEnabled}
- {block:IfArchive}
- <li><a href="/archive">{text:Archive}</a></li>
- {/block:IfArchive}
- <!-- {block:HasPages}{block:Pages}
- <li><a href="{URL}">{Label}</a></li>
- {/block:Pages}{/block:HasPages} -->
- {block:IfLinkOne}<li><a href="{text:Link One URL}">{text:Link One}</a>{/block:IfLinkOne}
- {block:IfLinkTwo}<li><a href="{text:Link Two URL}">{text:Link Two}</a>{/block:IfLinkTwo}
- {block:IfLinkThree}<li><a href="{text:Link Three URL}">{text:Link Three}</a>{/block:IfLinkThree}
- </nav>
- <div class="taglist">
- {block:IfTagOne}<li><a href="/tagged/{text:Tag One}">#{text:Tag One} </a></li>{/block:IfTagOne}
- {block:IfTagTwo}<li><a href="/tagged/{text:Tag Two}">#{text:Tag Two} </a></li>{/block:IfTagTwo}
- {block:IfTagThree}<li><a href="/tagged/{text:Tag Three}">#{text:Tag Three} </a></li>{/block:IfTagThree}
- </div>
- </section>
- </aside>
- <div class="content"> {block:Posts}
- <article class="entry" id="{PostID}">
- <section class="post">
- <span class="hv">
- <a href="{Permalink}" class="accent button">
- <span class="fx fx-eye"></span> see post
- </a>
- </span>
- <!-- audio -->
- {block:Audio}
- <div class="audio">
- {block:AudioPlayer}
- <div class="player">{AudioPlayer}</div>
- {/block:AudioPlayer}
- {block:TrackName}
- <div class="track">{TrackName}
- {/block:TrackName}
- <br>
- {block:Artist}
- <span class="accent thin">— by {Artist}</span></div>
- {/block:Artist}
- </div>
- {/block:Audio}
- <!-- photo -->
- {block:Photo}
- <div class="media">
- {LinkOpenTag}
- <a href="{Permalink}">
- <img src="{PhotoURL-HighRes}"/></a>
- {LinkCloseTag}
- </div>
- {/block:Photo}
- <!-- photoset -->
- {block:Photoset}
- <div class="media photoset">
- {block:PermalinkPage}
- <!-- pixel union photosets -->
- <div class="photo-slideshow" id="photoset_{PostID}" data-layout="{PhotosetLayout}">
- {block:Photos}
- <div class="photo-data">
- <div class="pxu-photo">
- <img src="{PhotoURL-500}" width="{PhotoWidth-500}" height="{PhotoHeight-500}" data-highres="{PhotoURL-HighRes}" data-width="{PhotoWidth-HighRes}" data-height="{PhotoHeight-HighRes}">
- </div>
- <a class="tumblr-box" rel="post-{PostID}" href="{PhotoURL-HighRes}"></a>
- </div>{/block:Photos}
- </div>
- <!-- pxel union photoset ends -->
- {/block:PermalinkPage}
- {block:ifFullPhotosets}
- {block:IndexPage}
- <!-- pixel union photosets -->
- <div class="photo-slideshow" id="photoset_{PostID}" data-layout="{PhotosetLayout}">
- {block:Photos}
- <div class="photo-data">
- <div class="pxu-photo">
- <img src="{PhotoURL-500}" width="{PhotoWidth-500}" height="{PhotoHeight-500}" data-highres="{PhotoURL-HighRes}" data-width="{PhotoWidth-HighRes}" data-height="{PhotoHeight-HighRes}">
- </div>
- <a class="tumblr-box" rel="post-{PostID}" href="{PhotoURL-HighRes}"></a>
- </div>{/block:Photos}
- </div>
- <!-- pxel union photoset ends -->
- {/block:IndexPage}
- {/block:ifFullPhotosets}
- {block:ifNotFullPhotosets}
- {block:IndexPage}
- {block:Photos}<img src="{PhotoURL-HighRes}">
- <!--{/block:Photos}-->
- {/block:IndexPage}
- {/block:ifNotFullPhotosets}
- </div>
- {/block:Photoset}
- <!-- text -->
- {block:Text}
- {block:Title}<h1 class="text">{Title}</h1>{/block:Title}
- <div class="text">{Body}</div>
- {/block:Text}
- <!-- quote -->
- {block:Quote}
- <div class="quote"><span class="mark">“ </span>{Quote}<span class="mark"> „</span></div>
- {block:Source}<div class="quotetext">— {Source}</div>{/block:Source}
- {/block:Quote}
- <!-- video -->
- {block:Video}
- <div class="videowrap">
- <div class="video">
- {Video-250}
- </div></div>
- {/block:Video}
- <!-- questions and answers -->
- {block:Answer}
- <div class="asker"><span class="title">{Asker}:</span><br/></div>
- <div class="question">{Question}<br/></div>
- <div class="answer">{Answer}</div>
- {/block:Answer}
- <!-- chat posts -->
- {block:Chat}
- <div class="chat text">
- {block:Title}<div class="title">{Title}</div>{/block:Title}
- {block:Lines}
- {block:Label}<strong>{Label}</strong>{/block:Label} {Line}<br/>
- {/block:Lines}</div>
- {/block:Chat}
- <!-- link posts -->
- {block:Link}<div class="link">
- <div class="linkname"><a href="{URL}">{Name}</a>
- <div class="linkdesc">{block:Excerpt}{Excerpt}{/block:Excerpt}</div></div>
- </div>{/block:Link}
- <!-- info -->
- {block:Date}
- <div class="info">
- {block:PermalinkPage}
- <div class="permalink">
- {block:Date}<div class="controls title">
- <a href="{Permalink}" class="timestamp">{ShortMonth} {dayofmonth}{dayofmonthsuffix}</a>
- <a href="{ReblogURL}" target="_blank" class="controlsreblog">
- <span class="fx fx-external-link"></span>
- Reblog</a>
- </div>{/block:Date}
- <!-- caption -->
- {block:Caption}
- <div class="caption">
- {Caption}
- </div>
- {/block:Caption}
- {block:RebloggedFrom}
- Via: <a href="{ReblogParentURL}">{ReblogParentName}</a><br>
- {block:ContentSource}
- Source: <a href="{ReblogRootURL}">{ReblogRootName}</a>
- {/block:ContentSource}
- {/block:RebloggedFrom}
- <!-- tags -->
- {block:HasTags}
- <div class="tags">Tagged:
- {block:Tags}
- <a href="{TagURL}"> {Tag}</a><span class="comma">,</span>
- {/block:Tags}
- </div>
- {/block:HasTags}
- {/block:PermalinkPage}
- </div> {/block:Date}
- </section>
- </article>
- <!-- post notes -->
- {block:PostNotes}
- <article class="entry">
- <section class="post notecontainer">
- <span class="text title">{block:NoteCount}{NoteCountWithLabel}{/block:NoteCount}</span>
- {PostNotes-64}
- </section>
- </article>
- {/block:PostNotes}
- {/block:Posts}
- <!-- {block:ContentSource}{SourceURL}{/block:ContentSource}{block:RebloggedFrom}{ReblogRootURL}{ReblogParentURL}{/block:RebloggedFrom} -->
- <!-- pagination -->
- <div class="pagination">
- {/block:Pagination}
- {block:PreviousPage}
- <a class="previous_page" href="{PreviousPage}">Previous /</a>
- {/block:PreviousPage}
- {block:NextPage}
- <a class="next_page" href="{NextPage}"> Next page</a>
- {/block:NextPage}
- </div>
- {/block:Pagination}
- </div> <!-- div class content end -->
- <a id="theme" href="https://mangolias.tumblr.com/" target="_blank">+</a></div>
- <!-- inf maso pixel union-->
- {block:IndexPage}
- <script src="https://static.tumblr.com/6hsqxdt/QBym35odk/jquery.masonry.js"></script>
- {block:ifInfiniteScroll}
- <script src="https://static.tumblr.com/wgijwsy/u2vm2hxv6/jquery.infinitescroll.min.js"></script>
- {/block:ifInfiniteScroll}
- {/block:IndexPage}
- <script>
- $(document).ready(function(){
- $('.photo-slideshow').pxuPhotoset({
- lightbox: true,
- rounded: false,
- gutter: '1px',
- photoset: '.photo-slideshow',
- photoWrap: '.photo-data',
- photo: '.pxu-photo'
- });
- {block:IndexPage}
- var $container = $('.content');
- $container.masonry({ itemSelector: '.entry' });
- $container.imagesLoaded(function(){
- $container.masonry();
- $container.find('.entry').animate({ opacity: 1, zIndex: 1 });
- });
- {block:ifInfiniteScroll}
- $container.infinitescroll({
- itemSelector: '.entry',
- navSelector: '.pagination',
- nextSelector: '.next_page',
- loadingImg: '',
- loadingText: '<em></em>',
- bufferPx: 2000
- },
- function( newElements ) {
- var $newElems = $( newElements );
- $newElems.find('.photo-slideshow').pxuPhotoset({
- lightbox: true,
- rounded: false,
- gutter: '1px',
- photoset: '.photo-slideshow',
- photoWrap: '.photo-data',
- photo: '.pxu-photo'
- },
- function(){
- $container.masonry();
- });
- $newElems.imagesLoaded(function(){
- $container.masonry( 'appended', $newElems );
- $newElems.animate({ opacity: 1, zIndex: 1 });
- });
- });
- {/block:ifInfiniteScroll}
- {/block:IndexPage}
- });
- </script>
- </body>
- </html>
Advertisement
Add Comment
Please, Sign In to add comment