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">
- <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
- <head>
- <script src="http://tympanus.net/Blueprints/ElasticContentSlider/js/modernizr.custom.js"></script>
- <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}
- <!---@shayofrp
- i'm watching u :))--->
- <meta name="color:Background" content="#ffffff"/>
- <meta name="color:Text" content="#a8a8a8"/>
- <meta name="color:Hover" content="#f2f2f2"/>
- <meta name="color:Scrollbar" content="#000000"/>
- <meta name="color:ScrollbarBg" content="#ffffff"/>
- <meta name="color:Answer Backg" content="#000000"/>
- <meta name="color:Links" content="#000000"/>
- <meta name="color:Links Background" content="#000000"/>
- <meta name="color:Description Background" content="#000000"/>
- <meta name="color:postbg" content="#ffffff"/>
- <meta name="color:Info Background" content="#ffffff"/>
- <meta name="image:sidebar background" content=""/>
- <meta name="image:background" content=""/>
- <meta name="image:slide1" content=""/>
- <meta name="image:sidebar" content=""/>
- <meta name="text:Tab 2 Title" content="">
- <meta name="text:Tab 3 Title" content="">
- <meta name="text:Tab 4 Title" content="">
- <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="text:Link 6" content="">
- <meta name="text:Link 6 URL" content="/">
- <style type="text/css">
- ::-webkit-scrollbar-thumb {
- height:auto;
- background-color:{color:Scrollbar};
- }
- ::-webkit-scrollbar {
- height:9px;
- width:2px;
- background-color:{color:ScrollbarBg};
- }
- body {
- background:{color:background};
- margin:0px;
- color:{color:text};
- font-family:tahoma, sans-serif;
- font-size:9px;
- line-height:100%;
- letter-spacing:0px;
- text-align:justify;
- background-image:url('{image:background}');
- }
- .container{width:650px;
- height:200px;
- margin-left:300px;
- margin-top:10px;
- }
- a {
- text-decoration:none;
- outline:none;
- -moz-outline-style:none;
- color:{color:links};
- font-weight:bold;
- font-family:tahoma;
- }
- pre{color:{color:background};
- font-family:'arial';
- padding:5px;
- width:95%;
- font-size:150%;
- border-left:2px solid {color:postbg};
- text-transform:lowercase;
- letter-spacing:-1px;
- background-color:{color:text};}
- img {
- border:none;
- }
- h1 {
- font-size:22px;
- color:{color:text};
- text-transform:lowercase;
- font-family:'arial';
- letter-spacing:-1px;
- text-align:left;
- }
- blockquote {border-left: solid 2px {color:links};
- padding-left:5px;
- background-color:{color:background};
- padding:5px;
- }
- a:hover {
- color:{color:postbg};
- -moz-transition-duration:0.3s;
- -webkit-transition-duration:0.3s;
- -o-transition-duration:0.3s;
- }
- /*ENTRIES*/
- #entries {
- padding:10px;
- width:500px;
- margin-left:420px;
- letter-spacing:0px;
- line-height:140%;
- margin-top:300px;
- z-index:2;
- padding-bottom:20px;
- font-size:9px;
- position:absolute;
- }
- #post {
- width:500px;
- padding:10px;
- margin-top:10px;
- background-color:{color:postbg};
- }
- /*SIDEBAR*/
- #description{
- width:293px;
- background-color:{color:Description Background};
- padding:1px;
- margin-left:325px;
- margin-top:0px;
- font-size:7px;
- font-family:tahoma,
- sans-serif;color:{color:Text};
- font-family:'tahoma';
- padding:5px;
- border-left: solid 2px {color:links};
- height:95px;
- overflow:auto;
- text-transform:uppercase;
- letter-spacing:2px;
- }
- #mainimage{margin-left:-9px;
- margin-top:-50px;
- position:fixed;
- }
- /* Needed for a fluid height: */
- .container{ height: 100%;
- }
- /* main wrapper */
- .cbp-contentslider {
- width: 650px;
- height: 300px;
- z-index:9;
- position: fixed;
- box-shadow: 0 0 0 2px {color:text}, 0 0 0 14px {color:background};
- }
- .cbp-contentslider > ul {
- list-style: none;
- height: 100%;
- width: 100%;
- overflow: hidden;
- position: relative;
- padding: 0;
- margin: 0;
- }
- .cbp-contentslider > ul li {
- position: absolute;
- width: 100%;
- height: 100%;
- left: 0;
- top: -10px;
- padding: 5px;
- background-color: {color:background};
- background-image:url('{image:sidebar background}');
- }
- /* Whithout JS, we use :target */
- .cbp-contentslider > ul li:target {
- z-index: 100;
- }
- .cbp-contentslider nav {
- position: absolute;
- bottom: 0;
- left: 0;
- right: 0;
- height:25px;
- z-index: 1000;
- border-top: 2px solid {color:Text};
- overflow: hidden;
- }
- .cbp-contentslider nav a {
- float: left;
- display: block;
- font-weight:normal;
- height: 100%;
- letter-spacing:1px;
- overflow: hidden;
- color: {color:Text};
- background: {color:background};
- outline: none;
- text-align: center;
- line-height: 3;
- position: relative;
- text-transform: uppercase;
- -webkit-transition: color 0.2s ease-in-out, background-color 0.2s ease-in-out;
- -moz-transition: color 0.2s ease-in-out, background-color 0.2s ease-in-out;
- transition: color 0.2s ease-in-out, background-color 0.2s ease-in-out;
- }
- .cbp-contentslider nav a span {
- display: block;
- }
- .cbp-contentslider nav a:last-child {
- border: none;
- box-shadow: 1px 0 {color:Text}; /* fills gap caused by rounding */
- }
- .cbp-contentslider nav a:hover {
- background-color: {color:Text};
- color: {color:background};
- }
- .cbp-contentslider nav a.rc-active {
- background-color: {color:Text};
- color: {color:background};
- }
- .cbp-contentslider h3 {
- font-size: 20px;
- z-index:99999999999;
- margin-bottom:-5px;
- width:95%;
- background-color:{color:text};
- font-weight: lighter;
- position: relative;
- font-family:'arial';
- letter-spacing:-1px;
- color: {color:background};
- text-transform: lowercase;
- text-align: center;
- padding:10px;
- border-left: 2px solid{color:postbg};
- }
- .cbp-contentslider li > div {
- position: absolute;
- top: 60px;
- bottom: 2px;
- width: 100%;
- left: 0;
- padding: 0 10px;
- overflow-x: hidden;
- overflow-y: auto;
- }
- .cbp-contentslider .cbp-content {
- vertical-align: top;
- padding: 2px;
- }
- .cbp-contentslider p {
- color: {color:Text};
- padding:5px;
- margin: 0;
- font-size: 9px;
- font-weight: 300;
- text-align: justify;
- line-height: 1.6;
- }
- /* Media queries */
- @media screen and (max-width: 70em) {
- .cbp-contentslider p {
- font-size: 100%;
- }
- }
- @media screen and (max-width: 670px) {
- .cbp-contentslider { font-size: 85%; }
- .cbp-contentslider nav a span {
- display: none;
- }
- }
- @media screen and (max-width: 430px) {
- .cbp-contentslider h3 {
- font-size:25px;
- }
- .cbp-contentslider .cbp-content {
- -webkit-column-count: 1;
- -moz-column-count: 1;
- -o-column-count: 1;
- column-count: 1;
- }
- .cbp-contentslider li > div {
- 50px
- }
- }
- @media screen and (max-width: 250px) {
- .cbp-contentslider nav a { padding: 0;}
- .cbp-contentslider h3[class^="icon-"]:before,
- .cbp-contentslider h3[class*=" icon-"]:before { display: none;}
- }
- /*POST INFO*/
- #info {
- width:500px;
- text-align:center;
- font-family:'tahoma';
- text-transform:lowercase;
- margin-top:1px;
- margin-left:-2px;
- font-size:9px;
- font-style:none;
- padding:2px;
- line-height:10px;
- background-color:{color:Info Background};
- color:{color:Postbg};
- }
- #info a {
- text-align:center;
- color:{color:Text};
- }
- .tags {text-transform:none;
- color:{color:postbg};
- width:492px;
- margin-left:-2px;
- background-color:{color:background};
- font-size:10px;
- padding:6px;-moz-transition-duration:0.5s;-webkit-transition-duration:0.5s;-o-transition-duration:0.5s;}
- .tags a {
- letter-spacing:0px;
- font-size:8px;
- text-align:center;
- font-family:'arial';
- text-decoration:none;
- display:inline-block;
- color:{color:postbg};
- }
- .tags a:hover{background-color:{color:Links};}
- /*SIDELINKS*/
- .links {
- padding:5px;
- padding-bottom:6px;
- line-height:150%;
- z-index:10000000000000000;
- text-align:center;
- font-size:8px;
- letter-spacing:2px;
- opacity:1;
- position:fixed;
- font-family:'tahoma';
- position:absolute;
- text-transform:uppercase;
- text-align:center;}
- .links a{
- z-index:10000000000000000;
- margin-left:10px;
- padding:5px;
- display:inline-block;
- }
- .links a:hover{
- color:{color:postbg};
- -moz-transition-duration:.2s;
- -webkit-transition-duration:.2s;
- -o-transition-duration:.2s;
- background-color:{color:Links Background};
- }
- #navi{
- text-align:center;
- font-weight:normal;
- width:360px;
- margin-left:299px;
- margin-top:-198px;
- font-family:tahoma;
- z-index:9999999999999;
- }
- #navi a{
- width:130px;
- font-weight:normal;
- color:{color:Links};
- border-left:solid 2px{color:Info Background};
- display:inline-block;
- z-index:9999999999999;
- font-style:none;
- margin-top:-1px;
- text-transform:uppercase;
- font-size:7px;
- letter-spacing:2px;
- margin-bottom:3px;
- padding:10px;
- background-color:{color:Links Background};
- }
- #navi a:hover{background-color:{color:postbg};}
- /*QUESTION*/
- #asker {
- color:{color:text};
- border-left:solid 2px{color:links};
- padding:12px;
- font-family:'tahoma';
- font-size:9px;
- letter-spacing:0px;
- text-align:left;
- margin-top:0px;
- text-transform:lowercase;
- line-height:100%;
- background-color:{color:Answer backg};
- }
- #asker a{color:{color:postbg};}
- #url{color:{color:Text};
- padding:2px;
- border-left:solid 2px{color:links};
- font-family:'tahoma';
- font-size:9px;
- letter-spacing:0px;
- text-align:center;
- margin-top:0px;
- text-transform:uppercase;
- line-height:100%;
- background-color:{color:Info Background};
- }
- #url a{color:{color:postbg}}
- #pagination {
- font-size:9px;
- width:96px;
- margin-left:298px;
- letter-spacing:-1px;
- line-height:12px;
- padding:10px;
- text-transform:lowercase;
- margin-top:320px;
- text-align:center;
- font-family:arial;
- z-index:9999;
- position:fixed;
- color:{color:background};
- background-color:{color:Description Background};
- border-top:solid 2px{color:links};
- }
- #pagination a{background-color:{color:background};
- padding:2px}
- /*CREDIT*/
- #cred {
- position:fixed;
- font-family:'arial';
- text-transform:uppercase;
- font-size:8px;
- right:9px;
- z-index:9999;
- bottom:9px;
- padding:5px;
- background-color:{color:postbg};
- letter-spacing:1px;
- }
- {CustomCSS}</style></head><body>
- <div class="container">
- <div class="main">
- <div id="cbp-contentslider" class="cbp-contentslider">
- <ul>
- <li id="slide1">
- <div>
- <div id="mainimage"><img src="{image:slide1}"></div>
- </div>
- </li>
- <li id="slide2">
- <h3>{text:tab 2 title}</h3>
- <div>
- <div class="cbp-content">
- <img src="{image:sidebar}"><div id="navi">
- <a href="{text:link 1 url}">{text:link 1}</a>
- <a href="{text:link 2 url}">{text:link 2}</a>
- <a href="{text:link 3 url}">{text:link 3}</a>
- <a href="{text:link 4 url}">{text:link 4}</a>
- <a href="{text:link 5 url}">{text:link 5}</a>
- <a href="{text:link 6 url}">{text:link 6}</a>
- <br>
- </div>
- <div id="description">{description}</div>
- </div>
- </div>
- </li>
- <li id="slide3">
- <h3>{text:tab 3 title}</h3>
- <div>
- <div class="cbp-content">
- <blockquote><p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce a justo et nulla aliquam placerat quis sed mi. Curabitur feugiat consequat dignissim. Fusce aliquet, mauris a ullamcorper imperdiet, nulla nunc pretium magna, semper commodo diam felis imperdiet ante. Vestibulum eget convallis purus. Quisque mauris turpis, sollicitudin at augue eget, venenatis porttitor sem. </blockquote><br>
- <blockquote><p>Cras rhoncus nisi ac magna luctus, vitae hendrerit sem rutrum. In a felis sagittis, rhoncus magna eget, sodales lacus. Phasellus scelerisque mauris nunc, in facilisis ligula sollicitudin a. Aliquam lectus leo, iaculis non dapibus non, consequat in nunc. Quisque vehicula quam sit amet neque hendrerit ultricies. Donec a volutpat tortor, ac faucibus enim. Donec auctor orci eu odio dignissim iaculis. Curabitur aliquet non nisl eu interdum. Aliquam non felis interdum, varius lacus ut, tincidunt purus. Phasellus tortor ligula, euismod in ligula in, placerat sodales mi. Donec posuere sem in bibendum imperdiet. Morbi ut suscipit enim. Donec at tortor est. Donec semper sed dui id scelerisque. Vivamus vel ipsum vitae quam tempus dignissim eget et tellus.</p></blockquote>
- </div>
- </div>
- </li>
- <li id="slide4">
- <h3>{text:tab 4 title}</h3>
- <div>
- <div class="cbp-content">
- <p><pre>RULE RULE RULE</pre></p>
- <blockquote><p>Cras rhoncus nisi ac magna luctus, vitae hendrerit sem rutrum. In a felis sagittis, rhoncus magna eget, sodales lacus. Phasellus scelerisque mauris nunc, in facilisis ligula sollicitudin a. Aliquam lectus leo, iaculis non dapibus non, consequat in nunc. Quisque vehicula quam sit amet neque hendrerit ultricies. Donec a volutpat tortor, ac faucibus enim. </p></blockquote>
- <p><pre>RULE RULE RULE</pre></p>
- <blockquote><p>Cras rhoncus nisi ac magna luctus, vitae hendrerit sem rutrum. In a felis sagittis, rhoncus magna eget, sodales lacus. Phasellus scelerisque mauris nunc, in facilisis ligula sollicitudin a. Aliquam lectus leo, iaculis non dapibus non, consequat in nunc. Quisque vehicula quam sit amet neque hendrerit ultricies. Donec a volutpat tortor, ac faucibus enim. </p></blockquote>
- <p><pre>RULE RULE RULE</pre></p>
- <blockquote><p>Cras rhoncus nisi ac magna luctus, vitae hendrerit sem rutrum. In a felis sagittis, rhoncus magna eget, sodales lacus. Phasellus scelerisque mauris nunc, in facilisis ligula sollicitudin a. Aliquam lectus leo, iaculis non dapibus non, consequat in nunc. Quisque vehicula quam sit amet neque hendrerit ultricies. Donec a volutpat tortor, ac faucibus enim. </p></blockquote>
- <p><pre>RULE RULE RULE</pre></p>
- <blockquote><p>Cras rhoncus nisi ac magna luctus, vitae hendrerit sem rutrum. In a felis sagittis, rhoncus magna eget, sodales lacus. Phasellus scelerisque mauris nunc, in facilisis ligula sollicitudin a. Aliquam lectus leo, iaculis non dapibus non, consequat in nunc. Quisque vehicula quam sit amet neque hendrerit ultricies. Donec a volutpat tortor, ac faucibus enim. </p></blockquote>
- <p><pre>RULE RULE RULE</pre></p>
- <blockquote><p>Cras rhoncus nisi ac magna luctus, vitae hendrerit sem rutrum. In a felis sagittis, rhoncus magna eget, sodales lacus. Phasellus scelerisque mauris nunc, in facilisis ligula sollicitudin a. Aliquam lectus leo, iaculis non dapibus non, consequat in nunc. Quisque vehicula quam sit amet neque hendrerit ultricies. Donec a volutpat tortor, ac faucibus enim. </p></blockquote>
- <p><pre>RULE RULE RULE</pre></p>
- <blockquote><p>Cras rhoncus nisi ac magna luctus, vitae hendrerit sem rutrum. In a felis sagittis, rhoncus magna eget, sodales lacus. Phasellus scelerisque mauris nunc, in facilisis ligula sollicitudin a. Aliquam lectus leo, iaculis non dapibus non, consequat in nunc. Quisque vehicula quam sit amet neque hendrerit ultricies. Donec a volutpat tortor, ac faucibus enim. </p><br></blockquote>
- </div>
- </div>
- </li>
- <nav>
- <a href="#slide1">HOME</a>
- <a href="#slide2">{text:tab 2 title}</a>
- <a href="#slide3">{text:tab 3 title}</a>
- <a href="#slide4">{text:tab 4 title}</a>
- </nav>
- </div>
- </div>
- </div>
- <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
- <script src="http://tympanus.net/Blueprints/ElasticContentSlider/js/jquery.cbpContentSlider.min.js"></script>
- <script>
- $(function() {
- /*
- - how to call the plugin:
- $( selector ).cbpContentSlider( [options] );
- - options:
- {
- // default transition speed (ms)
- speed : 500,
- // default transition easing
- easing : 'ease-in-out',
- // current item's index
- current : 0
- }
- - destroy:
- $( selector ).cbpContentSlider( 'destroy' );
- */
- $( '#cbp-contentslider' ).cbpContentSlider();
- });
- </script>
- </div></div></div></div></div></div></div></div>
- <div id="entries">
- {block:Posts}
- <div id="post">
- {block:Text}
- <h1>{block:Title}{Title}{/block:Title}</h1>
- {Body}{/block:Text}
- {block:Photo}{LinkOpenTag}<img src="{PhotoURL-500}">{LinkCloseTag}
- {block:Caption}{Caption}{/block:Caption}{/block:Photo}
- {block:Photoset}{Photoset-500}{block:Caption}{Caption}
- {/block:Caption}{/block:Photoset}
- {block:Quote}<h2>"{Quote}"</h2>
- {block:Source}<div class="qsource"> —{Source}</div>
- {/block:Source}{/block:Quote}
- {block:Link}<h1><a href="{URL}" {Target}>{Name}</a></h1>{block:Description}{Description}{/block:Description}{/block:Link}
- {block:Chat}{block:Title}{Title}{/block:Title}{block:Lines}{block:Label}<b><u>{Label}</u></b>{/block:Label} {Line}<br>{/block:Lines}{/block:Chat}
- {block:Audio}<left>{block:AlbumArt}<img src="{AlbumArtURL}" width="60px" height="60px" align="left" style="margin-right:10px" />{/block:AlbumArt}<span class="audio">{AudioPlayerBlack}</left></span>
- {block:TrackName}<b>Title:</b> {TrackName}<br />{/block:TrackName}
- {block:Artist}<b>Artist:</b> {Artist}<br />{/block:Artist}
- {/block:ExternalAudio}<b>Played:</b> {PlayCount} tahoma <br>
- {/block:Audio}<br>
- {block:Video}{Video-500}{block:Caption}{Caption}{/block:Caption}{/block:Video}
- {block:Answer}<div id="asker">{Question}</div> <div id="url">{Asker}</div>{Answer}{/block:Answer}
- <div id="info">
- <div id="permalink">
- <a href="{Permalink}">{Month} {DayOfMonth}{DayOfMonthSuffix}</a> —
- {block:RebloggedFrom} <a href="{ReblogParentURL}">via</a>{/block:RebloggedFrom}
- and {block:ContentSource} <a href="{SourceURL}"><a href="{SourceURL}">source</a>{/block:ContentSource}
- {block:RebloggedFrom} <a href="{ReblogParentURL}" target="_blank"></a>{/block:RebloggedFrom}
- with {NoteCountWithLabel}</a></div>
- {block:PostNotes}<div id="notes"><left>{PostNotes}</div>{/block:PostNotes}</div>
- {block:HasTags}<div class="tags">{block:Tags}#<a href="{TagURL}">{Tag}</a> {/block:Tags}</div>{/block:HasTags}
- </div>{/block:Posts}{/block:Posts}</div></div>
- <div id="pagination"> <img src="{PortraitURL-96}"><br><br>{title}<br><br>{block:Pagination}
- {block:PreviousPage}
- <a href="{PreviousPage}">back</a>
- {/block:PreviousPage}
- {block:NextPage}
- <a href="{NextPage}">forward</a>
- {/block:NextPage}
- </div>
- {/block:Pagination}
- </div>
- <div id="cred">
- <a href="http://shayofrp.tumblr.com/">SHAYOFRP</a>
- </div>
- </html>
Advertisement
Add Comment
Please, Sign In to add comment