API tools faq
paste
Advertisement
boavistas

Theme IV by sibunas

boavistas
Mar 31st, 2014
1,673
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 5 16.34 KB | None | 0 0
raw download clone embed print report
  1. <!DOCTYPE html>
  2.  
  3.  <html><head>
  4.  
  5.  <!-----------------------------------------------------------------------
  6.  
  7. © sibunas, 2014.
  8. More themes by sibunas @ http://boavistas.tumblr.com
  9.  
  10. Do not redistribute or claim as your own ANY fraction of this coding.
  11.  
  12. ------------------------------------------------------------------------->
  13.  
  14.  
  15.  
  16.     <title>{Title}{block:PostSummary}, {PostSummary}{/block:PostSummary}</title>
  17.     {block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}
  18.     <link rel="shortcut icon" href="{Favicon}" />
  19.     <link rel="alternate" type="application/rss+xml" href="{RSS}" />
  20.    
  21.  
  22. <link href='http://fonts.googleapis.com/css?family=Open+Sans+Condensed:300,700,300italic' rel='stylesheet' type='text/css'>
  23.  
  24.  
  25. <meta name="image:sidebar" content="" />
  26. <meta name="color:highlights" content="#49c0b2" />
  27. <meta name="color:links" content="#57484e" />
  28. <meta name="color:shadow" content="#ffc8c5" />
  29. <meta name="color:text" content="#7e787c" />
  30.  
  31. <meta name="if:Show title" content="yes" />
  32. <meta name="if:Extra links" content="yes" />
  33.  
  34. <meta name="font:body font" content="calibri" />
  35. <meta name="text:font size" content="9.5" />
  36. <meta name="text:title" content="insert title here" />
  37.  
  38. <meta name="text:square 1 link" content="/" />
  39. <meta name="text:square 1 title" content="link" />
  40. <meta name="text:square 2 link" content="/" />
  41. <meta name="text:square 2 title" content="link" />
  42. <meta name="text:square 3 link" content="/" />
  43. <meta name="text:square 3 title" content="title" />
  44.  
  45. <meta name="text:link 1" content="/" />
  46. <meta name="text:link 1 title" content="link" />
  47. <meta name="text:link 2" content="/" />
  48. <meta name="text:link 2 title" content="link" />
  49. <meta name="text:link 3" content="/" />
  50. <meta name="text:link 3 title" content="title" />
  51. <meta name="text:link 4" content="/" />
  52. <meta name="text:link 4 title" content="link" />
  53.  
  54.  
  55. <style type="text/css">
  56.  
  57.  
  58. body {
  59.     color: {color:text};
  60.     background: white;
  61.     font-family: {font:body font};
  62.     font-size: {text:font size}px;
  63.     line-height: 110%;
  64.     text-align:justify;
  65. }
  66.  
  67.  
  68. a {
  69.     color: {color:links};
  70.     text-decoration: underline;
  71.     -webkit-transition: all 0.6s ease-out;
  72.     -moz-transition: all 0.6s ease-out;
  73.     transition: all 0.6s ease-out;
  74. }
  75.  
  76.  
  77. a:hover{
  78.     text-shadow: 1px 1px 1px {color:shadow};
  79.     -webkit-transition: all 0.6s ease-in;
  80.     -moz-transition: all 0.6s ease-in;
  81.     -o-transition: all 0.6s ease-in;
  82.     transition: all 0.6s ease-in;
  83.     cursor:help;
  84.     text-decoration:none;
  85. }
  86.  
  87.  
  88. blockquote {width: 480px; margin-left: 0px; padding-left: 5px; border-left: 1px solid {color:highlights};}
  89.  
  90. small {font-size: 90%;}
  91.  
  92.  
  93. h1{font-size: 14px; letter-spacing:1px; text-transform:uppercase; line-height:16px;}
  94.    
  95. h2{font-size: 18px; line-height: 20px; font-style: italic; font-family: 'Open Sans Condensed', sans-serif; margin-top: -10px;}
  96.  
  97. h3 {font-size: 16px; font-style: bold italic;}
  98.  
  99. h6 {color: {color:links}; text-shadow: 1px 1px 0px {color:highlights}, -1px -1px 0px {color:shadow}; font-size:20px; text-transform:lowercase; line-height:21px; font-family: 'Open Sans Condensed', sans-serif; letter-spacing:1px;}
  100.  
  101. ul {list-style-type: square;}
  102.  
  103.  
  104.  
  105. /* ---------- general html --------- */
  106.  
  107. #content {
  108.  width: 500px;
  109.  margin: 50px 20px 0px 620px;
  110.  }
  111.  
  112. #entries {
  113.  width: 500px;
  114.  background:white;
  115.  margin-bottom: 100px;
  116.   }
  117.  
  118. #sidebar {
  119.     height:110%;
  120.     width: 220px;
  121.     padding: 50px;
  122.     background: {color:highlights};
  123.     position:fixed;
  124.     left: 180px;
  125.     top: 0px;
  126. }
  127.  
  128. #sidebar img{border: 10px solid white; width: 200px;}
  129.  
  130. #linkz {text-align: center; padding-bottom: 10px;}
  131. #linkz a{text-decoration: underline; padding: 4px; text-transform: uppercase; font-size: 8px; font-family: calibri; font-weight: bold; letter-spacing: 2px;}
  132. #linkz a:hover {background: {color:links}; color:white;}
  133.  
  134.  
  135. #description {
  136.     padding:10px;
  137.     text-align:justify;
  138.     font-family:arial;
  139.     color:white;
  140.     font-size:8px;
  141.     letter-spacing:1px;
  142.     line-height: 13px;
  143.     text-transform:lowercase;
  144. }
  145.  
  146. .sdimg a:hover {background:transparent;}
  147.  
  148. #title {top: 100px; position: fixed; padding: 10px; width: 160px; text-align: center; left: -2px;}
  149.  
  150. #squares a{font-family: calibri; color:white; text-transform: uppercase; letter-spacing: 3px; width: 44px;  height: 10px; font-size: 10px; display:block; text-align: center; padding: 27px 10px; line-height: 10px; background-color:{color:highlights};}
  151.  
  152. #squares a:hover {font-style:italic; letter-spacing:3px; font-size:20px; background-color: {color:shadow}; display:block;}
  153.  
  154. #sq {position:fixed; top: 208px; left:20px; z-index:3;}
  155.  
  156. #sq a:hover {width: 114px; -webkit-transform: rotate(-180deg); -moz-transform: rotate(-180deg); -o-transform: rotate(-180deg);}    
  157.  
  158.  
  159. #squ {position: fixed; top: 278px; left: 20px; z-index: 5;}
  160.  
  161.  
  162. #squ a:hover {width: 114px; margin: -35px 0px 0px -35px; -webkit-transform: rotate(90deg); -moz-transform: rotate(90deg); -o-transform: rotate(90deg);}    
  163.  
  164.  
  165. #squa {position:fixed; top:208px; left:90px; z-index:1;}
  166.  
  167. #squa a:hover {margin: 35px 0px 0px -35px; width: 114px; -webkit-transform: rotate(90deg); -moz-transform: rotate(90deg); -o-transform: rotate(90deg);}
  168.  
  169. #portrait {width:44px; height:39px; position: fixed; display:block; left: 90px; top: 278px; z-index: 0;}
  170.  
  171. #aux {top: 350px; position: fixed; left: 20px;}
  172. #aux ul {width: 160px; list-style: none; padding-left: 0px;}
  173.  
  174. #aux li {
  175.     width: 122px;
  176.     padding: 5px;
  177.     margin: 2px;
  178.     background: {color:links};
  179.     text-align: center;
  180.     -webkit-transition: all 0.6s ease-out;
  181.     -moz-transition: all 0.6s ease-out;
  182.     transition: all 0.6s ease-out;
  183. }
  184.  
  185. #aux li:hover {opacity: 0.8; -webkit-transition: opacity 0.8s linear; -webkit-transition: all 0.6s ease-out; -moz-transition: all 0.6s ease-out; transition: all 0.6s ease-out;}
  186.  
  187. #aux a{color: white; text-decoration: none; letter-spacing: 2px; text-transform: uppercase;}
  188. #aux a:hover {text-shadow: 1px 1px 1px {color:highlights};}
  189.  
  190. /* ---------- permalinks on index page --------- */
  191.  
  192.  
  193. #tex {
  194.     height:auto;
  195.     width:500px;
  196.     padding-top: 3px;
  197.     margin-top: 2px;
  198.     text-transform: uppercase;
  199.     letter-spacing:1px;
  200.     font-weight: bold;
  201.     font-size:8px;
  202.     font-family:calibri;
  203.     color: {color:highlights};
  204.     border-top: 1px solid {color:highlights};
  205. }
  206.  
  207.  
  208. #tex a{color:{color:highlights};}
  209. #tex a:hover{text-shadow: 1px 1px 0px {color:shadow};color:{color:links};}
  210.  
  211.  
  212.  
  213. /* ---------- permalinks on permalink page --------- */
  214.  
  215. #permas {
  216.     text-align: center;
  217.     letter-spacing: 2px;
  218.     padding: 10px;
  219.     height: auto;
  220.     width: 480px;
  221.     font-size: 9px;
  222.     text-transform:uppercase;
  223.     color: #fad48c;
  224.     background-color: {color:shadow};
  225. }
  226.  
  227.  
  228. #permas a {color: white; font-family: calibri; text-decoration:none;}
  229. #permas a:hover{text-decoration:none;}
  230. #permas i{text-decoration:underline; font-weight:bold;}
  231.  
  232. /* ---------- pagination --------- */
  233.  
  234. .pagination {
  235.     text-align: center;
  236.     font-family: calibri;
  237.     font-size: 8px;
  238.     letter-spacing: 1px;
  239.     font-weight: bold;
  240.  }
  241.  
  242. .pagination a{text-decoration:none; padding: 0px 10px 0px 10px;}
  243.  
  244. .pagination a:hover{background-color:transparent;}
  245.  
  246. .current_page {text-decoration:underline; padding: 0px 10px 0px 10px; color:white;}
  247.  
  248. .pages {padding-bottom:10px;}
  249.  
  250.  
  251. /* ---------- notes on permalinkpage --------- */
  252.  
  253.  
  254. #notes {font-weight:normal; width: 500px; margin-top: -100px; text-transform:uppercase; letter-spacing: 1px; font-size:8px; text-align:right;}
  255. #notes li {padding-bottom:0.5em}
  256. #notes li img.avatar {vertical-align:-4px; margin-right:5px; width:15px; height:15px;}
  257.  
  258.  
  259.  
  260. /* ---------- quote posts ------- */
  261.  
  262.  
  263. #qsource {font-size: 10px; letter-spacing: 1px; text-align: right; padding-right: 10px; font-style:italic;}
  264.  
  265.  
  266. /* ---------- chat posts --------- */
  267.  
  268.  
  269. .line {background-color: white; color: white; margin-bottom: 1px; padding: 3px 5px;}
  270.                            
  271. .even {background: {color:highlights};}
  272. .odd {background: {color:links};}
  273.  
  274. .lines b {text-transform: uppercase;}
  275.  
  276.  
  277.  
  278. /* ---------- scrollbar and selection --------- */
  279.  
  280.  
  281. ::-webkit-scrollbar-thumb {background-color: {color:highlights};}
  282. ::-webkit-scrollbar {background-color: white; width:10px; height: 10px;}
  283. ::-webkit-selection {background-color: {color:shadow}; color: white;}
  284. ::selection {background-color:{color:shadow}; color: white;}
  285.  
  286.  
  287.  
  288. /* ---------- audio posts --------- */
  289.  
  290.  
  291. .inf {
  292.     margin-left: 150px;
  293.     padding-top: 50px;
  294.     font-family:calibri;
  295.     font-size: 10px;
  296.     line-height: 16px;
  297.     background: {color:links};
  298.     color: white;
  299.     height: 150px;
  300.     text-align: center;
  301. }
  302.  
  303. .box {
  304.     background: white;
  305.     position: absolute;
  306.     z-index: 500;
  307.     margin-top: 80px;
  308.     margin-left: 80px;
  309.     opacity: 0.7;
  310.     -webkit-transition: all 0.6s ease-in-out;
  311.     -moz-transition: all 0.6s ease-in-out;
  312.     -o-transition: all 0.6s ease-in-out;
  313.     -ms-transition: all 0.6s ease-in-out;
  314.         transition: all 0.6s ease-in-out;
  315. }
  316.  
  317. .box:hover {opacity: 0.9;}
  318.    
  319.  
  320.  
  321. .musica {
  322.    position: relative;
  323.    width: 20px;
  324.    height: 30px;
  325.    overflow: hidden;
  326.    z-index: 500;
  327.    margin: 10px 19px 8px 11px;
  328. }
  329.  
  330.  
  331. #tod {height: 150px; width: 500px; position: relative;}
  332.  
  333. #tod b{text-decoration:underline; text-transform: uppercase;}
  334.  
  335.  
  336.  
  337. /* ---------- question posts --------- */
  338.  
  339.  
  340. #pregunta {
  341.     background-color: {color:links};
  342.     width:460px;
  343.     padding: 20px;
  344.     color:white;
  345.     font-style: italic;
  346. }
  347.  
  348. #pregunta a{color:white;}
  349.  
  350. #pregunta img{
  351.     position:relative;
  352.     border:5px solid white;
  353.     left: 5px;
  354.     bottom: 5px;
  355.     z-index: 2;
  356. }
  357.  
  358. .askr {
  359.     text-transform:uppercase;
  360.     font-weight:bold;
  361.     font-style: italic;
  362.     color: {color:posts};
  363.     position:relative;
  364.     padding-bottom: 4px;
  365. }
  366.  
  367. .askr a{text-decoration: underline;}
  368.  
  369.  
  370. .triang {
  371.     position:absolute;
  372.     margin-left: 410px;
  373.     font-size:50px;
  374.     color: white;
  375.     margin-top: 6px;
  376.     z-index:1;
  377.     -webkit-transform: rotate(200deg);
  378.     -moz-transform: rotate(200deg);
  379.     -o-transform: rotate(200deg);
  380. }
  381.  
  382.  
  383. .ans{
  384.     position:relative;
  385.     background: {color:highlights};
  386.     padding: 10px;
  387.     color: white;
  388. }
  389.  
  390. iframe#tumblr_controls {-webkit-filter:invert(100%);}
  391.  
  392.  
  393. {CustomCSS}
  394.  
  395. </style>
  396. </head>
  397.  
  398.  
  399.  
  400. <body>
  401.  
  402.  
  403. <div id="sidebar">
  404.  
  405. <div class="sdimg">
  406. <a href="/"><img src="{image:sidebar}"></a>
  407. </div><!--sdimg-->
  408.  
  409.  
  410. <div id="description">
  411. <div id="linkz">
  412. <a href="/">home</a>
  413. <a href="/ask">message</a>
  414. <a href="archive" target="_blank">archive</a>
  415. <a href="http://boavistas.tumblr.com" target="_blank">theme</a>
  416. </div><!--linkz-->
  417. {Description}
  418.    
  419. </div><!--description-->
  420.  
  421.  
  422. {block:Pagination}<div class="pagination">
  423.             {block:PreviousPage}
  424.                 <a href="{PreviousPage}">«</a>
  425.             {/block:PreviousPage}
  426.  
  427.             {block:JumpPagination length="5"}
  428.                 {block:CurrentPage}
  429.                     <span class="current_page">{PageNumber}</span>
  430.                 {/block:CurrentPage}
  431.  
  432.                 {block:JumpPage}
  433.                     <a class="jump_page" href="{URL}">{PageNumber}</a>
  434.                 {/block:JumpPage}
  435.             {/block:JumpPagination}
  436.  
  437.             {block:NextPage}
  438.                 <a href="{NextPage}">»</a>
  439.             {/block:NextPage}
  440.         </div><!--pagination-->{/block:Pagination}
  441.        
  442.        
  443. </div><!--sidebar-->
  444.  
  445. {block:ifShowTitle}<div id="title"><h6>{text:title}</h6></div><!--title-->{/block:ifShowTitle}
  446.  
  447. <div id="squares">
  448.  
  449. <div id="sq"><a href="{text:square 1 link}">{text:square 1 title}</a></div>
  450. <div id="squ"><a href="{text:square 2 link}">{text:square 2 title}</a></div>
  451. <div id="squa"><a href="{text:square 3 link}">{text:square 3 title}</a></div>
  452.  
  453.  
  454. <div id="portrait"><img src="{PortraitURL-64}"></div><!--portrait-->
  455.  
  456. </div><!--squares-->
  457.  
  458.  
  459. {block:ifExtraLinks}
  460. <div id="aux">
  461.     <ul>
  462.         <li><a href="{text:link 1}">{text:link 1 title}</a></li>
  463.         <li><a href="{text:link 2}">{text:link 2 title}</a></li>
  464.         <li><a href="{text:link 3}">{text:link 3 title}</a></li>
  465.         <li><a href="{text:link 4}">{text:link 4 title}</a></li>
  466.     </ul>
  467. </div><!--aux-->
  468. {/block:ifExtraLinks}
  469.  
  470.  
  471. <div id="content">
  472. {block:Posts}
  473.  
  474. <div id="entries">
  475.  
  476.  
  477. <!------------------------------TEXT------------------------------>
  478.  
  479. {block:Text}{block:Title}<h1>{Title}</h1>{/block:Title}{Body}{/block:Text}
  480.  
  481.  
  482. <!----------------------------QUOTE---------------------------->
  483.  
  484. {block:Quote}<h2><big>❝</big> {Quote}</h2>{block:Source}<div id="qsource">—{Source}</div>{/block:Source}{/block:Quote}
  485.  
  486.  <!-----------------------------LINK----------------------------->
  487.  
  488. {block:Link}<a href="{URL}"><h2>› {Name}</h2></a>
  489. {block:Description}{Description}{/block:Description}{/block:Link}
  490.  
  491. <!------------------------------CHAT------------------------------>
  492.  
  493. {block:Chat}
  494. {block:Title}<h1>{Title}</h1>{/block:Title}
  495. {block:Lines}<div class="line {Alt}">{block:Label}<b>{Label}</b>{/block:Label} {Line}</div>{/block:Lines}<div class="clear"></div>
  496. {/block:Chat}
  497.  
  498.  
  499.  <!------------------------------AUDIO------------------------------>
  500.  
  501. {block:Audio}
  502. <div id="tod">
  503.  
  504. <div class="box">
  505. <div class="musica">
  506. {block:AudioPlayer}
  507. {AudioPlayerWhite}
  508. {/block:AudioPlayer}    
  509. </div></div><!--musica-->
  510.  
  511. {block:AlbumArt}
  512. <img src="{AlbumArtURL}" width="200" style="position: relative" align="left">
  513. {/block:AlbumArt}
  514.  
  515. <div class="inf">
  516. {block:TrackName}<h1>{TrackName}</h1><br>{/block:TrackName}
  517. {block:Artist}<b>Artist</b>: {Artist}<br>{/block:Artist}
  518. {block:Album}<b>Album</b>: {Album}<br>{/block:Album}
  519. <i>played {PlayCount} times</i>
  520. </div><!--inf-->
  521.  
  522. </div><!--tod-->
  523.  
  524. {block:Caption}{Caption}{/block:Caption}
  525.  
  526. {/block:Audio}
  527.  
  528.  
  529. <!---------------------------QUESTIONS--------------------------->
  530.  
  531. {block:Answer}<div id="pregunta"><img src="{AskerPortraitURL-30}" align="right"/><div class="triang">▶</div><div class="askr">{Asker} asked:</div>{Question}</div><div class="ans">{Answer}</div>{/block:Answer}
  532.  
  533.  
  534. <!--------------------------------------------------------------->
  535.  
  536. {block:Photo}<img src="{PhotoURL-500}" alt="{PhotoAlt}"/>
  537. {block:Caption}{Caption}{/block:Caption}{/block:Photo}
  538.  
  539.  
  540. {block:Photoset}{Photoset-500}{block:Caption}{Caption}{/block:Caption}
  541. {/block:Photoset}
  542.  
  543.  
  544.  
  545. {block:Video}{Video-500}{block:Caption}{Caption}{/block:Caption}{/block:Video}
  546.  
  547.  
  548. <!-----------------------------PERMALINKS------------------------------>
  549.  
  550.  {block:IndexPage}
  551. <div id="tex"><a href="{Permalink}" target="_blank" style="background-color: {color:links}; color:white; font-weight: bold; padding: 0px 2px 0px 2px; text-decoration:none;">{DayofMonthWithZero}{ShortMonth}{ShortYear}</a>{block:NoteCount} with {NoteCountwithLabel}{/block:NoteCount}</a> {block:RebloggedFrom}&copy; <a href="{ReblogRootURL}">{ReblogRootName}</a>, @ <a href="{ReblogParentURL}">{ReblogParentName}</a>,{/block:RebloggedFrom}{block:HasTags} <i>{block:Tags}<a href="/tagged/{Tag}" title="everything tagged as {Tag}">{Tag}</a> {/block:Tags}</i>{/block:HasTags}</div>
  552.  
  553. {/block:IndexPage}
  554.  
  555.  
  556. {block:Date}{block:PermalinkPage}<div id="permas"><a href="{Permalink}" target="_blank">&nbsp;Posted on {DayOfWeek} {DayOfMonth}{DayOfMonthSuffix}, {Month} {Year}{block:NoteCount} with {NoteCountWithLabel} {/block:NoteCount}</a>{block:RebloggedFrom} <br><a href="{ReblogParentURL}">&nbsp;<small><small>&hearts;</small></small> {ReblogParentName}&nbsp;</a><a href="{ReblogRootURL}">&nbsp;&copy; {ReblogRootName}&nbsp;</a>{/block:RebloggedFrom}<br>{block:HasTags}{block:Tags}&nbsp;<i><a href="/tagged/{Tag}">{Tag}</a></i>&nbsp;{/block:Tags}{/block:HasTags}</div>{/block:PermalinkPage}<div id="clear"></div>{/block:Date}
  557.  
  558.  
  559.  
  560. </div><!--entries-->
  561.  
  562.  
  563. {/block:Posts}
  564.  
  565.  
  566. {block:PostNotes}{block:RebloggedFrom}Reblogged from: <a href="{ReblogParentURL}">{ReblogParentName}</a>{/block:RebloggedFrom},{block:ContentSource} Original posted by: <a href="{SourceURL}">{block:SourceLogo}<img src="{BlackLogoURL}" width="{LogoWidth}" height="{LogoHeight}"alt="{SourceTitle}"/>{/block:SourceLogo}{block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo}</a>{/block:ContentSource}<div id="notes">{PostNotes}</div><br>{/block:PostNotes}
  567.  
  568.  
  569. </div><!--content-->
  570.  
  571. </body>
  572. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement
Public Pastes
Advertisement
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!