Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- <!--- Theme 2 'Rain' by Brianna @ farflunghopes.tumblr.com
- Rules:
- 1. Do not remove the credit from the code or the theme. You may MOVE it, but leave it on the FIRST page of your blog, ie: it must be visible on the main page.
- 2. Do not redistribute this theme.
- 3. Do not steal this theme. Taking a portion of the code and adding it to your own theme/others' counts as stealing. If you want to learn how to do something, ask, and I will do my best to help you.
- 4. Do not use this theme as a base code.
- 5. If you have any problems, find glitches, or just need help, please ask me! That's not really a rule, but I'd love to help.
- Help:
- - Theme looks best in Google Chrome.
- - SAVE and REFRESH the page before changing appearance options.
- - The background image REPEAT and POSITION can be changed under the appearance options. Select or deslect 'BackgroundImageRepeat' and enter the position in 'bgimgposition'.
- - The sidebar image is automatically altered to fit the length of your screen. A small image will be stretched.
- - There are SIX extra links available. Add them under the appearance options. Keep the link names SHORT or the link will not be centered.
- - The BODY font SIZE can be changed under the appearance options. DO NOT add 'px' after the number.
- - The posts can either be 400px wide or 500px wide. The default is 500px. For 400px posts select '400pxPosts' under the appearance options.
- - Hovering over the sidebar reveals the description. To have the description always visible, DESELECT 'DiscriptionHidden' under the appearance options.
- - Hovering over the posts reveals the post info (time stamp, note count, and reblog button). To have the info visible at all times, DESELECT 'HoverForInfo' under the appearance options.
- - Select/deselect 'ShowPageCount' to reveal/hide the Current Page of Total Pages.
- - The 'highlight' and 'highlighttext' color options refer to the background and text color that appears when you click and drag the cursor.
- Enjoy!
- --->
- <!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><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}
- <link href='http://fonts.googleapis.com/css?family=Allura' rel='stylesheet' type='text/css'>
- <link href='http://fonts.googleapis.com/css?family=Arapey:400italic,400' rel='stylesheet' type='text/css'>
- <link href='http://fonts.googleapis.com/css?family=Love+Ya+Like+A+Sister' rel='stylesheet' type='text/css'>
- <meta name="color:background" content="#FFFFFF" />
- <meta name="color:entry" content="#CCCCCC" />
- <meta name="color:text" content="#555555" />
- <meta name="color:sidetext" content="#555555" />
- <meta name="color:description" content="#EEEEEE" />
- <meta name="color:infolink" content="#111111">
- <meta name="color:infolinkhover" content="#999999">
- <meta name="color:link" content="#333333" />
- <meta name="color:linkhover" content="#777777" />
- <meta name="color:sidelink" content="#333333" />
- <meta name="color:sidelinkhover" content="#999999" />
- <meta name="color:sidelinktext" content="#555555">
- <meta name="color:sidebar" content="#888888" />
- <meta name="color:sidebarborder" content="#555555">
- <meta name="color:pagination" content="#555555" />
- <meta name="color:paginationhover" content="#999999" />
- <meta name="color:scrollbar" content="#000000" />
- <meta name="color:scrollbarbg" content="#999999" />
- <meta name="color:highlight" content="#000000" />
- <meta name="color:hightlightext" content="#555555" />
- <meta name="font:body" content="" />
- <meta name="font:sidebar" content="" />
- <meta name="text:title2" content="Secondary Title">
- <meta name="text:bodyfontsize" content="11" />
- <meta name="text:bgimgposition" content="bottom right" />
- <meta name="text:link1" content="/" />
- <meta name="text:link1name" content="link 1" />
- <meta name="text:link2" content="/" />
- <meta name="text:link2name" content="link 2" />
- <meta name="text:link3" content="/" />
- <meta name="text:link3name" content="link 3" />
- <meta name="text:link4" content="/" />
- <meta name="text:link4name" content="link 4" />
- <meta name="text:link5" content="/" />
- <meta name="text:link5name" content="link 5" />
- <meta name="text:link6" content="/" />
- <meta name="text:link6name" content="link 6" />
- <meta name="image:background" content="" />
- <meta name="image:sidebar" content="" />
- <meta name="if:BackgroundImageRepeat" content="" />
- <meta name="if:400pxPosts" content="" />
- <meta name="if:HoverforInfo" content="1">
- <meta name="if:DescriptionHidden" content="1">
- <meta name="if:ShowPageCount" content="">
- <style type="text/css">
- iframe#tumblr_controls {right:3px !important; position: fixed !important;-webkit-transition: opacity 0.7s linear;opacity: 0.2;-webkit-transition: all 0.8s ease-out;-moz-transition: all 0.8s ease-out;transition: all 0.8s ease-out;}
- iframe#tumblr_controls:hover{-webkit-transition: opacity 0.7s linear;opacity: 1;-webkit-transition: all 0.4s ease-out;-moz-transition: all 0.4s ease-out;transition: all 0.4s ease-out;}
- ::-webkit-scrollbar {
- width: 7px;
- background-color:{color:scrollbarbg};
- }
- ::-webkit-scrollbar-thumb {
- width:7px;
- background-color:{color:scrollbar};
- }
- ::selection {
- background: {color:highlight};
- color: {color:highlighttext};
- }
- body {
- background:{color:background};
- font-family:{font:body};
- font-size:{text:bodyfontsize}px;
- line-height:95%;
- margin:0px;
- background-image:url('{image:background}');
- background-attachment:fixed;
- background-position:{text:bgimgposition};
- {block:IfBackgroundImageRepeat}
- background-repeat:repeat;
- {/block:IfBackgroundImageRepeat}
- {block:IfNotBackgroundImageRepeat}
- background-repeat:no-repeat;
- {/block:IfNotBackgroundImageRepeat}
- }
- a {
- color:{color:link};
- text-decoration:none;
- outline:none;
- -webkit-transition: all 0.6s ease-out;
- -o-transition: all 0.6s ease-out;
- -webkit-transition: all 0.6s ease-out;
- -moz-transition: all 0.6s ease-out;
- }
- a:hover {
- color:{color:linkhover};
- -webkit-transition: all 0.6s ease-out;
- -o-transition: all 0.6s ease-out;
- -webkit-transition: all 0.6s ease-out;
- -moz-transition: all 0.6s ease-out;
- }
- img {
- border:none;
- }
- blockquote {
- padding-left:5px;
- border-left:1px solid {color:text};
- }
- blockquote blockquote {
- padding-left:5px;
- border-left:1px solid {color:text};
- }
- h1 {
- font-family: 'Arapey', serif;
- font-size:15px;
- font-style:italic;
- }
- #entries {
- {block:If400pxPosts}
- width:400px;
- margin-left:36%;
- {/block:If400pxPosts}
- {block:IfNot400pxPosts}
- width:500px;
- margin-left:34%;
- {/block:IfNot400pxPosts}
- margin-top:20px;
- }
- #post {
- background-color:{color:entry};
- color:{color:entry};
- {block:If400pxPosts}
- width:400px;
- {/block:If400pxPosts}
- {block:IfNot400pxPosts}
- width:500px;
- {/block:IfNot400pxPosts}
- padding:10px;
- overflow:hidden;
- color:{color:text};
- }
- #post:hover #info {
- opacity:1;
- -webkit-transition: all 0.6s ease-out;
- -o-transition: all 0.6s ease-out;
- -webkit-transition: all 0.6s ease-out;
- -moz-transition: all 0.6s ease-out;
- }
- #sidebar {
- position:fixed;
- width:300px;
- background-color:{color:sidebar};
- border-right: 10px solid {color:sidebarborder};
- height:100%;
- left:0px;
- top:0px
- }
- #sidebar:hover #description{
- opacity:1;
- -webkit-transition: all 0.8s ease-out;
- -o-transition: all 0.8s ease-out;
- -webkit-transition: all 0.8s ease-out;
- -moz-transition: all 0.8s ease-out;
- }
- #sidebar:hover #title {
- top:71%;
- -webkit-transition: all 0.8s ease-out;
- -o-transition: all 0.8s ease-out;
- -webkit-transition: all 0.8s ease-out;
- -moz-transition: all 0.8s ease-out;
- }
- #sidebar:hover #title2 {
- margin-top:-10px;
- -webkit-transition: all 0.8s ease-out;
- -o-transition: all 0.8s ease-out;
- -webkit-transition: all 0.8s ease-out;
- -moz-transition: all 0.8s ease-out;
- padding-bottom:10px;
- }
- #linksbar {
- position:fixed;
- width:150px;
- height:100%;
- {block:IfNot400pxPosts}
- right:0%;
- {/block:IfNot400pxPosts}
- {block:If400pxPosts}
- right:5%;
- {/block:If400pxPosts}
- top:0px;
- border-left:1px solid {color:sidebarborder};
- }
- #links {
- left:0px;
- width:50px;
- {block:IfShowPageCount}
- margin-top:-370px;
- {/block:IfShowPageCount}
- {block:IfNotShowPageCount}
- margin-top:100px;
- {/block:IfNotShowPageCount};
- }
- #links a{
- text-align:center;
- width:1px;
- height:44px;
- display:block;
- margin-bottom:2px;
- color:transparent;
- background-color:{color:sidelink};
- line-height:10px;
- font-size:10px;
- border:3px double {color:sidelink};
- }
- #links a:hover{
- width:45px;
- height:27px;
- padding-top:17px;
- background-color:{color:sidelinkhover};
- color:{color:sidelinktext};
- border:3px double {color:sidelinktext};
- }
- #sidebarimage {
- height:100%;
- }
- #sidebarimage img {
- width:300px;
- height:100%;
- }
- #title {
- position:absolute;
- width:220px;
- padding:10px 5px 10px 5px;
- background-color:{color:description};
- font-family: 'Arapey', serif;
- font-size:20px;
- left:35px;
- font-style:italic;
- text-align:center;
- border: 3px solid {color:sidebarborder};
- -webkit-transition: all 0.8s ease-out;
- -o-transition: all 0.8s ease-out;
- -webkit-transition: all 0.8s ease-out;
- -moz-transition: all 0.8s ease-out;
- {block:IfNotDescriptionHidden}
- top:71%;
- {/block:IfNotDescriptionHidden}
- {block:IfDescriptionHidden}
- top:85%;
- {/block:IfDescriptionHidden}
- }
- #title2 {
- font-family:georgia;
- text-transform:uppercase;
- letter-spacing:3px;
- word-spacing:3px;
- font-size:7px;
- text-align:center;
- {block:IfDescriptionHidden}
- margin-top:0px;
- -webkit-transition: all 0.8s ease-out;
- -o-transition: all 0.8s ease-out;
- -webkit-transition: all 0.8s ease-out;
- -moz-transition: all 0.8s ease-out;
- {/block:IfDescriptionHidden}
- {block:IfNotDescriptionHidden}
- margin-top:-10px;
- padding-bottom:10px;
- {/block:IfNotDescriptionHidden}
- }
- #description {
- position:absolute;
- padding:7px;
- padding-bottom:1px;
- margin-left:35px;
- top:75%;
- text-align:left;
- font-size:10px;
- z-index:9999;
- width:216px;
- height:auto;
- font-family:{font:sidebar};
- line-height:95%;
- color:{color:sidetext};
- border-left:3px solid {color:sidebarborder};
- border-right:3px solid {color:sidebarborder};
- border-bottom:3px solid {color:sidebarborder};
- background-color:{color:description};
- {block:IfDescriptionHidden}
- opacity:0;
- -webkit-transition: all 0.8s ease-out;
- -o-transition: all 0.8s ease-out;
- -webkit-transition: all 0.8s ease-out;
- -moz-transition: all 0.8s ease-out;
- {/block:IfDescriptionHidden}
- }
- #pagination1 {
- position:absolute;
- font-size:11px;
- font-family:{font:sidebar}
- color:{color:pagination};
- margin-left:20px;
- top:70px;
- }
- #pagination1 a{
- color:{color:pagination};
- font-size:25px;
- }
- #pagination1 a:hover{
- color:{color:paginationhover};
- }
- #pagination2 {
- position:absolute;
- font-size:11px;
- font-family:{font:sidebar}
- color:{color:pagination};
- margin-left:20px;
- top:580px;
- }
- #pagination2 a{
- color:{color:pagination};
- font-size:25px;
- }
- #pagination2 a:hover{
- color:{color:paginationhover};
- }
- #number {
- font-size:50px;
- line-height:100px;
- font-family: 'Arapey', serif;
- margin-top:170px;
- margin-left:65px;
- color:{color:pagination};
- }
- #info {
- position:absolute;
- margin-top:15px;
- border-left:1px solid {color:sidebarborder};
- width:80px;
- font-size:8px;
- padding-top:3px;
- padding-bottom:3px;
- font-family:georgia;
- text-transform:lowercase;
- padding-left:4px;
- {block:IfNot400pxPosts}
- margin-left:515px;
- {/block:IfNot400pxPosts}
- {block:If400pxPosts}
- margin-left:415px;
- {/block:If400pxPosts}
- {block:IfHoverforInfo}
- opacity:0;
- -webkit-transition: all 0.6s ease-out;
- -o-transition: all 0.6s ease-out;
- -webkit-transition: all 0.6s ease-out;
- -moz-transition: all 0.6s ease-out;
- {/block:IfHoverforInfo}
- {block:IfNotHoverforInfo}
- opacity:1;
- {/block:IfNotHoverforInfo}
- }
- #info a {
- color:{color:infolink};
- }
- #info a:hover {
- color:{color:infolinkhover};
- }
- #source {
- text-align:center;
- margin-top:5px;
- padding-top:5px;
- margin-left:15px;
- font-style:italic;
- text-transform:uppercase;
- font-family:georgia;
- font-size:8px;
- {block:IfNot400pxPosts}
- width:470px;
- {/block:IfNot400pxPosts}
- {block:If400pxPosts}
- width:370px;
- {/block:If400pxPosts}
- border-top:1px solid {color:sidebar2};
- font-family:{font:body};
- }
- #tags{
- text-align:center;
- top:-10px;
- font-family:{font:body};
- font-size:8px;
- font-family:georgia;
- }
- #tags a{
- color:{color:link};
- -webkit-transition: all 0.6s ease-out;
- -o-transition: all 0.6s ease-out;
- -webkit-transition: all 0.6s ease-out;
- -moz-transition: all 0.6s ease-out;
- }
- #tags a:hover{
- color:{color:linkhover};
- -webkit-transition: all 0.6s ease-out;
- -o-transition: all 0.6s ease-out;
- -webkit-transition: all 0.6s ease-out;
- -moz-transition: all 0.6s ease-out;
- }
- #asker {
- margin-left:10px;
- margin-top:10px;
- }
- .audio {
- margin-right:5px;
- width:70px;
- float:left;
- }
- .hidden {
- width:70px;
- height:73px;
- }
- .pull {
- margin-left:4px;
- margin-top:-6px;
- }
- .tumblr_audio_player {
- margin:0px;
- padding:0px;
- width:500px;
- height:50px;
- }
- .player {
- width:35px;
- height:37px;
- margin-left:10px;
- margin-top:10px;
- background-color:#999;
- overflow:hidden;
- position:absolute;
- opacity:0.7;
- background-color:#fff;
- border:7px solid #ECECEC;
- -webkit-transition: all 0.3s ease-out;
- -o-transition: all 0.3s ease-out;
- -webkit-transition: all 0.3s ease-out;
- -moz-transition: all 0.3s ease-out;
- }
- .player:hover {
- opacity:1;
- -webkit-transition: all 0.3s ease-out;
- -o-transition: all 0.3s ease-out;
- -webkit-transition: all 0.3s ease-out;
- -moz-transition: all 0.3s ease-out;
- }
- .caption {
- margin-top:20px;
- }
- .audio img{
- max-width: 70px;
- height: auto;
- }
- .song {
- margin-left:80px;
- margin-top:-58px;
- font-family:geneva;
- line-height:15px;
- text-transform:uppercase;
- font-size:12px;
- padding-bottom:15px;
- }
- .quotation {
- font-family: 'Love Ya Like A Sister', cursive;
- font-size:38px;
- margin-top:10px;
- }
- .quote {
- margin-top:-15px;
- }
- #credit {
- position:fixed;
- right:-1px;
- bottom:-1px;
- font-family: 'Allura', cursive;
- font-size:15px;
- background-color:#FFFFFF;
- padding:5px;
- border: 1px solid #CCCCCC;
- border-radius:10px 0px 0px 0px;
- }
- {CustomCSS}</style></head>
- <body>
- <div id="sidebar">
- <div id="sidebarimage"><img src="{image:sidebar}"></div>
- <div id="description">
- {block:IfTitle2}<div id="title2">{text:title2}</div>{/block:IfTitle2}
- {Description}<p></div>
- <div id="title">{Title}</div>
- </div>
- <div id="linksbar">
- {block:IfShowPageCount}<div id="number"><em>{CurrentPage} <br>of<br> {TotalPages}</em></div>{/block:IfShowPageCount}
- <div id="links">
- <center>
- <a href="/">home</a>
- <a href="/ask">ask</a>
- <a href="/archive">index</a>
- {block:IfLink1Name}
- <a href="{text:link1}">{text:link1name}</a>
- {/block:IfLink1Name}
- {block:IfLink2Name}
- <a href="{text:link2}">{text:link2name}</a>
- {/block:IfLink2Name}
- {block:IfLink3Name}
- <a href="{text:link3}">{text:link3name}</a>
- {/block:IfLink3Name}
- {block:IfLink4Name}
- <a href="{text:link4}">{text:link4name}</a>
- {/block:IfLink4Name}
- {block:IfLink5Name}
- <a href="{text:link5}">{text:link5name}</a>
- {/block:IfLink5Name}
- {block:IfLink6Name}
- <a href="{text:link6}">{text:link6name}</a>
- {/block:IfLink6Name}
- </center>
- </div>
- {block:Pagination}
- <div id="pagination1">
- {block:NextPage}<a href="{NextPage}">»</a>{/block:NextPage}</div>
- <div id="pagination2">{block:PreviousPage}<a href="{PreviousPage}">«</a>{/block:PreviousPage}</div>
- {/block:Pagination}
- </div>
- <div id="credit"><a href="http://farflunghopes.tumblr.com">theme</a></div>
- <div id="entries">{block:Posts}<div id="post">
- <div id="info">
- {block:Date}<a href="{Permalink}">{TimeAgo}{/block:Date}<br>{NoteCountWithLabel}</a><br>
- <a href="{ReblogURL}">reblog</a></div>
- {block:Text}{block:Title}<h1>{Title}</h1>{/block:Title}{Body}{/block:Text}
- {block:Photo}{LinkOpenTag}{block:IfNot400pxPosts}<img src="{PhotoURL-500}">{block:IfNot400pxPosts}{block:If400pxPosts}<img src="{PhotoURL-500}" width="400">{/block:If400pxPosts}{LinkCloseTag}{block:Caption}{Caption}{/block:Caption}{/block:Photo}
- {block:Photoset}{block:IfNot400pxPosts}{Photoset-500}{block:IfNot400pxPosts}{block:If400pxPosts}{Photoset-400}{/block:If400pxPosts}{block:Caption}{Caption}{/block:Caption}{/block:Photoset}
- {block:Quote}<div class="quotation">"</div><div class="quote">     {Quote}"</div>{block:Source}<br>                 —{Source}{/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}<h1>{Title}</h1>{/block:Title}{block:Lines}{block:Label}<b>{Label}</b>{/block:Label} {Line}<br>{/block:Lines}{/block:Chat}
- {block:Audio}
- {block:AlbumArt}<div class="audio"><img src="{AlbumArtURL}"></div>{/block:AlbumArt}
- <div class="hidden"><div class="player"><div class="pull">{AudioPlayerWhite}</div></div></div>
- <div class="song">{block:TrackName}{TrackName}{/block:TrackName}{block:Artist}<br>{Artist}{/block:Artist}<br>{PlayCountWithLabel}</div>
- {block:Caption}<div class="caption">{Caption}</div>{/block:Caption}
- {/block:Audio}
- {block:Video}{block:IfNot400pxPosts}{Video-500}{/block:IfNot400pxPosts}{block:If400pxPosts}{Video-400}{/block:If400pxPosts}{block:Caption}{Caption}{/block:Caption}{/block:Video}
- {block:Answer}<img src="{AskerPortraitURL-24}"><div id="asker">{Asker}:<br>{Question}</div><br>{Answer}{/block:Answer}
- {block:RebloggedFrom}<div id="source">via <a href="{ReblogParentURL}">{ReblogParentName}</a>, {block:ContentSource}© <a href="{SourceURL}">{SourceLink}</a>{/block:ContentSource}</div>{/block:RebloggedFrom}
- {block:HasTags}<div id="tags">{block:Tags} # <a href="{TagURL}">{Tag}</a> {/block:Tags}</div>{/block:HasTags}
- </div>
- <br><br>
- {block:PostNotes}{PostNotes}{/block:PostNotes}
- {/block:Posts}</div>
- </body></html>
Advertisement
Add Comment
Please, Sign In to add comment