API tools faq
paste
Advertisement
emmelinethemes

theme 04: polaroids (a)

emmelinethemes
Jul 23rd, 2014
337
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 5 13.40 KB | None | 0 0
raw download clone embed print report
  1.     <!DOCTYPE html>
  2.     <head>
  3.  
  4.  
  5.  <!---THEME 04 (A) BY MYROARY AT EMMELINETHEMES PLEASE DON'T STEAL, REMOVE THE CREDIT, USE AS A BASE CODE, OR REDISTRIBUTE. LOOK IF YOU WANT A BASECODE USE IRMA'S IT'S LINKED UNDER THIS. IF YOU HAVE ANY QUESTIONS FEEL FREE TO ASK! THANK YOU AND HAVE A NICE DAY! -->
  6.  
  7.  
  8.  
  9.     <!--
  10.    base code by irma at primrosetylers.tumblr.com
  11.    do not steal or redistribute-->
  12.        
  13.         <title>{Title}</title>
  14.         {block:Description}<meta name="description" content="{MetaDescription}">{/block:Description}
  15.         <link rel="shortcut icon" href="{Favicon}">
  16.         <link rel="alternate" type="application/rss+xml" href="{RSS}">
  17.  
  18.         <!-- meta stuffs go here -->
  19.        
  20.         <meta name="color:background" content="#fff">
  21.         <meta name="color:link" content="#aaa">
  22.         <meta name="color:link hover" content="#000"/>
  23.         <meta name="color:border"content=""/>
  24.         <meta name="color:sidebar links" content=""/>
  25.     <meta name="color:text" content=""/>
  26.        
  27.         <meta name="image:sidebar" content="">
  28.        
  29.         <meta name="text:link 1" content="">
  30.         <meta name="text:link 1 url" content="">
  31.         <meta name="text:link 2" content="">
  32.         <meta name="text:link 2 url" content="">
  33.         <meta name="text:link 3" content="">
  34.         <meta name="text:link 3 url" content="">
  35.         <meta name="text:link 4" content="">
  36.         <meta name="text:link 4 url" content="">
  37.         <meta name="text:link 5" content="">
  38.         <meta name="text:link 5 url" content="">
  39.  
  40.         <!-- metas end-->
  41.        
  42.         <script src="http://static.tumblr.com/rzl30kg/eAxm7a751/jquery            .style-my-tooltips.js"></script>
  43.         <script>
  44.         (function($){
  45.         $(document).ready(function(){
  46.            $("[title]").style_my_tooltips({
  47.                tip_follows_cursor:true,
  48.                tip_delay_time:200,
  49.                tip_fade_speed:300
  50.            }
  51.                );
  52.         });
  53.         })(jQuery);
  54.         </script>
  55.        
  56.                    
  57.         <style>
  58.        
  59.         #s-m-t-tooltip{
  60.         max-width:300px;
  61.         margin:15px;
  62.         padding:2px 8px;
  63.         border:1px solid #ddd;
  64.         border-radius:4px;
  65.         background:#fff;
  66.         color:#aaa;
  67.         z-index:999999;
  68.         font-size:8px;
  69.         font-style:italic;
  70.         text-transform:uppercase;
  71.         box-shadow:1px 1px 3px rgba(0,0,0,.1);}
  72.        
  73.        
  74.        
  75.         body {
  76.         background-color:{color:background};
  77.         font-family:times;
  78.         font-size:12px;
  79.     color:{color:font}
  80.         }
  81.        
  82.         big {
  83.         font-size:14px;
  84.         }
  85.        
  86.         small {
  87.         font-size:10px;
  88.         }
  89.        
  90.         a {
  91.         text-decoration:none;
  92.         color:{color:link};
  93.         -webkit-transition:0.5s;
  94.         -moz-transition:0.5s;
  95.         -ms-transition:0.5s;
  96.         -o-transition:0.5s;
  97.         }
  98.        
  99.         a:hover {
  100.         color:{color:link hover};
  101.         }
  102.  
  103.        
  104.         blockquote {
  105.         border-left:1px solid #000;
  106.         padding-left:10px;
  107.         }
  108.        
  109.         h2 {
  110.         text-align:center;
  111.         }
  112.        
  113.         /*sidebar*/
  114.         #sidebar {
  115.         width:180px;
  116.         text-align:center;
  117.         position:fixed;
  118.         top:200px;
  119.         left:200px;
  120.         border-left:3px;
  121.         border-right:3px
  122.         border-color:{color:border};
  123.         background:{color:border};
  124.         }
  125.        
  126.         #sidebar img {
  127.         width:150px;
  128.         height:150px;
  129.         background-color:{color:border};
  130.         padding-top:12px;
  131.         }
  132.        
  133.         #sidebar img {
  134.         -webkit-filter: grayscale(100%);
  135.         z-index: -9999999999999999999999999px;
  136.         -webkit-transition: all 0.9s ease-in-out;
  137.         -moz-transition: all 0.9s ease-in-out;
  138.         -o-transition: all 0.9s ease-in-out;
  139.         -ms-transition: all 0.9s ease-in-out;
  140.         transition: all 0.9s ease-in-out;
  141.         }
  142.        
  143.         #sidebar img:hover {
  144.         -webkit-filter: grayscale(0%);
  145.         z-index: -9999999999999999999999999px;
  146.         -webkit-transition: all 0.9s ease-in-out;
  147.         -moz-transition: all 0.9s ease-in-out;
  148.         -o-transition: all 0.9s ease-in-out;
  149.         -ms-transition: all 0.9s ease-in-out;
  150.         transition: all 0.9s ease-in-out;
  151.         }
  152.  
  153.  
  154.        
  155.         #description{
  156.         margin:5px;
  157.         font-size:11px;
  158.         }
  159.  
  160.          /*pag*/
  161.          
  162.         #pag {
  163.         font-size:14px;
  164.         margin:5px;
  165.         }
  166.        
  167.        
  168.         #links {
  169.         position:fixed;
  170.         width:10px;
  171.         text-align:left;
  172.         padding: 10px;
  173.     color:{color:sidebar links};
  174.         word-spacing:8px;
  175.         text-transform:uppercase;
  176.         margin-top:-150px;
  177.         opacity:0;
  178.         padding-right:30px;
  179.         -webkit-transition:all .8s ease-in-out;
  180.         -moz-transition:all .8s ease-in-out;
  181.         -o-transition:all .8s ease-in-out;
  182.         transition:all .8s ease-in-out;
  183.         }
  184.        
  185.         #links a {
  186.         transition:all 0.6s ease-in-out;
  187.         border:1.5px solid #d1d0ce;
  188.         line-height:220%;
  189.         padding:2px;
  190.         color:#d1d0ce;
  191.        
  192.         }
  193.        
  194.         #sidebar:hover #links{
  195.         opacity:1;
  196.         margin-left:-40px;
  197.         padding-left:-30px;
  198.         -webkit-transition:all .8s ease-in-out;
  199.         -moz-transition:all .8s ease-in-out;
  200.         -o-transition:all .8s ease-in-out;
  201.         transition:all .8s ease-in-out;
  202.        
  203.        
  204.         }
  205.        
  206.        
  207.         /*all posts*/
  208.         #postage {
  209.         width:500px;
  210.         margin-left:500px;
  211.         margin-top:30px;
  212.         margin-bottom:30px;
  213.         font-family:arial;
  214.         }
  215.        
  216.         /*text posts*/
  217.         #text {
  218.         text-align:left;
  219.         }
  220.        
  221.         /*photo posts*/
  222.         #photo {
  223.         text-align:left;
  224.         }
  225.        
  226.         /*photoset posts*/
  227.         #photoset {
  228.         text-align:left;
  229.         }
  230.        
  231.         /*quote posts*/
  232.         #words {
  233.         font-style:bold;
  234.         text-align:center;
  235.         font-size:15px;
  236.         }
  237.        
  238.         .source {
  239.         padding:3px;
  240.         text-align:center;
  241.         font-size:10px;
  242.         padding-right:5px;
  243.         }
  244.        
  245.         /*link posts*/
  246.         #linkpost {
  247.         text-align:center;
  248.         font-size:11px;
  249.         }
  250.        
  251.         .linkety {
  252.         font-size:15px;
  253.         }
  254.        
  255.         /*chat posts*/
  256.         #chat ul {
  257.         list-style:none;
  258.         font-family:courier;
  259.         }
  260.        
  261.         .label {
  262.         text-transform:uppercase;
  263.         }
  264.        
  265.         /*video posts*/
  266.         #video {
  267.         text-align:left;
  268.         }
  269.        
  270.         /*audio posts*/
  271.         #audioplayer {
  272.         width:30px;
  273.         height:30px;
  274.         overflow:hidden;
  275.         position:absolute;
  276.         margin-top:35px;
  277.         margin-left:35px;
  278.         opacity:0.7;
  279.         }
  280.        
  281.         #albumart {
  282.         width:100px;
  283.         height:100px;
  284.         background-color:#e3e3e3;
  285.         }
  286.        
  287.         /*ask posts*/
  288.         #question {
  289.     padding:10px;
  290.     text-align:justify;
  291.     line-height:10px;
  292.     min-height:50px;
  293.     padding-bottom:10px
  294.     }
  295.    
  296. .question {
  297.     margin-left:55px;
  298.     }
  299.    
  300. .asker {
  301.     margin:5px 0px 4px 60px;
  302.     font-size:7px
  303.     font-family:arial;
  304.     text-transform:uppercase;
  305.     letter-spacing:1px;
  306.     }    
  307.    
  308. .asker a {
  309.     margin-left:-5px;
  310.     }
  311.    
  312. .portrait {
  313.     position:absolute;
  314.     height:48px;
  315.     width:48px;
  316.     margin-left:10px;
  317.     }    
  318.  
  319. .portrait img {
  320.     border-radius:100px;
  321.     }
  322.        
  323.         /*info*/
  324.         #postage:hover .info {
  325.         }
  326.  
  327.         .info {
  328.         text-align:center;
  329.         text-transform:lowercase;
  330.         width:500px;
  331.         font-size:10px;
  332.         }
  333.        
  334.         .info a {
  335.         color:{color:link hover};
  336.         }
  337.        
  338.         .info a:hover {
  339.         color:{color:link};
  340.         }
  341.        
  342.         .tags {
  343.         font-size:8px;
  344.         text-transform:lowercase;
  345.         margin-bottom:50px;
  346.         opacity:0;
  347.         }
  348.        
  349.         #postage:hover .tags {
  350.         opacity:1;
  351.         -moz-transition-duration:1s;
  352.         -webkit-transition-duration:1s;
  353.         -o-transition-duration:1s;
  354.         }
  355.  
  356.        
  357.         #credit {
  358.         right:10px;
  359.         bottom:10px;
  360.         font-size:12px;
  361.         font-weight:bold;
  362.         text-transform:lowercase;
  363.         text-align:right;
  364.         position:fixed;
  365.         }
  366.        
  367.        
  368.         {CustomCSS}
  369.         </style>
  370.     </head>
  371.     <body>
  372.    
  373.     <div id="sidebar">
  374.    
  375.     <img src="{image:sidebar}" alt=""/>
  376.     <div id="links">
  377.     {block:iflink1}<a href="{text:link 1 url}" title="{text:link 1}"> 01 </a>{/block:iflink1}<p></p>
  378.     {block:iflink2}<a href="{text:link 2 url}" title="{text:link 2}"> 02</a>{/block:iflink2}<p></p>
  379.     {block:iflink3}<a href="{text:link 3 url}" title="{text:link 3}">03</a>{/block:iflink3}<p></p>
  380.     {block:iflink4}<a href="{text:link 4 url}" title="{text:link 4}">04</a>{/block:iflink4}<p></p>
  381.     {block:iflink5}<a href="{text:link 5 url}" title="{text:link 5}">05</a>{/block:iflink5}
  382.     </div> <!--links-->
  383.    
  384.    
  385.  
  386.     <div id="description">{Description}</div>
  387.    
  388.  
  389.    
  390.    
  391.     {block:Pagination}
  392.     <div id="pag">
  393.     {block:PreviousPage}<a href="{PreviousPage}"> ↢</a>{/block:PreviousPage}
  394.     {block:NextPage}<a href="{NextPage}">↣ </a>{/block:NextPage}
  395.     </div>
  396.     {/block:Pagination}
  397.    
  398.     </div> <!--sidebar-->
  399.    
  400.     {block:Posts}
  401.     <div id="postage">
  402.    
  403.     {block:Text}
  404.     <div id="text">
  405.     <h2><a href="{Permalink}">{Title}</a></h2>  
  406.     {Body}
  407.     </div> <!--text post-->
  408.     {/block:Text}
  409.    
  410.     {block:Photo}
  411.     <div id="photo">
  412.     <img src="{PhotoURL-500}" alt="{PhotoAlt}"/>
  413.     {block:Caption}<div class="caption">{Caption}</div>{/block:Caption}
  414.     </div> <!--photo post-->
  415.     {/block:Photo}
  416.    
  417.     {block:Panorama}
  418.     <div id="panorama">
  419.     {LinkOpenTag}
  420.     <img src="{PhotoURL-Panorama}" alt="{PhotoAlt}"/>
  421.     {LinkCloseTag}
  422.     {block:Caption}
  423.     <div class="caption">{Caption}</div>
  424.     {/block:Caption}
  425.     </div> <!--panorama post-->
  426.     {/block:Panorama}
  427.    
  428.     {block:Photoset}
  429.     <div id="photoset">
  430.     {Photoset-500}
  431.     {block:Caption}<div class="caption">{Caption}</div>{/block:Caption}
  432.     </div> <!--photoset-->
  433.     {/block:Photoset}
  434.    
  435.     {block:Quote}
  436.     <div id="quote">
  437.     <div id="words">{Quote}</div>
  438.     {block:Source}<div class="source">- {Source}</div>{/block:Source}
  439.     </div> <!--quote-->
  440.     {/block:Quote}
  441.    
  442.     {block:Link}
  443.     <div id="linkpost">
  444.     {block:PostTitle}<h2><a href="{Permalink}">{PostTitle}</a></h2>{/block:PostTitle}  
  445.     <a href="{URL}" class="linkety" {Target}>{Name}</a>
  446.     {block:Description}
  447.     <div class="linkdesc">{Description}</div>
  448.     {/block:Description}
  449.     </div> <!--link-->
  450.     {/block:Link}
  451.    
  452.     {block:Chat}
  453.     <div id="chat">
  454.     <h2><a href="{Permalink}">{Title}</a></h2>
  455.     <ul>
  456.     {block:Lines}
  457.     <li class="{Alt} user_{UserNumber}">
  458.     {block:Label}
  459.     <span class="label">{Label}</span>
  460.     {/block:Label}{Line}
  461.     </li>
  462.     {/block:Lines}
  463.     </ul>
  464.     </div> <!--chat-->
  465.     {/block:Chat}
  466.    
  467.     {block:Video}
  468.     <div id="video">
  469.     {block:PostTitle}<h2><a href="{Permalink}">{PostTitle}</a></h2>{/block:PostTitle}  
  470.     {Video-500}
  471.     {block:Caption}<div class="caption">{Caption}</div>{/block:Caption}
  472.     </div> <!--video-->
  473.     {/block:Video}
  474.    
  475.     {block:Audio}
  476.     <div id="audio">
  477.     <table style="padding:5px; background-color:#fff;margin-bottom:5px;">
  478.     <tr>
  479.     <td style="vertical-align:top;padding-right:10px;"><divid="audioplayer">{AudioPlayerWhite}</div>
  480.     <divid="albumart">
  481.     {block:AlbumArt}
  482.     <img src="{AlbumArtURL}" style="width:100px;">
  483.     {/block:AlbumArt}</div></td>
  484.     <td style="vertical-align:top; font-size:11px; line-height:12px">        {block:TrackName}<i>title:</i> {TrackName} <br />{/block:TrackName}
  485.     {block:Artist}<i>artist:</i> {Artist} <br />{/block:Artist}
  486.     {block:Album}<i>album:</i> {Album} <br />{/block:Album}
  487.     {block:PlayCount}<i>played:</i> {FormattedPlayCount} times{/block:PlayCount}
  488.     </td>
  489.     </tr>
  490.     </table>
  491.     {block:Caption}<div class="caption">{Caption}</div>{/block:Caption}
  492.     </div> <!--audio-->
  493.     {/block:Audio}
  494.  
  495. {block:Answer}<div id="question" style="border-bottom:1px solid {color:border}; border-top:1px solid {color:border};"><div class="portrait"><img src="{AskerPortraitURL-40}"></div><div class="asker">{Asker}</div><div class="question">{Question}</div></div>{Answer}{/block:Answer}
  496.  
  497.     <div class="info">
  498.     <a href="{Permalink}" title="{TimeAgo}">▣</a> - <a href="{Permalink}" title="{NoteCountWithLabel}">▣</a> - <a href="{ReblogURL}" target="_blank" title="reblog">▣</a> -
  499.     {block:RebloggedFrom}<a href="{ReblogParentURL}" title="via">▣</a>{/block:RebloggedFrom} {block:ContentSource} - <a href="{SourceURL}" title="source">▣</a>{/block:ContentSource}
  500.     {block:HasTags}
  501.     <div class="tags">
  502.     tagged {block:Tags} - <a href="{TagURL}">{Tag}</a>{/block:Tags}
  503.     </div>
  504.     {/block:HasTags}
  505.     </div> <!--info-->
  506.  
  507.    
  508.     </div> <!--postage-->
  509.     {/block:Posts}
  510.    
  511.     <div id="credit"><a href="http://myrory.tumblr.com">em</a></div>
  512.     </body>
  513.     </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!