Advertisement
Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
- <!--
- theme #31 by Paige @ neonbikethemes.tumblr.com
- last updated 2/16/17
- rules:
- - Do not steal code or design
- - Edit as much as you want but don't remove credit!
- - Like/reblog the post
- credits
- - base code by hoenarry
- - pixel union photoset script (tutorial by shythemes)
- -->
- <html xmlns="http://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}
- <meta name="color:Color 1" content="#a4dfe9"/>
- <meta name="color:Color 2" content="#f4bcb6"/>
- <meta name="color:header text" content="#ffffff"/>
- <meta name="color:container" content="#ffffff"/>
- <meta name="color:border" content="#ececec"/>
- <meta name="color:text" content="#565656"/>
- <meta name="select:Font" content="ABeeZee" title="ABeeZee">
- <meta name="select:Font" content="Karla" title="Karla">
- <meta name="select:Font" content="Open Sans" title="Open Sans">
- <meta name="select:Font" content="Roboto" title="Roboto">
- <meta name="select:Font" content="Rubik" title="Rubik">
- <meta name="select:Font" content="PT Sans" title="PT Sans">
- <meta name="select:Font" content="Roboto Slab" title="Roboto Slab">
- <meta name="select:Font" content="Source Sans Pro" title="Source Sans Pro">
- <meta name="select:Font" content="Helvetica" title="Helvetica">
- <meta name="select:Font Size" content="9px" title="9px">
- <meta name="select:Font Size" content="10px" title="10px">
- <meta name="select:Font Size" content="11px" title="11px">
- <meta name="select:Font Size" content="12px" title="12px">
- <meta name="select:Post Width" content="250" title="250px">
- <meta name="select:Post Width" content="275" title="275px">
- <meta name="select:Post Width" content="300" title="300px">
- <meta name="select:Post Width" content="325" title="325px">
- <meta name="select:Post Width" content="350" title="350px">
- <meta name="select:Post Width" content="375" title="375px">
- <meta name="select:Post Width" content="400" title="400px">
- <meta name="text:link 1" content="">
- <meta name="text:link 1 url" content="/">
- <meta name="text:link 2" content="">
- <meta name="text:link 2 url" content="/">
- <meta name="text:link 3" content="">
- <meta name="text:link 3 url" content="/">
- <meta name="text:link 4" content="">
- <meta name="text:link 4 url" content="/">
- <meta name="text:link 5" content="">
- <meta name="text:link 5 url" content="/">
- <meta name="image:topbar" content="/">
- <meta name="if:Hide Captions" content= "0" />
- <meta name="if:Grayscale Posts" content= "0" />
- <meta name="if:Faded Posts" content= "0" />
- <!-- FONTS -->
- <link href="https://fonts.googleapis.com/css?family=Open+Sans|PT+Sans|Roboto|Roboto+Slab|Rubik|Source+Sans+Pro" rel="stylesheet">
- <link href="https://fonts.googleapis.com/css?family=ABeeZee|Karla" rel="stylesheet">
- <link rel="stylesheet" href="https://cdn.linearicons.com/free/1.0.0/icon-font.min.css">
- <!-- PIXEL UNION PHOTOSET -->
- <!-- tutorial by shythemes -->
- <link href="https://static.tumblr.com/qudkd6d/OcDnl99gb/style.css" rel="stylesheet" type="text/css"/>
- <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
- <script src="https://static.tumblr.com/qudkd6d/Az6nkemqr/pxuphotoset.min.js"></script>
- <script>
- $(document).ready(function(){
- $('.photo-slideshow').pxuPhotoset({
- lightbox: true,
- rounded: false,
- gutter: '2px',
- borderRadius: '0px',
- photoset: '.photo-slideshow',
- photoWrap: '.photo-data',
- photo: '.pxu-photo'
- });
- });
- </script>
- <script src="http://static.tumblr.com/rzl30kg/eAxm7a751/jquery.style-my-tooltips.js"></script>
- <script>
- (function($){
- $(document).ready(function(){
- $("[title]").style_my_tooltips({
- tip_follows_cursor:true,
- tip_delay_time:0,
- tip_fade_speed:300
- }
- );
- });
- })(jQuery);
- </script>
- <style type="text/css">
- @import url(http://fonts.googleapis.com/css?family=Lato:300,400,700|Montserrat:400,700);
- ::-webkit-scrollbar {height: auto;width: 5px;}
- ::-webkit-scrollbar-thumb {background-color:{color:color 2};}
- ::-webkit-scrollbar-track{background-color:{color:container};}
- body {
- background-color:#fff;
- margin:0px;
- color:{color:text};
- font-size:{select:Font Size};
- font-family: {select:font}, helvetica;
- line-height:140%;
- }
- #bg{
- position:fixed;
- height:100vh;
- width:100vw;
- z-index:0;
- top:0;
- left:0;
- opacity:.7;
- background-color: {color:color 1};
- background: -webkit-linear-gradient({color:color 1}, {color:color 2});
- background: -o-linear-gradient({color:color 1}, {color:color 2});
- background: -moz-linear-gradient({color:color 1}, {color:color 2});
- background: linear-gradient({color:color 1}, {color:color 2});
- }
- a {
- text-decoration:none;
- color:{color:color 1};
- }
- a:hover{
- color:{color:color 2};
- font-style:none;
- -moz-transition-duration:0.5s;
- -webkit-transition-duration:0.5s;
- -o-transition-duration:0.5s;
- transition:.3s;
- }
- d
- img {
- border:none;
- max-width:100%;
- }
- blockquote {
- padding-left:10px;
- border-left:1px solid {color:color 2};
- margin:0;
- }
- h1 {
- font-size:calc({select:Font Size} + 3px);
- }
- #s-m-t-tooltip{
- max-width:250px;
- margin:15px;
- padding:6px 10px;
- border-radius:20px;
- background:{color:color 1};
- color:{color:header text};
- z-index:999999;
- font-size:{select:Font Size};
- font-family: {select:font}, helvetica;
- text-transform:uppercase;
- letter-spacing:1px;
- }
- .title{
- padding:15px 15px 5px 15px;
- font-size:calc({select:font size} + 6px);
- text-align:center;
- line-height:130%;
- }
- .titlebar{
- margin:5px 0 0 0;
- width:30px;
- height:3px;
- background:{color:color 2};
- display:inline-block;
- }
- .container {
- text-align:center;
- z-index:1;
- position:absolute;
- background:{color:container};
- width:calc({select:post width}px + 60px);
- left:50%;
- margin-left:calc((({select:post width}px + 60px) / 2) * -1);
- padding-bottom:50px;
- min-height:calc(100vh - 50px);
- }
- .post {
- padding:30px 30px 30px 30px;
- text-align:left;
- {block:IndexPage}
- border-bottom:1px solid {color:border};
- {/block:IndexPage}
- }
- .post img{
- max-width: 100%;
- }
- .btitle{
- color:{color:header text};
- letter-spacing:3px;
- font-weight:300;
- text-transform:uppercase;
- font-size:calc({select:font size} + 4px);
- margin:0 0 10px 0;
- padding:10px 0 10px 0;
- width: calc({select:post width}px + 60px);
- }
- .btitle a{
- color:{color:header text};
- }
- .btitle.sticky{
- top:0px;
- position:fixed;
- background:{color:color 1};
- font-size:calc({select:font size} + 0px);
- }
- .header {
- width: calc({select:post width}px + 60px);
- padding:0px;
- display:inline-block;
- position:relative;
- z-index:999;
- background:{color:color 1};
- text-align:center;
- }
- .tbimage{
- position:absolute;
- float:left;
- width:calc({select:post width}px + 55px);
- margin:30px 0 0 0;
- z-index:-1;
- }
- .tbimage img {
- width:75px;
- height:75px;
- border-radius:75px;
- }
- .description{
- background:{color:color 1};
- opacity:0;
- margin-top:30px;
- color:{color:header text};
- padding:20px 20px 0 20px;
- min-height:60px;
- -moz-transition-duration:0.5s;
- -webkit-transition-duration:0.5s;
- -o-transition-duration:0.5s;
- transition:.5s;
- line-height:140%;
- font-style:italic;
- }
- .description:hover{
- opacity:1;
- -moz-transition-duration:0.5s;
- -webkit-transition-duration:0.5s;
- -o-transition-duration:0.5s;
- transition:.5s;
- }
- .footer{
- left:50%;
- margin-left:calc((({select:Post Width}px + 60px) / 2) * -1);
- width:calc({select:Post Width}px + 60px);
- padding:15px 0 15px 0;
- position:fixed;
- bottom:0;
- z-index:5;
- background:{color:color 2};
- color:{color:header text};
- text-align:center;
- text-transform:uppercase;
- letter-spacing:2px;
- font-size:calc({select:font size} - 2px);
- }
- .footer a{
- padding:2px;
- color:{color:header text};
- margin: 0px 5px 0px 5px;
- text-decoration:none;
- -moz-transition-duration:.3s;
- -webkit-transition-duration:.3s;
- -o-transition-duration:.3s;
- transition:.3s;
- }
- .footer a:hover{
- color:{color:color 2};
- font-style:none;
- -moz-transition-duration:.3s;
- -webkit-transition-duration:.3s;
- -o-transition-duration:.3s;
- transition:.3s;
- }
- .pagination {
- font-size:calc({select:font size} + 2px);
- padding:30px;
- text-align:center;
- text-transform:uppercase;
- }
- .pagination a{
- color:{color:color 1};
- border:1px solid {color:color 1};
- border-radius:20px;
- padding:6px 7px 4px 7px;
- }
- .centernav{
- float:left;
- position:absolute;
- width:100px;
- margin-left:calc(({select:Post Width}px - 100px) / 2);
- }
- .caption {
- padding:0px;
- border-bottom:1px solid {color:border};
- margin-bottom:-1px;
- background:{color:container};
- }
- .caption img{
- height:auto;
- max-width:100%;
- margin-top:5px;
- }
- .tumblr_parent {
- margin:0;
- padding: 15px 15px 10px 15px;
- border: 1px solid {color:border};
- border-bottom:0px solid {color:border};
- }
- .tumblr_parent blockquote{
- margin:10px 0 0 0;
- padding:0 0 0 20px;
- border-left: 1px solid {color:color 2};
- }
- .tumblr_avatar {
- width:16px;
- border-radius:16px;
- margin: 0 10px -4px 0;
- }
- /* ANSWER */
- .ask {
- text-align:center;
- color:{color:text};
- }
- .ans {
- text-align:left;
- padding:10px;
- color:{color:text};
- }
- /* AUDIO */
- .audio {
- padding-bottom:10px;
- background-color:{color:infobg};
- text-align:center;
- }
- .albumart {
- position:relative;
- display:inline-block;
- margin:0 0 5px 0;
- }
- .albumart img {
- width:45px;
- height:45px;
- border-radius:45px;
- background-color:{color:color 1};
- }
- .playercontainer {
- position:absolute;
- float:left;
- z-index:3;
- text-align:left;
- background-color:#ffffff;
- margin:;
- width:27px;
- height:27px;
- border-radius:40px;
- overflow:hidden;
- margin:9px 0 0 9px;
- opacity:.3;
- -moz-transition-duration:.3s;
- -webkit-transition-duration:.3s;
- -o-transition-duration:.3s;
- transition:.3s;
- }
- .playercontainer:hover{
- opacity:.8;
- -moz-transition-duration:.3s;
- -webkit-transition-duration:.3s;
- -o-transition-duration:.3s;
- transition:.3s;
- }
- .audioinfo {
- margin: 0 0 10px 0;
- line-height:110%;
- }
- /* CHAT */
- ul.chat, .chat ol, .chat li {
- list-style:none;
- margin:0px;
- padding:2px;
- }
- .label {
- margin-right:5px;
- padding:0 0 1px 0;
- border-bottom:1px solid {color:color 1};
- }
- /* PHOTO */
- .photo, .photoset{
- {block:Ifgrayscaleposts}
- -webkit-filter: grayscale(100%);
- -webkit-transition: all 0.3s ease-in-out;
- -moz-transition: all 0.3s ease-in-out;
- -o-transition: all 0.3s ease-in-out;
- -ms-transition: all 0.3s ease-in-out;
- transition: all 0.3s ease-in-out;
- {/block:Ifgrayscaleposts}
- {block:Iffadedposts}
- -webkit-filter: grayscale(50%);
- -webkit-transition: all 0.3s ease-in-out;
- -moz-transition: all 0.3s ease-in-out;
- -o-transition: all 0.3s ease-in-out;
- -ms-transition: all 0.3s ease-in-out;
- transition: all 0.3s ease-in-out;
- {/block:Iffadedposts}
- }
- .photo:hover, .photoset:hover{
- {block:Ifgrayscaleposts}
- -webkit-filter: grayscale(0%);
- -webkit-transition: all 0.3s ease-in-out;
- -moz-transition: all 0.3s ease-in-out;
- -o-transition: all 0.3s ease-in-out;
- -ms-transition: all 0.3s ease-in-out;
- transition: all 0.3s ease-in-out;
- {/block:Ifgrayscaleposts}
- {block:Iffadedposts}
- -webkit-filter: grayscale(0%);
- -webkit-transition: all 0.3s ease-in-out;
- -moz-transition: all 0.3s ease-in-out;
- -o-transition: all 0.3s ease-in-out;
- -ms-transition: all 0.3s ease-in-out;
- transition: all 0.3s ease-in-out;
- {/block:Iffadedposts}
- }
- .photo img{
- margin-bottom:-6px;
- max-width:100%;
- }
- /* VIDEO */
- .video{
- width:{select:post width}px;
- max-width:100%;
- }
- .video-player{
- position: relative;
- padding-bottom: 56.25%; /* 16:9 */
- padding-top: 25px;
- height: 0;
- max-width:{select:post width}px;
- overflow:hidden;
- }
- .video-player iframe{
- position: absolute;
- top: 0;
- left: 0;
- width: 100%;
- height: 100%;
- }
- /* POST INFO */
- .info {
- margin:25px 0 0 0;
- text-align: center;
- text-transform: uppercase;
- color:{color:color 1};
- line-height:100%;
- }
- .info a {
- {block:IndexPage}
- font-size:calc({select:font size} + 2px);
- {/block:IndexPage}
- padding:6px 7px 4px 7px;
- margin:0 1px;
- border-radius:20px;
- color:{color:color 2};
- border:1px solid {color:color 2};
- text-align:center;
- -moz-transition-duration:.3s;
- -webkit-transition-duration:.3s;
- -o-transition-duration:.3s;
- transition:.3s;
- }
- .info a:hover{
- background:{color:color 2};
- color:{color:header text};
- -moz-transition-duration:.3s;
- -webkit-transition-duration:.3s;
- -o-transition-duration:.3s;
- transition:.3s;
- }
- /* TAGS */
- .tags {
- text-transform:uppercase;
- color:{color:text};
- letter-spacing:0px;
- font-size: calc({select:font size} - 2px);
- text-align:center;
- margin:15px 0 0 0px;
- }
- .tags a {
- position:relative;
- display:inline-block;
- color:{color:text};
- letter-spacing:1px;
- border-bottom:1px solid {color:color 1};
- margin:0 3px 4px 3px;
- }
- .tags a:hover {
- color:{color:text};
- border-bottom:1px solid {color:color 2};
- background:transparent;
- }
- /* POST NOTES */
- .postnotes {
- text-transform:lowercase;
- text-align:left;
- border:1px solid {color:border};
- padding:15px;
- margin: 0 30px 30px 30px;
- }
- .postnotes ol{
- list-style-type:none;
- margin-left:-30px;
- }
- .postnotes li {
- text-align:left;
- margin:0 0 8px 0;
- }
- .postnotes img{
- margin: 0 10px -4px 0;
- border-radius:10px;
- }
- /* CREDIT: DO NOT REMOVE */
- .credit{
- position:fixed;
- right:10px;
- bottom:10px;
- padding:2px 4px 2px 4px;
- background:{color:container};
- font-size:calc({select:font-size} - 1px);
- }
- {CustomCSS}</style></head><body>
- <div id="bg"></div>
- <div class="footer">
- {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 class="container">
- <div class="header">
- <div class="tbimage">
- <img src="{image:topbar}"}>
- </div>
- <div class="description">{Description}</div>
- <div class="btitle"><a href="/">{title}</a></div>
- </div>
- {block:Posts}
- <div class="post">
- {block:Text}
- {block:Title}<div class="title">{Title}<br><div class="titlebar"></div></div>{/block:Title}{Body}
- {/block:Text}
- {block:Quote}
- <div class="title">“{Quote}”<br><div class="titlebar"></div></div>
- <br><center>{Source}</center>
- {/block:Quote}
- {block:Link}
- <a href="{URL}"><div class="title">{Name}<br><div class="titlebar"></div></div></a>
- {block:Description}<p>{Description}</p>{/block:Description}
- {/block:Link}
- {block:Photo}
- <div class="photo"><img src="{PhotoURL-400}"/></div>
- {/block:Photo}
- {block:Photoset}
- <div class="photoset">
- <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>
- </div>
- {/block:Photoset}
- {block:Chat}
- <ul class="chat">
- {block:Title}<div class="title">{Title}<br><div class="titlebar"></div></div>{/block:Title}
- {block:Lines}<li>{block:Label}<span class="label">{Label}</span>{/block:Label} {Line}</li>{/block:Lines}</ul>
- {/block:Chat}
- {block:Video}
- <div class="video-player">{Video-500}</div>
- {/block:Video}
- {block:Answer}
- <div class="ask">
- <div class="title">{Asker}</div>
- {Question}
- <br><div class="titlebar"></div>
- </div>
- <div class="ans">{Answer}</div>
- {/block:answer}
- {block:Audio}
- <div class="audio">
- {block:AlbumArt}<div class="albumart">
- <div class="playercontainer">{AudioPlayerWhite}</div>
- <img src="{AlbumArtURL}"/>
- </div>{/block:AlbumArt}
- <div class="audioinfo">
- {block:TrackName}<h1>{TrackName}</h1>{/block:TrackName}
- {block:Artist}{Artist}{/block:Artist}
- </div>
- </div>
- {/block:Audio}
- {block:IndexPage}
- {block:IfnotHideCaptions}
- {block:Caption}<div class="caption">{Caption}</div>{/block:Caption}
- {/block:IfnotHideCaptions}
- {/block:IndexPage}
- {block:PermalinkPage}
- {block:Caption}<div class="caption">{Caption}</div>{/block:Caption}
- {/block:PermalinkPage}
- {block:Date}
- <div class="info">
- <a href="{Permalink}" title="{Month} {DayOfMonth}"><span class="lnr lnr-star"></span></a>
- <a href="{ReblogURL}" title="reblog"><span class="lnr lnr-sync"></span></a>
- <a href="{Permalink}" title="{NoteCount} Notes"><span class="lnr lnr-eye"></span></a>
- {block:PermalinkPage}
- {block:RebloggedFrom}
- <a href="{ReblogParentURL}">via</a>
- {/block:RebloggedFrom}
- {block:ContentSource}
- <a href="{SourceURL}">source</a>
- {/block:ContentSource}
- {/block:PermalinkPage}
- </div>
- {block:HasTags}
- <div class="tags">{block:Tags}
- <a href="{TagURL}"><div class="tag">#{Tag}</div></a>
- {/block:Tags}</div>
- {/block:HasTags}
- {/block:Date}
- </div>
- {/block:Posts}
- {block:PostNotes}<div class="postnotes">{PostNotes}</div>{/block:PostNotes}
- <div class="pagination">
- {block:Pagination}
- <div style="float:left">{block:PreviousPage}<a href="{PreviousPage}"><span class="lnr lnr-chevron-left"></span></a> {/block:PreviousPage}</div>
- <div class="centernav">{CurrentPage} / {TotalPages}</div>
- <div style="float:right">{block:NextPage}<a href="{NextPage}"><span class="lnr lnr-chevron-right"></span></a>{/block:NextPage}</div>
- {/block:Pagination}
- </div>
- </div><!-- end post container -->
- <a href="http://neonbikethemes.tumblr.com/" title="theme by Paige"><div class="credit">nb</center></div></a>
- <script src="http://static.tumblr.com/kfhytre/zMuol8wco/unnest.min.js"></script>
- <script>
- $('.post').unnest({
- yourCaption: '.caption',
- newCaptionUsername: true,
- originalPostCaptionUsername: true,
- tumblrAvatars: true,
- usernameColon: false
- });
- $(window).scroll(function() {
- if ($(this).scrollTop() > 100){
- $('.btitle').addClass("sticky");
- }
- else{
- $('.btitle').removeClass("sticky");
- }
- });
- </script>
- </body>
- </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement