Advertisement
thevioletmaniac

tvm theme #001

Oct 3rd, 2015
148
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 15.61 KB | None | 0 0
  1. <!--
  2.  
  3.     Theme number: #001
  4.     Creator: @thevioletmaniac
  5.     Last update: September 26, 2015
  6.     Features: Reblogs, text/photo/photoset/quote/link/chat/audio/video posts, dates, notes, tags, custom colors and images
  7.     Website: [http://thevioletmaniac.narod.ru/] or [http://tvm-resources.deviantart.com/]
  8.     Rules: Don’t remove the credit and don’t redistibute theme.
  9.    
  10. -->
  11. <head>
  12. <script type="text/javascript" src="http://codysherman.com/tools/infinite-scrolling/code" ></script>
  13. <title>{Title}</title>
  14. {block:Description}<meta name="Description" content="{MetaDescription}" />{/block:Description}
  15. <link rel="shortcut icon" href="{favicon}" />
  16.  
  17.     <meta name="image:body" content="http://puu.sh/k9QMT/bbee49b30d.png"/>
  18.     <meta name="image:sideblock" content="http://puu.sh/k9QUa/cbb8544313.png"/>
  19.     <meta name="image:nav" content="http://puu.sh/k9QUa/cbb8544313.png"/>
  20.     <meta name="image:odd" content="http://puu.sh/khDgi/204d9b7e4e.png"/>
  21.     <meta name="image:even" content="http://puu.sh/khDfj/965d59b53c.png"/>
  22.     <meta name="image:meta" content="http://puu.sh/k9QVf/b468973c52.png"/>
  23.     <meta name="color:body color" content="#000000" />
  24.     <meta name="color:tags color" content="#ffffff" />
  25.     <meta name="color:chat color" content="#171717" /> 
  26.     <meta name="color:title color" content="#ffffff" />
  27.     <meta name="color:avatar border" content="#f1f1f1" />
  28.     <meta name="color:nav color" content="#000000" />
  29.     <meta name="color:nav background" content="#ebebeb" />
  30.     <meta name="color:post background" content="#ffffff" />
  31.     <meta name="color:nav background hover" content="#ffffff" />
  32.     <meta name="color:nav background hover" content="#ffffff" />
  33.  
  34.     <style type="text/css">
  35.         body{
  36.             color: {color:body color};
  37.             padding: 0px;
  38.             margin: 0px;
  39.             line-height: 140%;
  40.             background: url('{image:body}') no-repeat center fixed;
  41.             -webkit-background-size: cover;
  42.             -moz-background-size: cover;
  43.             -o-background-size: cover;
  44.             background-size: cover;
  45.             font-family:  Tahoma;
  46.             font-size:11px;
  47.             text-align: justify;
  48.         }
  49.  
  50.         table, tr, td{
  51.             font-family:  Tahoma;
  52.             font-size: 11px;
  53.             text-align: justify;
  54.         }
  55.  
  56.         .container{
  57.             width: 640px;
  58.             margin: 0 auto;
  59.             background: none;
  60.         }
  61.  
  62.         .sidebar{
  63.             width: 200px;
  64.             background-image: url('{image:sideblock}');
  65.             background-repeat: repeat;
  66.             float: left;
  67.             position: fixed;
  68.             height: 100%;
  69.         }
  70.  
  71.         .sidebar-icon{
  72.             width: 100%;
  73.             margin: 0 auto;
  74.             text-align: center;
  75.             padding-bottom: 10px;
  76.             background: none;
  77.             padding-top: 10px;
  78.         }
  79.  
  80.         .sidebar-icon img{
  81.             border:1px solid {color:avatar border};
  82.             background: none;
  83.             -webkit-border-radius: 70px;
  84.             -moz-border-radius: 70px;
  85.             border-radius: 70px;
  86.             padding:8px;
  87.             width: 64px;
  88.             height: 64px;
  89.         }
  90.  
  91.         .sidebar-nav{
  92.             width: 100%;
  93.             margin: 0 auto;
  94.             background: none ;
  95.             padding-top: 10px;
  96.             padding-bottom: 10px;
  97.             -webkit-transition: 0.5s;
  98.             -moz-transition: 0.5s;
  99.             -o-transition: 0.5s;
  100.             transition: 0.5s;
  101.         }
  102.  
  103.         .sidebar-nav a,.sidebar-nav a:visited,.sidebar-nav a:active,.sidebar-nav a:link{
  104.             padding:5px;
  105.             margin-left: 20px;
  106.             margin-right: 20px;
  107.             margin-bottom: 3px;
  108.             display: block;
  109.             text-align: center;
  110.             line-height: 120%;
  111.             color: {color:nav color};
  112.             background: {color:nav background};
  113.             background: url('{image:nav}');
  114.             font-size:10px;
  115.             font-weight: normal;
  116.             text-decoration: none;
  117.             text-transform: lowercase;
  118.             font-style: italic;
  119.             font-family: georgia;
  120.             letter-spacing: 1px;
  121.             -webkit-transition: 0.5s;
  122.             -moz-transition: 0.5s;
  123.             -o-transition: 0.5s;
  124.             transition: 0.5s;
  125.         }
  126.            
  127.         .sidebar-nav a:hover{
  128.             color: {color:nav color};
  129.             background: {color:nav background hover};
  130.             -webkit-transition: 0.5s;
  131.             -moz-transition: 0.5s;
  132.             -o-transition: 0.5s;
  133.             transition: 0.5s;
  134.         }
  135.  
  136.         .sidebar-info{
  137.             padding-left: 20px;
  138.             padding-right: 20px;
  139.             padding-top: 10px;
  140.             padding-bottom: 10px;
  141.             background: none;
  142.         }
  143.  
  144.         .posts{
  145.             width: 400px;
  146.             background: none;
  147.             float: right;
  148.             padding-right: 20px;
  149.             padding-left: 20px;
  150.             padding-top: 20px;
  151.         }
  152.  
  153.         .post{
  154.             background: none;
  155.             margin-bottom: 40px;
  156.             color: {color:post color};
  157.         }
  158.  
  159.         .post-title{
  160.             font-size: 7pt;
  161.             font-family:  Tahoma;
  162.             font-style: italic;
  163.             text-transform:uppercase;
  164.             font-weight:normal;
  165.             background-color:none;
  166.             color: {color:title color};
  167.             text-align:right;
  168.             margin-bottom: 8px;
  169.             margin-top: 0px;
  170.             padding-right:10px;
  171.             padding-top:0px;
  172.             padding-bottom:0px;
  173.             letter-spacing:1px;
  174.             line-height: 11px;
  175.         }
  176.  
  177.         .post-title a,.post-title a:visited{
  178.             text-decoration: none;    
  179.             color: {color:title color};
  180.         }
  181.            
  182.         .post-title a:hover{
  183.             text-decoration: none;  
  184.             color: {color:title color};
  185.         }  
  186.  
  187.         .post-caption-none{
  188.             background: #fff;  
  189.             display: none;
  190.         }
  191.  
  192.         .post-caption{
  193.             width: 100%;
  194.             background: none;
  195.             padding: 0;
  196.             margin: 0;
  197.         }
  198.  
  199.         .post-caption a,.post-caption a:visited,.post-caption a:active,.post-caption a:link {
  200.             text-decoration:none;
  201.             color: {color:body color};
  202.             text-transform: normal;
  203.             -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";
  204.             filter: alpha(opacity=80);
  205.             -moz-opacity: 0.8;
  206.             -khtml-opacity: 0.8;
  207.             opacity: 0.8;
  208.         }
  209.  
  210.  
  211.         .post-caption a:hover{
  212.             color: {color:body color};
  213.             -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
  214.             filter: alpha(opacity=100);
  215.             -moz-opacity: 1.0;
  216.             -khtml-opacity: 1.0;
  217.             opacity: 1.0;
  218.         }
  219.  
  220.         .post a,.post a:visited,.post a:active,.post a:link{
  221.             text-decoration: none;
  222.             -webkit-transition: 0.5s;
  223.             -moz-transition: 0.5s;
  224.             -o-transition: 0.5s;
  225.             transition: 0.5s;
  226.         }
  227.  
  228.         .post a:hover{
  229.             -webkit-transition: 0.5s;
  230.             -moz-transition: 0.5s;
  231.             -o-transition: 0.5s;
  232.             transition: 0.5s;
  233.         }
  234.  
  235.         .post-text{
  236.             background: {color:post background};  
  237.             padding: 20px;
  238.         }
  239.  
  240.         .post-text a,.post-text a:visited,.post-text a:active,.post-text a:link{
  241.             text-decoration: none;
  242.             color: {color:body color};
  243.             -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";
  244.             filter: alpha(opacity=80);
  245.             -moz-opacity: 0.8;
  246.             -khtml-opacity: 0.8;
  247.             opacity: 0.8;
  248.         }
  249.  
  250.         .post-text a:hover{
  251.             text-decoration: none;
  252.             color: {color:body color};
  253.             -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
  254.             filter: alpha(opacity=100);
  255.             -moz-opacity: 1.0;
  256.             -khtml-opacity: 1.0;
  257.             opacity: 1.0;
  258.         }
  259.  
  260.         .post-photo{
  261.             background: none;
  262.             padding: 0;
  263.             margin: 0;
  264.             border: 0px;
  265.         }
  266.  
  267.         .post-photo img{
  268.             border: 0;
  269.             padding-bottom: 0px;
  270.             margin: 0;
  271.         }
  272.  
  273.         .post-photoset{
  274.             background: none;
  275.             margin: 0;
  276.             padding: 0;
  277.             padding-top: 0px;
  278.             padding-bottom: 0px;
  279.         }
  280.  
  281.         .post-chat{
  282.             width: 400px;    
  283.             background: none;  
  284.             padding: 0;
  285.             margin: 0;
  286.             color: {color:chat color};
  287.         }
  288.  
  289.         .post-chat ul {
  290.             list-style: none;
  291.             margin: 0;
  292.             padding: 0;
  293.         }
  294.  
  295.         .post-chat li {
  296.             border-radius: 0;
  297.             border: 0;
  298.             box-shadow: none;
  299.             margin:0 ;
  300.             padding: 0;
  301.         }
  302.  
  303.         .post-chat .odd {
  304.             background: url('{image:odd}');
  305.             background-repeat: repeat;
  306.             padding: 2px;
  307.             padding-left: 20px;
  308.         }
  309.  
  310.         .post-chat .even {
  311.             background: url('{image:even}');
  312.             background-repeat: repeat;
  313.             padding: 2px;
  314.             padding-left: 20px;
  315.         }
  316.  
  317.         .post-quote{
  318.             background: {color:post background};  
  319.             padding: 20px;
  320.             margin: 0;
  321.         }
  322.  
  323.         .quote {
  324.             line-height: 120%;
  325.             font-size:10px;
  326.             font-weight:normal;
  327.             text-decoration:none;
  328.             text-transform:lowercase;
  329.             font-style:italic;
  330.             font-family:georgia;
  331.             letter-spacing: 1px;
  332.             font-family: georgia;
  333.             color: {color:body color};
  334.             background: none;
  335.             margin:0px;
  336.         }
  337.  
  338.         .sourcesourcesourcesource a,.sourcesourcesource a:visited,.sourcesource a:active,.source a:link, .source a:hover{
  339.             text-decoration:none;
  340.             color: {color:body color};
  341.             text-transform: normal;
  342.         }
  343.  
  344.         .source {
  345.             padding:0px;
  346.         }
  347.  
  348.         .post-audio{
  349.             background: none;  
  350.             width: 100%;
  351.             padding: 0;
  352.             margin: 0;
  353.         }
  354.  
  355.         .post-audio img{
  356.             width: 100%;    
  357.         }
  358.  
  359.         .audio-player {
  360.             background: {color:post background};
  361.             position: absolute;
  362.             z-index: 1000;
  363.             width: 389px;
  364.             padding-top: 12px;
  365.             padding-bottom: 10px;
  366.             -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=70)";
  367.             filter: alpha(opacity=70);
  368.             -moz-opacity: 0.7;
  369.             -khtml-opacity: 0.7;
  370.             opacity: 0.7;
  371.             padding-left: 11px;
  372.         }
  373.  
  374.         .post-video{
  375.             background: none;  
  376.             width: 100%;
  377.             padding: 0;
  378.             margin: 0;
  379.         }
  380.  
  381.         .meta{
  382.             background: {color:post background};
  383.             background: url('{image:meta}');
  384.             background-repeat: repeat;
  385.             color: {color:body color};
  386.             padding: 15px;
  387.             font-family:  Tahoma;
  388.             font-size: 8px;
  389.             letter-spacing: 0.8px;
  390.             text-transform: uppercase;
  391.         }
  392.  
  393.         .meta a,.meta a:visited{
  394.             color: {color:body color};
  395.             text-decoration:none;
  396.         }
  397.            
  398.         .meta a:hover{
  399.             text-decoration:none;
  400.         }
  401.  
  402.         .post-triangle{
  403.             width: 100%;
  404.             background: none;
  405.             padding-top: 15px;
  406.         }
  407.  
  408.         .triangle{
  409.             width: 0;
  410.             height: 0;
  411.             border-style: solid;
  412.             border-width: 0 10px 10px 10px;
  413.             border-color: transparent transparent {color:post background} transparent;
  414.             margin-left: 20px;
  415.             -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=60)";
  416.             filter: alpha(opacity=60);
  417.             -moz-opacity: 0.6;
  418.             -khtml-opacity: 0.6;
  419.             opacity: 0.6;
  420.         }
  421.  
  422.         .tags{
  423.             background: none;
  424.             padding: 0px;
  425.             text-align: right;
  426.             font-family:  Tahoma;
  427.             font-size: 8px;
  428.             letter-spacing: 0.8px;
  429.             text-transform: uppercase;
  430.             color: {color:tags color};
  431.         }
  432.  
  433.         .tags a,.tags a:visited{
  434.             color: {color:tags color};
  435.             -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=40)";
  436.             filter: alpha(opacity=40);
  437.             -moz-opacity: 0.4;
  438.             -khtml-opacity: 0.4;
  439.             opacity: 0.4;
  440.             text-decoration:none;
  441.             -webkit-transition: 0.5s;
  442.             -moz-transition: 0.5s;
  443.             -o-transition: 0.5s;
  444.             transition: 0.5s;
  445.         }
  446.            
  447.         .tags a:hover{
  448.             text-decoration:none;
  449.             color: {color:tags color};
  450.             -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=60)";
  451.             filter: alpha(opacity=60);
  452.             -moz-opacity: 0.6;
  453.             -khtml-opacity: 0.6;
  454.             opacity: 0.6;
  455.             -webkit-transition: 0.5s;
  456.             -moz-transition: 0.5s;
  457.             -o-transition: 0.5s;
  458.             transition: 0.5s;
  459.         }
  460.  
  461.         .post-notes{
  462.             width: 100%;
  463.             padding-top:20px;
  464.             margin: 1px;
  465.             text-transform: uppercase;
  466.             color: {color:body color};
  467.             font-size: 8px;
  468.             letter-spacing: 0.8px;
  469.         }
  470.  
  471.         .post-notes ol.notes {
  472.             list-style-type: none;
  473.             margin: 0px;
  474.             padding: 5px;
  475.             background: none;
  476.             text-align: left;
  477.             color: {color:body color};
  478.             background: none;
  479.             text-transform: uppercase;
  480.             font-size: 8px;
  481.             letter-spacing: 0.8px;
  482.         }
  483.  
  484.         .post-notes ol.notes li.note img.avatar {
  485.             border:1px solid {color:avatar border};
  486.             margin-bottom:5px;
  487.             vertical-align: -15px;
  488.             margin-left:5px;
  489.             margin-right:10px;
  490.             -webkit-border-radius: 20px;
  491.             -moz-border-radius: 20px;
  492.             border-radius: 20px;
  493.             padding:5px;
  494.             width: 16px;
  495.             height: 16px;
  496.         }
  497.  
  498.         .post-notes a,.post-notes a:visited,.post-notes a:active,.post-notes a:link {
  499.             text-decoration:none;
  500.             color: {color:body color};
  501.             text-transform: normal;
  502.             -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";
  503.             filter: alpha(opacity=80);
  504.             -moz-opacity: 0.8;
  505.             -khtml-opacity: 0.8;
  506.             opacity: 0.8;
  507.         }
  508.  
  509.         .post-notes a:hover{
  510.             color: {color:body color};
  511.             -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
  512.             filter: alpha(opacity=100);
  513.             -moz-opacity: 1.0;
  514.             -khtml-opacity: 1.0;
  515.             opacity: 1.0;
  516.         }
  517.  
  518.         .caption{
  519.             padding-left: 20px;
  520.             padding-right: 20px;
  521.             margin-top: 10px;
  522.             padding-bottom: 5px;
  523.             padding-top: 5px;
  524.             font-family:georgia;
  525.             color: {color:body color};
  526.             font-style: italic;
  527.         }
  528.  
  529.         .clear{
  530.             clear: both;
  531.         }
  532.     </style>
  533. </head>
  534. <body>
  535. <div class="container">
  536.     <div class="sidebar">
  537.         <table width="100%" height="100%" cellpadding="0" cellspacing="0">
  538.             <tr>
  539.                 <td align="center" valign="middle">
  540.                     <div class="sidebar-icon"><a href="/"><img src="{PortraitURL-64}" border="0" alt="{Title}"></a></div>        
  541.                     <div class="sidebar-nav">
  542.                         <a href="/">index</a>
  543.                         <a href="/archive"  target="main">archive</a>
  544.                         <a href="http://thevioletmaniac.narod.ru/" target="main">theme</a>
  545.                     </div>             
  546.                     {block:Description}
  547.                     <div class="sidebar-info">
  548.                         {Description}
  549.                     </div>
  550.                     {/block:Description}
  551.                 </td>
  552.             </tr>
  553.         </table>
  554.     </div>
  555.  
  556.     <div class="posts">
  557.     {block:Posts}
  558.         <div class="post">
  559.             {block:Title}<div class="post-title"><a href="{Permalink}">{Title}</a></div>{/block:Title}
  560.             {block:Text}
  561.             <div class="post-text">
  562.                 {Body}
  563.             {/block:Text}
  564.  
  565.             {block:Photo}
  566.             <div class="post-photo">
  567.                 {LinkOpenTag}<img src="{PhotoURL-400}" width ="{PhotoWidth-400}" alt="{PhotoAlt}" />{LinkCloseTag}
  568.                 <div class="post-caption">{block:Caption}<div class="caption">{Caption}</div>{/block:Caption}</div>
  569.             {/block:Photo}
  570.  
  571.             {block:Photoset}
  572.             <div class="post-photoset">
  573.                 {Photoset-400}
  574.                 <div class="post-caption">{block:Caption}<div class="caption">{Caption}</div>{/block:Caption}</div>
  575.             {/block:Photoset}
  576.  
  577.             {block:Quote}
  578.             <div class="post-quote">
  579.                 <blockquote><div class="quote">"{Quote}"</div></blockquote>
  580.                 {block:Source}<div class="source">{Source}</div>{/block:Source}
  581.             {/block:Quote}
  582.  
  583.             {block:Link}
  584.             <div class="post-link">
  585.                 <h1 class="title"><a href="{URL}">{Name}</a></h1>
  586.                 {block:Description}{Description}{/block:Description}
  587.             {/block:Link}
  588.  
  589.             {block:Chat}
  590.             <div class="post-chat">
  591.                 <ul>
  592.                     {block:Lines}<li class="{Alt}"><p>{block:Label}<strong>{Label}</strong>{/block:Label} {Line} </p></li>{/block:Lines}
  593.                 </ul>
  594.             {/block:Chat}
  595.             <div class="clear"></div>
  596.  
  597.             {block:Audio}
  598.                 <div class="post-audio">
  599.                 <div class="audio-player">{block:AudioPlayer}{AudioPlayerWhite}{/block:AudioPlayer}</div>
  600.                 {block:AlbumArt}
  601.                 <img src="{AlbumArtURL}" class="cover">
  602.                 {/block:AlbumArt}
  603.                 <div class="post-caption">{block:Caption}<div class="caption">{Caption}</div>{/block:Caption}</div>
  604.             {/block:Audio}
  605.  
  606.             {block:Video}
  607.                 <div class="post-video">
  608.                 {Video-400}
  609.                 <div class="post-caption">{block:Caption}<div class="caption">{Caption}</div>{/block:Caption}</div>
  610.             {/block:Video}
  611.  
  612.             {block:Answer}
  613.                 <div class="post-answer">
  614.                 <h1 class="title">{Question}</h1>
  615.                 <div class="user"><img src="{AskerPortraitURL-96}"/><p>{Asker}</p></div>
  616.                 {Answer}
  617.             {/block:Answer}
  618.             </div>
  619.            
  620.             <div class="post-triangle">
  621.                 <div class="triangle"></div>
  622.             </div>
  623.            
  624.             <div class="meta">
  625.                 {block:Date}<a href="{Permalink}">Posted {TimeAgo}</a> {/block:Date}
  626.                 {block:NoteCount}<a href="{Permalink}">with {NoteCount} notes</a>{/block:NoteCount}
  627.                 {block:RebloggedFrom} <a href="{ReblogParentURL}">via {ReblogParentName}</a> {/block:RebloggedFrom}
  628.                 {block:ContentSource} <a href="{SourceURL}">source {SourceTitle}</a>{/block:ContentSource}
  629.             </div>
  630.            
  631.             {block:HasTags}
  632.                 <div class="tags">
  633.                     {block:Tags}<a href="{TagURL}">#{Tag}</a> {/block:Tags}
  634.                 </div>
  635.             {/block:HasTags}
  636.            
  637.             {block:PostNotes}
  638.                 <div class="post-notes">{PostNotes}</div>
  639.             {/block:PostNotes}
  640.          </div>
  641.     {/block:Posts}         
  642.         </div>
  643.     </div> 
  644.     <div class="clear"></div>
  645. </div>
  646. </body>
  647. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement