quenma

theme 09

Apr 2nd, 2016
587
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 21.09 KB | None | 0 0
  1. <!--
  2.  
  3.  
  4. |||||||| theme 09
  5. || by leopardraws.tumblr.com
  6.  
  7. 01. don't redistribute
  8. 02. don't copy any part of the code
  9. 03. don't remove/move the credits
  10. 04. feel free to change fonts and colors
  11. 05. message me if there is any bugs
  12.  
  13. thanks for using my themes
  14.  
  15. -->
  16.  
  17.  
  18. <html>
  19.     <head>
  20.        
  21.         <link href='https://fonts.googleapis.com/css?family=Ubuntu:400,700,400italic,700italic&subset=latin,latin-ext' rel='stylesheet' type='text/css'>
  22.    
  23.         <title>{title}</title>
  24.         <link rel="shortcut icon" href="{favicon}">
  25.        
  26.         <meta name="image:Avatar">
  27.        
  28.         <meta name="color:Background" content="#fff">
  29.         <meta name="color:Fonts" content="#999">
  30.         <meta name="color:Post titles" content="#222">
  31.         <meta name="color:Links" content="#222">
  32.         <meta name="color:Links hover" content="#9cdfed">
  33.         <meta name="color:Entry" content="#fff">
  34.         <meta name="color:Sidebar" content="#fff">
  35.         <meta name="color:Borders" content="#eee">
  36.         <meta name="color:Question background" content="#f9f9f9">
  37.        
  38.         <meta name="select:Posts width" content="150px">
  39.         <meta name="select:Posts width" content="200px">
  40.         <meta name="select:Posts width" content="250px">
  41.         <meta name="select:Posts width" content="300px">
  42.         <meta name="select:Posts width" content="350px">
  43.         <meta name="select:Posts width" content="400px">
  44.         <meta name="select:Posts width" content="450px">
  45.         <meta name="select:Posts width" content="500px">
  46.         <meta name="select:Posts width" content="540px">
  47.        
  48.         <meta name="select:Font size" title="10" content="10.5">
  49.         <meta name="select:Font size" title="11" content="11.5">
  50.         <meta name="select:Font size" title="12" content="12.5">
  51.        
  52.         <meta name="select:Titles size" content="15">
  53.         <meta name="select:Titles size" content="16">
  54.         <meta name="select:Titles size" content="17">
  55.         <meta name="select:Titles size" content="18">
  56.         <meta name="select:Titles size" content="19">
  57.         <meta name="select:Titles size" content="20">
  58.         <meta name="select:Titles size" content="21">
  59.         <meta name="select:Titles size" content="22">
  60.        
  61.         <meta name="select:Sidebar image" content="circle" title="Circle">
  62.         <meta name="select:Sidebar image" content="round" title="Rounded borders">  
  63.         <meta name="select:Sidebar image" content="square" title="Square">
  64.        
  65.         <meta name="select:Sidebar text" content="Left">
  66.         <meta name="select:Sidebar text" content="Center">
  67.         <meta name="select:Sidebar text" content="Right">
  68.         <meta name="select:Sidebar text" content="Justify">
  69.        
  70.         <meta name="select:Hover cursor" content="Hand">
  71.         <meta name="select:Hover cursor" content="Help">
  72.         <meta name="select:Hover cursor" content="Crosshair">
  73.        
  74.         <meta name="text:Link 1 URL" content="#url 01">
  75.         <meta name="text:Link 1 title" content="link 01">
  76.         <meta name="text:Link 2 URL" content="#url 02">
  77.         <meta name="text:Link 2 title" content="link 02">
  78.         <meta name="text:Link 3 URL" content="#url 03">
  79.         <meta name="text:Link 3 title" content="link 03">
  80.         <meta name="text:Sidebar title" content="Theme O9">
  81.         <meta name="text:Reblog title" content="R">
  82.         <meta name="text:Sidebar width" content="150">
  83.        
  84.         <meta name="if:Show captions" content="0">
  85.         <meta name="if:Show borders" content="0">
  86.         <meta name="if:Show sidebar title" content="0">
  87.         <meta name="if:Show sidebar image" content="0">
  88.         <meta name="if:Small sidebar image" content="1">
  89.         <meta name="if:Sidebar links border" content="0">
  90.         <meta name="if:Uppercase sidebar links" content="0">
  91.        
  92.        
  93.        
  94.     <style>
  95.        
  96.         /* defaults */
  97.         body {
  98.             font:{select:font size}px ubuntu, calibri, sans-serif;
  99.             margin:0;
  100.             padding:0;
  101.             line-height:180%;
  102.             text-align:left;
  103.             background:{color:background};
  104.             color:{color:fonts};}
  105.            
  106.         a { color:{color:links};
  107.             transition:.2s;
  108.             border-bottom:1px solid transparent;
  109.             text-decoration:none; }
  110.         a:hover { border-bottom:1px solid {color:links hover};
  111.             cursor:{select:hover cursor}; }
  112.            
  113.         p { margin:6px 0; }
  114.        
  115.         blockquote {
  116.             margin:5px 10px 5px 10px;
  117.             border-left:1px solid {color:borders};
  118.             padding-left:10px; }
  119.        
  120.         b, strong { color:{color:post titles}; }
  121.        
  122.        
  123.         /* posts basics */
  124.         #content {
  125.             width:0;
  126.             left:calc({text:sidebar width}px + 150px);
  127.             position:relative;
  128.             top:50px; }
  129.            
  130.         .entry {
  131.             padding:17px;
  132.             margin-bottom:150px;
  133.             width:{select:posts width};
  134.             {block:ifshowborders}
  135.             border:1px solid {color:borders};
  136.             {/block:ifshowborders}
  137.             background:{color:entry}; }
  138.  
  139.         .titles {
  140.             font-weight:700;
  141.             font-size:{select:titles size}px;
  142.             letter-spacing:-1px;
  143.             display:inline-block;
  144.             color:{color:post titles}; }
  145.        
  146.        
  147.         /* quote posts */
  148.         p.quotesource { margin-top:5px; }
  149.        
  150.        
  151.         /* link posts */
  152.         a .link-titles { transition:.2s;
  153.             border-bottom:0; }
  154.        
  155.         .link-excerpt {
  156.             padding:10px;
  157.             margin-top:-5px;
  158.             border:1px solid {color:borders};}
  159.            
  160.         /* chat posts */
  161.         .chatsodd, .chatseven { padding:4px 0; }
  162.         .chatsodd b, .chatseven b { font-weight:300; }
  163.        
  164.         /* photosets and photos */
  165.         #photopost { width:100%;
  166.             margin-bottom:-7px; }
  167.        
  168.         .pxu-caption,
  169.         .arrow-down,
  170.         .photo-slideshow span.info
  171.         .photo-slideshow span.zoom { display:none; }
  172.        
  173.         .photo-slideshow a.tumblr-box { opacity:0; }
  174.        
  175.         .photo-slideshow { margin-bottom:5px; }
  176.        
  177.         /* ask posts */
  178.         .answer-question { font-size:8.5px;
  179.             letter-spacing:1px;
  180.             text-transform:uppercase;
  181.             display:table-cell;
  182.             line-height:15px;
  183.             width:calc({select:posts width} - 55px);
  184.             vertical-align:middle; }
  185.        
  186.         .asker-question { margin-top:0px; }
  187.        
  188.         .my-answer { padding:0px 10px;
  189.             margin:10px 0 8px;
  190.             border-left:1px solid {color:borders}; }
  191.        
  192.         #askerportrait { width:30px;
  193.             padding-top:6px;
  194.             display:table-cell;
  195.             vertical-align:middle;
  196.             padding-right:10px; }
  197.        
  198.         #askerportrait img { width:30px; }
  199.         #askerportrait img.round { border-radius:3px; }
  200.         #askerportrait img.circle { border-radius:100px; }
  201.        
  202.         /* audio posts */
  203.         .audio-box { margin-bottom:8px; }
  204.         .audioplayer-inner {
  205.             width:26px;
  206.             height:27px;
  207.             overflow: hidden; }
  208.          
  209.         .audioplayer-outer {
  210.             padding:6px;
  211.             width: 26px;
  212.             height: 27px;
  213.             position: relative;
  214.             display: inline-block;
  215.             overflow: hidden;
  216.             background:white;
  217.             margin:8px 9px 0;
  218.             z-index: 10; }
  219.          
  220.         .audio-info { text-align: left;
  221.             position: absolute;
  222.             margin-top: 17px;
  223.             margin-left: 4px;
  224.             width:calc({select:posts width} - 100px);
  225.             display: inline-block;}
  226.          
  227.         .audio-info#audio-em { position:relative;
  228.             padding:0 6px 0 20px;
  229.             margin:10px 0 0 15px!important;}
  230.          
  231.         #audio-em br { display:none; }
  232.         .audio-info b { text-transform:uppercase; margin-right:4px;}
  233.         .a-emb { margin:10px 10px 4px; }
  234.        
  235.         /* permalink */
  236.         .perma-controls { display:block;
  237.             margin-bottom:-3px;}
  238.        
  239.         .perma-controls a { color:{color:links}; }
  240.        
  241.         .tags a { text-decoration:none;
  242.             opacity:.6;}
  243.            
  244.         .tags { line-height:15px; }
  245.        
  246.         /* sidebar */
  247.         #sidebar {
  248.             width:{text:sidebar width}px;
  249.             background:{color:sidebar};
  250.             position:fixed;
  251.             top:50px;
  252.             padding:15px;    
  253.             text-align:{select:sidebar text};
  254.             left:50px;
  255.             {block:ifshowborders}
  256.             border:1px solid {color:borders};
  257.             {/block:ifshowborders}}
  258.        
  259.         #sidebar #avatar { width:50px;
  260.             margin-bottom:11px;
  261.             {block:ifnotsmallsidebarimage}
  262.             width:{text:sidebar width}px;
  263.             {/block:ifnotsmallsidebarimage}
  264.             display:inline-block;
  265.             {block:ifnotshowsidebarimage}
  266.             display:none;
  267.             {/block:ifnotshowsidebarimage}
  268.         }
  269.        
  270.         #avatar.round { border-radius:3px; }
  271.         #avatar.circle { border-radius:100px; }
  272.        
  273.         #sidebar .sidebar-title { display:none;
  274.             {block:ifshowsidebartitle}
  275.             display:block;
  276.             {/block:ifshowsidebartitle}
  277.         }
  278.            
  279.         #sidebar .links { margin:0 0 -10px;
  280.             {block:ifnotsidebarlinksborder}
  281.             margin:-5px 0 -4px;
  282.             {/block:ifnotsidebarlinksborder} }
  283.         #sidebar .links a {
  284.             text-align:{select:sidebar text};
  285.             display:block;
  286.             padding:0 0 4px;
  287.             line-height:11px;
  288.             margin-bottom:8px;
  289.             transition:.2s;
  290.             {block:ifnotsidebarlinksborder}
  291.             margin:0 -5px;
  292.             padding:7px 5px;
  293.             {/block:ifnotsidebarlinksborder}
  294.             {block:ifuppercasesidebarlinks}
  295.             font-size:8.5px;
  296.             letter-spacing:1px;
  297.             text-transform:uppercase;
  298.             {/block:ifuppercasesidebarlinks}
  299.             text-decoration:none; }
  300.        
  301.         .links a:hover { background:{color:links hover};
  302.             {block:ifsidebarlinksborder}
  303.             background:none;
  304.             border-bottom:1px solid {color:links hover}!important;
  305.             {/block:ifsidebarlinksborder} }
  306.        
  307.         #sidebar .desc { margin:10px 0 14px;
  308.             {block:ifnotshowsidebartitle}
  309.                 margin:0 0 10px;
  310.             {/block:ifnotshowsidebartitle}}
  311.        
  312.         /* extras */
  313.         #s-m-t-tooltip{
  314.             max-width:240px;
  315.             padding:7px 9px;
  316.             margin-left:25px;
  317.             margin-right:22px;
  318.             font-size:8.5px;
  319.             text-transform:uppercase;
  320.             /*font-style:italic;*/
  321.             margin-top:18px;
  322.             letter-spacing:1px;
  323.             z-index:900;
  324.             transition:.2s;
  325.             color:{color:font};
  326.             background-color:{color:entry}; }
  327.  
  328.        
  329.         /* post notes */
  330.         .post-notes img.avatar {
  331.             width: 10px;
  332.             border-radius: 100%;
  333.             margin-top: 5px;
  334.             margin-right: 5px;
  335.             margin-bottom: -2px; }
  336.        
  337.         .post-notes li.note.more_notes_link_container {
  338.             text-align:left!important; }
  339.        
  340.         a.faketheme { text-decoration:none;
  341.             background:transparent; }
  342.            
  343.            
  344.         .tmblr-lightbox { background-color: rgba(255,255,255,.95)!important; }
  345.         .tmblr-lightbox .vignette { background: transparent!important }
  346.         .tmblr-lightbox .lightbox-image { box-shadow:0 0 0 transparent!important; }
  347.         .tmblr-lightbox .lightbox-caption {
  348.             font-family: ubuntu!important;
  349.             font-size: 11.5px!important;
  350.             font-weight: normal!important;
  351.             color:{color:font}!important;
  352.             text-shadow: 0 0 0 transparent!important; }
  353.  
  354.        
  355.         {CustomCSS}
  356.        
  357.     </style></head><body>
  358.        
  359.        
  360.         <div id="content">
  361.        
  362.         <div id="sidebar">
  363.         <img src="{image:avatar}" id="avatar" class="{select:sidebar image}">
  364.         <div class="titles sidebar-title">{text:sidebar title}</div>
  365.         <div class="desc">{Description}</div>
  366.         <div class="links">
  367.             <a href="/">index</a>
  368.             <a href="/ask">inbox</a>
  369.             <a href="{text:link 1 url}">{text:link 1 title}</a>
  370.             <a href="{text:link 2 url}">{text:link 2 title}</a>
  371.             <a href="{text:link 3 url}">{text:link 3 title}</a>
  372.         </div>
  373.             {block:Pagination}
  374.             <br><i>
  375.             {block:PreviousPage}
  376.             <a href="{PreviousPage}">← back</a>
  377.             {/block:PreviousPage}
  378.             {block:NextPage}
  379.             <a href="{NextPage}">forth →</a>
  380.             {/block:NextPage}
  381.             </i>
  382.             {/block:Pagination}
  383.            
  384.         </div>
  385.        
  386.         {block:Posts}
  387.             <article class="entry">
  388.            
  389.            
  390.             {block:Text}
  391.             {block:Title}<div class="titles">{Title}</div>{/block:Title}
  392.             {Body}
  393.             {/block:Text}
  394.            
  395.             {block:Photo}
  396.             <img src="{PhotoURL-HighRes}" id="photopost">
  397.             {block:IndexPage}
  398.                 {block:IfShowCaptions}
  399.                     {block:Caption}{Caption}{/block:Caption}
  400.                 {/block:IfShowCaptions}
  401.             {/block:IndexPage}
  402.             {block:PermalinkPage}
  403.                     {block:Caption}{Caption}{/block:Caption}
  404.             {/block:PermalinkPage}
  405.             {/block:Photo}
  406.            
  407.             {block:Photoset}
  408.             <div class="photo-slideshow" id="photoset_{PostID}" data-layout="{PhotosetLayout}">
  409.  
  410.   {block:Photos}
  411.     <div class="photo-data">
  412.       <div class="pxu-photo">
  413.         <img alt="{PhotoAlt}" src="{PhotoURL-500}" width="{PhotoWidth-500}" height="{PhotoHeight-500}" data-highres="{PhotoURL-HighRes}" data-width="{PhotoWidth-HighRes}" data-height="{PhotoHeight-HighRes}" class="{block:Exif}exif-yes {/block:Exif}{block:Caption}caption-yes{/block:Caption}" {block:Exif}data-camera="{block:Camera}{Camera}{/block:Camera}" data-iso="{block:ISO}{ISO}{/block:ISO}" data-aperture="{block:Aperture}{Aperture}{/block:Aperture}" data-exposure="{block:Exposure}{Exposure}{/block:Exposure}" data-focal="{block:FocalLength}{FocalLength}{/block:FocalLength}"{/block:Exif} {block:Caption}data-caption="{Caption}"{/block:Caption}>
  414.       </div>
  415.       <div class="icons">
  416.         <a class="tumblr-box" rel="post-{PostID}" href="{PhotoURL-HighRes}">
  417.           <span class="zoom"></span>
  418.         </a>
  419.         <span class="info"></span>
  420.       </div>
  421.     </div>
  422.   {/block:Photos}
  423.  
  424. </div><!-- close SLIDESHOW -->
  425.  
  426.             {block:IndexPage}
  427.                 {block:IfShowCaptions}
  428.                     {block:Caption}{Caption}{/block:Caption}
  429.                 {/block:IfShowCaptions}
  430.             {/block:IndexPage}
  431.             {block:PermalinkPage}
  432.                     {block:Caption}{Caption}{/block:Caption}
  433.             {/block:PermalinkPage}
  434.             {/block:Photoset}
  435.            
  436.            
  437.             {block:Quote}
  438.             <div class="titles">{Quote}</div>
  439.             <p class="quotesource">{Source}</p>
  440.             {/block:Quote}
  441.            
  442.             {block:Link}
  443.             <a href="{URL}"><div class="titles link-titles">→ {Name}</div></a>
  444.                 {block:Excerpt}
  445.                     <div class="link-excerpt">{Excerpt}</div>
  446.                 {/block:Excerpt}
  447.                 {block:Description}
  448.                     <blockquote>{Description}</blockquote>
  449.                 {/block:Description}
  450.             {/block:Link}
  451.            
  452.             {block:Chat}
  453.             {block:Title}<div class="titles">{Title}</div>{/block:Title}
  454.             {block:Lines}
  455.             <div class="chats{Alt}">
  456.                 {block:Label}<b>{Label}</b>{/block:Label}
  457.                 {Line}
  458.             </div>
  459.             {/block:Lines}
  460.             {/block:Chat}
  461.            
  462.             {block:Audio}
  463.             <div class="audio-box">
  464.             {block:AudioEmbed}
  465.             <div class="a-emb">
  466.             {AudioEmbed}
  467.             </div>
  468.             {/block:AudioEmbed}
  469.    
  470.             <div id="audio-content">
  471.                 {block:AudioPlayer}
  472.                 <div class="audioplayer-outer">
  473.                     <div class="audioplayer-inner">
  474.                         {AudioPlayerWhite}
  475.                     </div>
  476.                 </div>
  477.                 {/block:AudioPlayer}
  478.        
  479.                 <div class="audio-info"
  480.              {block:AudioEmbed}id="audio-em"{/block:AudioEmbed}>
  481.                     {block:Artist}<b>{Artist}</b>{/block:Artist}
  482.                     {block:TrackName}{TrackName}{/block:TrackName}
  483.                 </div>
  484.        
  485.             </div>
  486.             </div> <!-- /boxes -->
  487.             {/block:Audio}      
  488.            
  489.            
  490.             {block:Video}
  491.             <div class="video">{Video-500}</div>
  492.             {block:IndexPage}
  493.                 {block:IfShowCaptions}
  494.                     {block:Caption}{Caption}{/block:Caption}
  495.                 {/block:IfShowCaptions}
  496.             {/block:IndexPage}
  497.             {block:PermalinkPage}
  498.                     {block:Caption}{Caption}{/block:Caption}
  499.             {/block:PermalinkPage}
  500.             {/block:Video}            
  501.            
  502.            
  503.             {block:Answer}
  504.             <div id="askerportrait">
  505.             <img src="{AskerPortraitURL-128}"
  506.                 class="{select:sidebar image}">
  507.             </div>
  508.             <div class="answer-question">
  509.             {Asker} asked:
  510.             <div class="asker-question">{Question}</div>
  511.             </div>
  512.             <div class="my-answer">{Answer}</div>
  513.             {/block:Answer}
  514.            
  515.             {block:Date}
  516.             <div class="permalink-outer">
  517.                
  518.                 <div class="perma-controls">
  519.             <a href="{ReblogURL}" title="reblog">{text:reblog title}<a> :
  520.             <a href="{Permalink}" title="permalink">{FormattedNoteCount}N</a>
  521.                 </div>
  522.                 {block:HasTags}
  523.                 <div class="tags">
  524.                 {block:Tags}
  525.                 <a href="{TagURL}">#{Tag}</a>
  526.                 {/block:Tags}
  527.                 </div>
  528.                 {/block:HasTags}
  529.                
  530.             </div>
  531.             {/block:Date}
  532.            
  533.             </article>
  534.            
  535.             {block:PermalinkPage}
  536.             {block:PostNotes}
  537.             <div class="entry post-notes">
  538.                 {PostNotes}
  539.             </div>
  540.             {/block:PostNotes}
  541.             {/block:PermalinkPage}
  542.  
  543.  
  544.         {block:ContentSource}
  545.         <!-- {SourceURL}{block:SourceLogo}<img src="{BlackLogoURL}"
  546.       width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" />
  547.       {/block:SourceLogo}
  548.       {block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo} -->
  549.         {/block:ContentSource}
  550.         {block:ReblogParent}{/block:ReblogParent}
  551.  
  552.         {/block:Posts}
  553.         </div>
  554.        
  555.     <style>
  556.         #coded { position:fixed;
  557.         right:38px; bottom:38px;
  558.         display:block;
  559.         padding:7px;
  560.         border-radius:1px;
  561.         background:{color:links hover};
  562.         width:0px;
  563.         height:0px;
  564.         z-index:90000;
  565.         transition:.2s;
  566.         }
  567.        
  568.         #coded:hover { opacity:.7; }
  569.        
  570.     </style>
  571.  
  572.        
  573. <a href="//leopardraws.tumblr.com" title="@leopardraws" id="coded"></a>
  574.  
  575.        
  576.     </body>
  577.    
  578.    
  579.  
  580. <script src="//ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js">
  581. </script>
  582.  
  583. <script src ="//static.tumblr.com/fwgzvyf/Oj1o08f6h/shythemes.vr.js"></script>
  584.  
  585. <script src="//static.tumblr.com/ev0x8sk/2KInubuiu/smt-jquery.js"></script>
  586. <script src="//static.tumblr.com/ev0x8sk/Jqinubuiy/smt.js"></script>
  587.  
  588. <script>
  589. // minimal soundcloud player © shythemes.tumblr
  590. $(document).ready(function(){
  591.    var color = '#cfe8f3'; // color of play button (hex)
  592.    $('.soundcloud_audio_player').each(function(){
  593.        $(this).attr({ src: $(this).attr('src').split('&')[0] + '&amp;liking=false&amp;sharing=false&amp;auto_play=false&amp;show_comments=false&amp;continuous_play=false&amp;buying=false&amp;show_playcount=false&amp;show_artwork=true&amp;origin=tumblr&amp;color=' + color.split('#')[1], height: 20, width: '100%' });
  594.    });
  595. });
  596. </script>
  597.  
  598.     <link href="http://static.tumblr.com/qudkd6d/OcDnl99gb/style.css" rel="stylesheet" type="text/css"/>
  599. <script src="http://static.tumblr.com/qudkd6d/Az6nkemqr/pxuphotoset.min.js"></script>
  600.    
  601. <script>
  602. $(document).ready(function(){
  603.    $('.photo-slideshow').pxuPhotoset({
  604.        lightbox: true,
  605.        rounded: false,
  606.        highRes: true,
  607.        gutter: '2px',
  608.        borderRadius: '0px',
  609.        photoset: '.photo-slideshow',
  610.        photoWrap: '.photo-data',
  611.        photo: '.pxu-photo'
  612.    });
  613. });
  614. </script>
  615.  
  616.  
  617.    
  618. </html>
Advertisement
Add Comment
Please, Sign In to add comment