Don't like ads? PRO users don't see any ads ;-)

it's A THEME

By: sonicwand on May 8th, 2012  |  syntax: None  |  size: 19.83 KB  |  hits: 1,188  |  expires: Never
download  |  raw  |  embed  |  report abuse  |  print
Text below is selected. Please press Ctrl+C to copy to your clipboard. (⌘+C on Mac)
  1. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN"
  2. "http://www.w3.org/TR/html4/frameset.dtd"><html>
  3.  
  4.  
  5.     <!--
  6.     Theme by Abir @ http://sonicwand.tumblr.com
  7.     Don't: remove the credit, redistribute, claim as your own or
  8.     use as a basecode. Enjoy the theme.
  9.     !-->
  10.  
  11.  
  12.     <head>
  13.  
  14. <link href='http://fonts.googleapis.com/css?family=Open+Sans+Condensed:300,300italic' rel='stylesheet' type='text/css'>
  15.         <title>{Title}</title>
  16.         <link rel="shortcut icon" href="{Favicon}">
  17.         <link rel="alternate" type="application/rss+xml" href="{RSS}">
  18.         {block:Description}
  19.         <meta name="description" content="{MetaDescription}">
  20.         {/block:Description}
  21.        
  22.         <meta name="color:Background" content="#F8F8F8">
  23.         <meta name="color:Font" content="#999999">
  24.         <meta name="color:Header" content="#777777">
  25.         <meta name="color:Post Header" content="#000000">
  26.         <meta name="color:Post" content="#FFFFFF">
  27.         <meta name="color:Link" content="#000000">
  28.         <meta name="color:Link Hover" content="#B2D0BF">
  29.         <meta name="color:Sidebar Link" content="#000000">
  30.         <meta name="color:Sidebar Link Hover" content="#000000">
  31.         <meta name="color:Sidebar Link Background" content="#E3F1E9">
  32.         <meta name="color:Sidebar Img Border" content="#FFFFFF">
  33.         <meta name="color:Permalink" content="#9C9C9C">
  34.         <meta name="color:Permalink Accent" content="#FFFFFF">
  35.         <meta name="color:Posted And With" content="#9C9C9C">
  36.         <meta name="color:Chat Even" content="#F3F3F3">
  37.         <meta name="color:Chat Odd" content="#F9F9F9">
  38.         <meta name="color:Quote" content="#000000">
  39.         <meta name="color:Comma" content="#E3F1E9">
  40.         <meta name="color:Comma Shadow" content="#FFFFFF">
  41.         <meta name="color:Ask Background" content="#F3F3F3">
  42.         <meta name="color:Asker Font" content="#000000">
  43.         <meta name="color:Block Quote Border" content="#000000">
  44.         <meta name="color:Bold Font" content="#000000">
  45.         <meta name="color:Pagination" content="#000000">
  46.         <meta name="font:Body" content="Trebuchet MS">
  47.         <meta name="image:Background" content="">
  48.         <meta name="image:Sidebar" content="">
  49.         <meta name="if:Hide Post Captions" content="0">
  50.         <meta name="if:Show Tags" content="1">
  51.         <meta name="text:Body Font Size" content="10px">
  52.         <meta name="text:Extra Link One Url" content="http://">
  53.         <meta name="text:Extra Link One Title" content="">
  54.         <meta name="text:Extra Link Two Url" content="http://">
  55.         <meta name="text:Extra Link Two Title" content="">
  56.        
  57.         <style type="text/css">
  58.             body{
  59.             background-image:url('{image:Background}');
  60.             font-family:{font:Body};
  61.             text-align:left;
  62.             font-size:{text:Body Font Size};
  63.             color:{color:Font};
  64.             background-color:{color:Background};
  65.             background-attachment:fixed;
  66.             background-repeat:repeat;
  67.             background-position:left top;
  68.             }
  69.  
  70.             a{
  71.             color: {color:link};
  72.             text-decoration: underline;
  73.             -webkit-transition-duration: .3s;
  74.             }
  75.             a:hover{
  76.             color:{color:Link Hover};
  77.             font-weight:none;
  78.             }
  79.             a img{
  80.             border:0
  81.             }
  82.            
  83.             #content{
  84.             margin-left:100px;
  85.             width:740px;
  86.             }
  87.            
  88.             #posts{
  89.             float:right;
  90.             width:510px;
  91.             }
  92.            
  93.             #side{
  94.             position:fixed;
  95.             float:left;
  96.             width: 130px;
  97.             margin-top:100px;
  98.             }
  99.            
  100.             #entry{
  101.             background-color:{color:post};
  102.             padding:5px;
  103.             margin-top:20px;
  104.             text-align:justify
  105.             }
  106.            
  107.             .info{
  108.             background-color:{color:Sidebar.};
  109.             padding:5px;
  110.             }
  111.            
  112.             h2{
  113.             font:normal 17px 'Open Sans Condensed', Helvetica, Arial;
  114.             color:{color:Post Header};
  115.             letter-spacing: 1px;
  116.             text-align: left;
  117.             margin-top: 1px;
  118.             padding: 2px;
  119.             margin-bottom:-5px;
  120.             }
  121.            
  122.             h3{
  123.             font:normal 10px consolas;
  124.             display:inline-block;
  125.             padding:2px; color:{color:Bold Font};
  126.             margin:0px; width:35px;
  127.             text-transform:uppercase;
  128.             }
  129.                
  130.             #portrait{
  131.             height:130px;
  132.             text-align:center;
  133.             padding:5px;
  134.             color:{color:Permalink};
  135.             }
  136.             .container {
  137.             width: 140px; height: 130px;
  138.             -webkit-perspective: 1000;
  139.             }
  140.             .front {
  141.             z-index: 10;
  142.             }
  143.             .container:hover .front {
  144.             z-index: 0;
  145.             }
  146.             .card {
  147.             width: 130px; height: 130px;
  148.             -webkit-transform-style: preserve-3d;
  149.                 -webkit-transition: 0.5s;
  150.             }
  151.                 .container:hover .card {
  152.                 -webkit-transform: rotateY(180deg);                            
  153.                 }.container:hover .back {opacity: 1;
  154.              -webkit-transition-duration: .7s;
  155.             -moz-transition-duration: .7s;
  156.             -ms-transition-duration: .7s;
  157.             -o-transition-duration: .7s;  
  158.             transition-duration: .7s; }
  159.             .face {
  160.                 position: absolute;
  161.             -webkit-backface-visibility: hidden;
  162.             }
  163.             .leftside {}
  164.                 .leftside .front {
  165.             overflow:hidden;
  166.             width: 130px; height:130px;
  167.             border-radius: 100px;
  168.             background-color:{color:Sidebar Img Border};
  169.             -webkit-transition-duration: .7s;
  170.             -moz-transition-duration: .7s;
  171.             -ms-transition-duration: .7s;
  172.             -o-transition-duration: .7s;  
  173.             transition-duration: .7s;
  174.                     }
  175.                 .leftside .back {
  176.             width: 130px; height: 130px;
  177.             border-radius: 100px;
  178.             overflow:hidden;
  179.             background-color:{color:Sidebar Img Border};
  180.                     -webkit-transform: rotateY(180deg);opacity: 0;
  181.             -webkit-transition-duration: .7s;
  182.             -moz-transition-duration: .7s;
  183.             -ms-transition-duration: .7s;
  184.             -o-transition-duration: .7s;  
  185.             transition-duration: .7s;
  186.                     }
  187.             .links{
  188.             height:110px;
  189.             border-radius: 120px;
  190.             padding-top:10px;
  191.             margin:5px;
  192.             overflow:hidden;
  193.             text-align:center;
  194.             color:{color:Sidebar Link};
  195.             background-color:{color:Sidebar Link Background};
  196.             }
  197.             .links a{
  198.             color:{color:Sidebar Link};
  199.             margin:1px;
  200.             display:block;
  201.             font: normal 10px consolas;
  202.             text-transform: uppercase;
  203.             letter-spacing: 1px;
  204.             text-decoration:none;
  205.             }
  206.             .links a:hover{
  207.             color:{color:Sidebar Link Hover};
  208.             }
  209.            
  210.             .tags{
  211.             margin-top:3px;margin-left:-3px;
  212.             padding-top:3px; padding-left:3px;
  213.             border-top: 3px solid {color:Permalink Accent};
  214.             font:normal 9px trebuchet ms;
  215.             text-transform:none;}
  216.             .permalink{
  217.             border-left: 3px solid {color:Permalink Accent};
  218.             display:block;
  219.             max-width:150px;
  220.             font:normal 9px consolas;
  221.             color:{color:Posted And With};
  222.             text-align:left;
  223.             padding-left:3px;
  224.             text-transform: UPPERCASE;
  225.             text-overflow: ellipsis;
  226.             position:absolute;
  227.             margin-left:510px;
  228.             {block:Indexpage}
  229.             opacity: 0;
  230.             {block:Indexpage}{block:Permalinkpage}
  231.             opacity: 1;
  232.             {block:Permalinkpage}
  233.             -webkit-transition-duration: .6s;
  234.             -moz-transition-duration: .6s;
  235.             -ms-transition-duration: .6s;
  236.             -o-transition-duration: .6s;  
  237.             transition-duration: .6s;
  238.             }.permalink a{
  239.             color:{color:PermaLink};
  240.             text-decoration:none;
  241.             }#entry:hover .permalink{
  242.             opacity: 1;   }
  243.            
  244.             ol.notes {
  245.             float:left;
  246.             margin-left:-40px;
  247.             width:510px;
  248.             text-align:left;
  249.             list-style-type: none;
  250.             }
  251.             ol.notes li.note {
  252.             background-color:{color:post};
  253.             padding: 5px;
  254.             margin-bottom:1px;
  255.             text-align:left;
  256.             }
  257.             ol.notes li.note img.avatar {
  258.             vertical-align: -4px;
  259.             margin-right: 10px;
  260.             width: 16px;
  261.             height: 16px;
  262.             }
  263.             ol.notes li.note span.action {
  264.             font-weight: normal;
  265.             }
  266.             ol.notes li.note .answer_content {
  267.             font-weight: normal;
  268.             }
  269.            
  270.             .pagination{
  271.             color:{color:Pagination};
  272.             text-align: center;
  273.             word-spacing: 1px;
  274.             font:normal 10px consolas;
  275.             text-transform: uppercase;
  276.             }.pagination a{color:{color:Pagination};}
  277.            
  278.             .footer{
  279.             background-color:none;
  280.             width:500px;
  281.             padding:2px 6px 2px 6px;
  282.             border-bottom:{color:Post} solid 2px;
  283.             margin-bottom:10px;
  284.             font:normal 11px 'Open Sans Condensed';
  285.             text-transform: uppercase;
  286.             letter-spacing:1px;
  287.             text-align: center;
  288.             color:{color:Bold Font};
  289.             }.footer a{text-decoration:none;}
  290.            .question{
  291.             background: {color:Ask Background};
  292.             font-size: 10px;
  293.             font-weight:bold;
  294.             color: {color:Asker Font};
  295.             padding: 10px;
  296.             } .ask{
  297.             color: {color:Ask Background};
  298.             text-align: center;
  299.             font-size:25px;
  300.             margin-top:-15px;
  301.             } .asker{
  302.             text-transform: uppercase;
  303.             text-align: center;
  304.             margin-top:-5px;
  305.             padding-bottom:0px;
  306.             } .answer{
  307.             margin-top:-5px;
  308.             }
  309.            
  310.             ul { list-style-type: square;}
  311.             .chat .line{
  312.             background-color: {color:Chat Even};
  313.             margin: 0 0 1px;
  314.             padding: 2px;
  315.             }
  316.             .chat .line.odd{
  317.             background-color: {color:Chat Odd};
  318.             }
  319.            
  320.             blockquote{
  321.             border-left: 2px solid {color:Block Quote Border};
  322.             padding-left:5px;
  323.             } b{color:{color:Bold Font};}
  324.             .quote{
  325.             font: normal 19px 'Open Sans Condensed', georgia;
  326.             color: {color:Quote};
  327.             font-style:italic;
  328.             } .comma{
  329.             font: normal 40px georgia;
  330.             color: {color:Comma};
  331.             font-style:bold;
  332.             text-shadow: {color:Comma Shadow} -0.1em -0.1em 0.3em;
  333.             margin-top:0px; margin-left:-15px;
  334.             line-height:5px;
  335.             }
  336.             .albumart{
  337.             width:110px; height:110px;
  338.             background-image:url('http://static.tumblr.com/ilt7cxl/KmTm3qfpa/audio.png');
  339.             position:relative;
  340.             z-index:1;
  341.             } .albumart img{width:110px; }
  342.             .audio_back{background-color:#e4e4e4;
  343.             width:48px;height:48px;
  344.             position:relative;
  345.             margin-top:-38px; margin-left:30px;
  346.             opacity: .6; z-index:2;
  347.             } .audio{
  348.             width:28px; height:28px;
  349.             overflow:hidden;
  350.             position:relative;
  351.             margin-top:-70px; margin-left:40px;
  352.             z-index:3;
  353.             } .audio_wrap{
  354.             width:110; height:110;
  355.             float:left;
  356.             } .audio_info{
  357.             float:right;
  358.             text-align:left;
  359.             width:385px;
  360.             }
  361.         </style>
  362.        
  363.     </head>
  364.  
  365.     <body>
  366.     <div id="content">
  367.    
  368.         <div id="side">
  369.                
  370.  
  371.         <div class="container leftside">
  372.                 <div class="card">
  373.                         <div class="face front">
  374.                                  <div id="portrait">
  375.                 {block:ifSidebarImage}
  376.                 <img src="{image:Sidebar}" width="120px" height="120px" style="border-radius: 100px;"/>
  377.                 {/block:ifSidebarImage}
  378.                 {block:ifnotSidebarImage}
  379.                 <img src="{PortraitURL-128}" width="120px" height="120px" style="border-radius: 100px;"/>
  380.                 {/block:ifnotSidebarImage}
  381.                  </div>
  382.                         </div>
  383.                         <div class="face back">
  384.                          
  385.                <div class="links"><br>
  386.                 <a href="/">Home</a>
  387.                 <a href="/ask">Ask</a>
  388.                 <a href="/archive">Archive</a>
  389.                 {block:IfExtraLinkOneTitle}
  390.                 <a href="{text:Extra Link One Url}">
  391.                 {text:Extra Link One Title}</a>
  392.                 {/block:IfExtraLinkOneTitle}
  393.                 {block:IfExtraLinkTwoTitle}
  394.                 <a href="{text:Extra Link Two Url}">
  395.                 {text:Extra Link Two Title}</a>
  396.                 {/block:IfExtraLinkTwoTitle}
  397.                 <big> ◈</big>
  398.             </div>     
  399.  
  400.  
  401.                         </div></div></div>
  402.          
  403.                  <div class="info">
  404.                 {block:Description}
  405.                 <div class="description">
  406.                     <center>{Description}</center>
  407.                    
  408.                         </div>
  409.                 {/block:Description}
  410.             </div>
  411.            
  412.            {block:Pagination}
  413.             <div class="pagination">
  414.                 {block:PreviousPage}
  415.                 <a href="{PreviousPage}">~</a>
  416.                 {/block:PreviousPage}
  417.                 {CurrentPage}/{TotalPages}
  418.                 {block:NextPage}
  419.                 <a href="{NextPage}">~</a>
  420.                 {/block:NextPage}
  421.             </div>
  422.             {/block:Pagination}
  423.            
  424.         </div><!-- id.side !-->
  425.         <div id="posts">
  426.            
  427.             {block:Posts}
  428.             <div id="entry">
  429.                
  430.                 {block:Date}<div class="permalink">
  431.             Posted: {block:PermalinkPage}<a href="{Permalink}">{TimeAgo}</a> <br>on: {/block:PermalinkPage}
  432.             <a href="{Permalink}"> {ShortMonth} {DayOfMonth}, {ShortYear}</a>{block:NoteCount}<br>
  433.             With:<a href="{Permalink}"> {NoteCountWithLabel}</a>{/block:NoteCount}{block:RebloggedFrom} <br>via:<a href="{ReblogParentURL}">{ReblogParentName}</a>
  434.  
  435. {block:Permalink}{block:ContentSource}
  436. origin: <a href="{SourceURL}">{SourceLink}</a>{/block:ContentSource}{/block:Permalink}
  437. {/block:RebloggedFrom} {block:ifShowTAgs}{block:HasTags}<div class="tags">{block:Tags}
  438. #<a href="{TagURL}">{Tag}</a>
  439. {/block:Tags}</div>{/block:HasTags}{/block:ifShowTags}
  440.             </div>
  441.             {/block:Date}
  442.                
  443.                 {block:Text}
  444.                 {block:Title}
  445.                 <h2>{Title}</h2>
  446.                 {/block:Title}
  447.                 {Body}
  448.                 {/block:Text}
  449.                
  450.                 {block:Photo}<center>
  451.                 <a href="{LinkURL}"><img src="{PhotoURL-500}" alt="{PhotoAlt}"/></a>
  452.                 </center>
  453.                 {block:ifnotHidePostCaptions}{block:Caption}
  454.                 {Caption}
  455.                 {/block:Caption}{/block:ifnotHidePostCaptions}
  456.  
  457.                 {block:ifHidePostCaptions}{block:PermalinkPage}
  458.                 {block:Caption}{Caption}{/block:Caption}
  459.                 {/block:PermalinkPage}{/block:ifHidePostCaptions}
  460.                 {/block:Photo}
  461.                
  462.                 {block:Photoset}
  463.                 <a href="{LinkURL}">{Photoset-500}</a>
  464.                 {block:ifnotHidePostCaptions}{block:Caption}
  465.                 {Caption}
  466.                 {/block:Caption}{/block:ifnotHidePostCaptions}
  467.  
  468.                 {block:ifHidePostCaptions}{block:PermalinkPage}
  469.                 {block:Caption}{Caption}{/block:Caption}
  470.                 {/block:PermalinkPage}{/block:ifHidePostCaptions}
  471.                 {/block:Photoset}
  472.                
  473.                 {block:Quote}<div class="comma">❝</div>
  474.                 <div class="quote">{Quote}</div>
  475.                 {block:Source}
  476.                 <div class="source">-{Source}</div>
  477.                 {/block:Source}
  478.                 {/block:Quote}
  479.                
  480.                 {block:Answer}
  481.                 <div class="question">{question}</div>
  482.                 <div class="ask">◥</div>
  483.                 <div class="asker">{asker} </div>
  484.                 <div class="answer">{answer} </div>
  485.                 {/block:Answer}
  486.                
  487.                 {block:Link}
  488.                 <h2><a href="{URL}" class="link" {Target}>{Name} &rarr;</a></h2>
  489.                 {block:Description}
  490.                 {Description}
  491.                 {/block:Description}
  492.                 {/block:Link}
  493.                
  494.                 {block:Chat}
  495.                 {block:Title}<h2>{Title}</h2>
  496.                 {/block:Title}
  497.                 <div class="chat">
  498.                 {block:Lines}<div class="chat"><div class="line {Alt}">
  499.                 <div class="{Alt} user_{UserNumber}">
  500.                 {block:Label}
  501.                 <span class="label"><b>{Label}</b></span>
  502.                 {/block:Label}
  503.                 {Line}</div>
  504.                 </div></div>
  505.                 {/block:Lines}
  506.                 </div>
  507.                 {/block:Chat}
  508.                
  509.                 {block:Video}
  510.                 {Video-500}{block:ifnotHidePostCaptions}{block:Caption}
  511.                 {Caption}
  512.                 {/block:Caption}{/block:ifnotHidePostCaptions}
  513.  
  514.                 {block:ifHidePostCaptions}{block:PermalinkPage}
  515.                 {block:Caption}{Caption}{/block:Caption}
  516.                 {/block:PermalinkPage}{/block:ifHidePostCaptions}
  517.                 {/block:Video}
  518.                
  519.                 {block:Audio}<div style="min-height:110px;">
  520.                 <div class="audio_wrap">
  521.                 <div class="albumart">{block:AlbumArt}
  522.                 <img src="{AlbumArtURL}">
  523.                 {/block:AlbumArt}</div>
  524.                 <div class="audio">{AudioPlayerGrey}</div>
  525.                 <div class="audio_back"></div></div>
  526.                 <div class="audio_info">
  527.                 {block:Artist}<h3>Artist:</h3> {Artist}{/block:Artist}  
  528.                 {block:Album}<br><h3>Album:</h3>{Album}{/block:Album}
  529.                 {block:TrackName}<br><h3>Track:</h3>{TrackName}
  530.                 {/block:TrackName}
  531.                 <br><h3>Plays:</h3>{FormattedPlayCount}
  532.                 {block:ifnotHidePostCaptions}{block:Caption}
  533.                 {Caption}
  534.                 {/block:Caption}{/block:ifnotHidePostCaptions}
  535.                 {block:ifHidePostCaptions}{block:PermalinkPage}
  536.                 {block:Caption}{Caption}{/block:Caption}
  537.                 {/block:PermalinkPage}{/block:ifHidePostCaptions}
  538.                 </div></div>{/block:Audio}
  539.  
  540.             </div> <!-- id.entry !-->
  541.            
  542.        
  543.            
  544.             {/block:Posts}
  545.            
  546.             {block:PostNotes}
  547.             <ol class="notes">
  548.                 {PostNotes}
  549.             </ol>
  550.             {/block:PostNotes}
  551.             <br>
  552.            
  553.            
  554.  
  555. {block:IndexPage}<div class="footer">
  556.  
  557.          
  558.                 - THEME BY <a href="http://sonicwand.tumblr.com">ABIR</a> & POWERED BY TUMBLR -
  559. </div>
  560.  
  561.             {/block:IndexPage}
  562.            
  563.            
  564.            
  565.            
  566.             </div> <!-- id.posts !-->
  567.         </div> <!-- id.content !-->
  568.         </body>
  569.         </html>