Advertisement
Korubaka

Monochrome Tumblr Theme

Mar 8th, 2013
483
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 14.12 KB | None | 0 0
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2.  
  3. <!-- Base Code made by Amelie @ Ziaem // No need to credit
  4.  
  5. >!!Please leave the credits here!!<
  6.  
  7. "Sweet Themez" Monochrome theme modifications made by Korubaka -->
  8.  
  9.  
  10.  
  11. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  12.  
  13.  
  14. <head>
  15. <script type="text/javascript" src="http://codysherman.com/tools/infinite-scrolling/code"></script>
  16.  
  17.  
  18.  
  19.      <meta name="color:Background" content="#ffebeb">
  20.     <meta name="color:Links" content="#bf7979">
  21.     <meta name="color:Links Hover" content="#a62f35">
  22.     <meta name="color:text" content="#d18383">
  23.     <meta name="color:tags" content="#a2a39e">
  24.     <meta name="color:scrollbar" content="#bf7979">
  25.     <meta name="color:Border" content="#a62f35">
  26.     <meta name="color:Sidebar Text" content="#bf8285">
  27.     <meta name="color:Description box" content="#ffffff">
  28.     <meta name="color:Post container" content="#faf8f8">
  29.     <meta name="color:Posts BG" content="#ffffff">
  30.     <meta name="color:Links BG" content="#ffffff">
  31.     <meta name="color:Links border hover" content="#f37d82">
  32.     <meta name="color:Tags Hover" content="#bf8285">
  33.     <meta name="color:Scrollbar BG" content="#ffffff">
  34.     <meta name="color:Visited Link" content="#a62f35">
  35.    
  36.     <meta name="image:Sidebar Image" content=""/>
  37.     <meta name="image:Background Image" content=""/>
  38.  
  39.     <meta name="text:link1" content="">
  40.     <meta name="text:link1 url" content="/">
  41.     <meta name="text:link2" content="">
  42.     <meta name="text:link2 url" content="/">
  43.     <meta name="text:link3" content="">
  44.     <meta name="text:link3 url" content="/">
  45.  
  46.     <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  47.     <title>{Title}</title> {block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}
  48.     <link rel="shortcut icon" href="{Favicon}" />
  49.     <link rel="alternate" type="application/rss+xml" href="{RSS}" />
  50.  
  51.     <style type="text/css">
  52.  
  53.  
  54.     a {
  55.     color:{color:Link};
  56.     text-decoration:none;
  57.    transition: opacity .40s ease-in-out;
  58.    -moz-transition: opacity .40s ease-in-out;
  59.    -webkit-transition: opacity .40s ease-in-out;
  60.     }
  61.    
  62.     a:hover {
  63.     color:{color:Links Hover};
  64.     text-decoration:none;
  65.    
  66.     }
  67.    
  68.     a:visited{
  69.         color:{color:Visited link};
  70.         }
  71.    
  72.      img
  73.     {
  74.     opacity:0.7;
  75.     filter:alpha(opacity=40);
  76.     transition: opacity .40s ease-in-out;
  77.    -moz-transition: opacity .40s ease-in-out;
  78.    -webkit-transition: opacity .40s ease-in-out;
  79.    max-width:500px;
  80.     }
  81.     img:hover
  82.     {
  83.     opacity:1.0;
  84.     filter:alpha(opacity=100);
  85.     }
  86.    
  87.     .sidebar_image
  88.     {
  89.         opacity:0.8;
  90.         margin-top: 20px;
  91.         filter:alpha(opacity=40);
  92.         transition: opacity .40s ease-in-out;
  93.        -moz-transition: opacity .40s ease-in-out;
  94.        -webkit-transition: opacity .40s ease-in-out;
  95.     }
  96.    
  97.     .sidebar_image:hover
  98.     {
  99.         opacity:1.0;
  100.     }
  101.  
  102.    
  103. ::-webkit-scrollbar {background-color:{color:Scrollbar BG}; height:8px; width:8px}
  104. ::-webkit-scrollbar-thumb:vertical {background-color:{color:scrollbar}; height:50px}
  105. ::-webkit-scrollbar-thumb:horizontal {background-color:{color:scrollbar}; height:8px!important}
  106.  
  107. body {
  108. background-color:{color:Background};
  109. font-family:Cambria;
  110. font-weight:normal;
  111. }
  112.  
  113. #Background-border
  114. {
  115.     border-top: 10px solid {color:Border};
  116. }
  117.  
  118.  
  119. h1 {
  120. font-weight:normal;
  121. font-size:11px;
  122. text-align:center;
  123. font-style:italic;
  124. line-height:50%;
  125. letter-spacing:1px;
  126. text-transform:lowercase;
  127. color:{color:text};
  128. }
  129.  
  130. h2 {
  131. font-size:10px;
  132. text-align:center;
  133. line-height:100%;
  134. letter-spacing:-0.5px;
  135. color:{color:text};
  136. font-weight:bold;
  137. text-transform:uppercase;
  138. padding:5px;
  139. padding-bottom:2px;
  140. }
  141.  
  142.  
  143. blockquote {
  144. border-left:2px solid {color:text};
  145. padding-left:5px;
  146. margin:5px;
  147. }
  148.    
  149.     #themenum {
  150.     background-color:{color:bg};
  151.     width:700px;
  152.     margin: 0 auto -12px auto;
  153.     text-align: center;
  154.     }
  155.    
  156.     #sidebar {
  157.     color:{color:text};
  158.     position:fixed;
  159.     width:150px;
  160.     height:150px;
  161.     margin-top:210px;
  162.     margin-left:-120px;
  163.     text-align:left;
  164.     }
  165.    
  166.     #sidebar img {
  167.     background: url('{image:Sidebar Image}');
  168.     width:150px;
  169.     height:150px;
  170.     margin-bottom:10px;
  171.     outline:4px solid #f5f5f5;
  172.     }
  173.  
  174.  
  175.    
  176.     .slinks {
  177.     color:{color:Links};
  178.     margin-bottom:10px;
  179.     margin-top:-5px;
  180.     font-size:8px;
  181.     text-transform:uppercase;
  182.     text-align:center;
  183.     letter-spacing:2px;
  184.     line-height:190%;
  185.     background:{color:Links BG};
  186.     }
  187.    
  188.     .slinks a{
  189.     padding:2px;
  190.     margin:2px;
  191.     color:{color:Links};
  192.     letter-spacing:0px;
  193.       -o-transition:.5s;
  194.       -ms-transition:.5s;
  195.       -moz-transition:.5s;
  196.       -webkit-transition:.5s;
  197.       transition:.5s;
  198.     }
  199.    
  200.     .slinks a:hover{
  201.     color:{color:Links Hover};
  202.     border-left:4px solid {color:Links border hover};
  203.     filter:alpha(opacity=100);
  204.     }
  205.    
  206.     .slinks-posts a{
  207.     padding:2px;
  208.     margin:2px;
  209.     color:{color:Links};
  210.     letter-spacing:0px;
  211.       -o-transition:.5s;
  212.       -ms-transition:.5s;
  213.       -moz-transition:.5s;
  214.       -webkit-transition:.5s;
  215.       transition:.5s;
  216.     }
  217.    
  218.      .slinks-posts a:hover{
  219.     color:{color:Links Hover};
  220.     filter:alpha(opacity=100);
  221.     }
  222.    
  223.     .description {
  224.     margin-bottom:15px;
  225.     margin-top:-7px;
  226.     text-align:center;
  227.     font-size:9px;
  228.     color:{color:Sidebar Text};
  229.     letter-spacing:1px;
  230.     line-height:105%;
  231.     }
  232.    
  233.     .description a {
  234.     color:{color:link};
  235.     }
  236.    
  237.     .description a:hover {
  238.         color:#f1f1f1;
  239.     }
  240.  
  241.     .pagination {
  242.     font-size:8px;
  243.     text-transform:uppercase;
  244.     letter-spacing:3px;
  245.     font-style:normal;
  246.     text-align:center;
  247.     }
  248.    
  249.     .pagination a {
  250.     color:{color:link};
  251.     }
  252.    
  253.     #postcontainer {
  254.     float:left;
  255.     margin-left:200px;
  256.     margin-top:0px;
  257.     margin-bottom:0px;
  258.     text-align:justify;
  259.     background-color:{color:Post container};
  260.     color:{color:text};
  261.     }
  262.  
  263.  
  264.     #posts {
  265.     word-wrap: break-word;
  266.     padding:5px;
  267.     width:500px;
  268.     margin-top:75px;
  269.     text-align:left;
  270.     font-size:11px;
  271.     line-height:90%;
  272.     letter-spacing:0x;
  273.     color:{color:text};
  274.     background-color:{color:Posts BG};
  275.     outline:2px solid #f5f5f5;
  276.     }
  277.  
  278.    
  279.  
  280.     #info {
  281.         font-family:consolas;
  282.     width:490px;
  283.     margin-top:3px;
  284.     padding:2px;
  285.     padding-left:8px;
  286.     font-size:8px;
  287.     color:{color:link};
  288.     text-transform:uppercase;
  289.     font-style:normal;
  290.     letter-spacing:2px;
  291.     text-align:right;
  292.     border-bottom:1px solid #f5f5f5;
  293.     -moz-transition-duration:0.5s;
  294.     -webkit-transition-duration:0.5s;
  295.     -o-transition-duration:0.5s;
  296.     }
  297.  
  298.     #info a {
  299.     color:{color:link};
  300.     text-align:right;
  301.     letter-spacing:1px;
  302.     font-style:normal;
  303.     }
  304.    
  305.     #info a:hover {
  306.     color:{color:hover};
  307.     }
  308.    
  309.      .caption {
  310.     width:500px;
  311.     text-align:justify;
  312.     line-height:120%;
  313.     }
  314.    
  315.     .question {
  316.     padding:10px;
  317.     text-align:left;
  318.     color:{color:text};
  319.     background-color:{color:infobg};
  320.     border-bottom:1px solid {color:text};
  321.     }
  322.    
  323.     .answer {
  324.     text-align:left;
  325.     padding:10px;
  326.     color:{color:text};
  327.     }
  328.  
  329.     .music {
  330.     width:500px;
  331.     padding-bottom:10px;
  332.     background-color:{color:infobg};
  333.     }
  334.    
  335.     .albumart {
  336.     float:left;
  337.     padding:0px 10px 10px 0px;
  338.     }
  339.    
  340.     .albumart img {
  341.     width:45px;
  342.     height:45px;
  343.     }
  344.    
  345.     .playercontainer {
  346.     text-align:left;
  347.     padding:10px;
  348.     background-color:#ffffff;
  349.     width:480px;
  350.     }
  351.    
  352.     .musicinfo {
  353.     padding:10px;
  354.     color:{color:text};
  355.     }
  356.    
  357.     .postnote {
  358.     text-transform:uppercase;
  359.     font-style:normal;
  360.     letter-spacing:0px;
  361.     font-size: 9px;
  362.     text-align:left;
  363.     line-height:90%;
  364.     margin-left:-40px;
  365.     }
  366.    
  367.     .postnote li {
  368.     list-style-type:none;
  369.     border-bottom:1px solid {color:border};
  370.     padding:10px 25px 10px 25px;
  371.     text-align:left;
  372.     margin:0px;
  373.     -moz-transition-duration:0.5s;
  374.     -webkit-transition-duration:0.5s;
  375.     -o-transition-duration:0.5s;
  376.     }
  377.        
  378.     .tags {
  379.     font-family:consolas;
  380.     font-style:normal;
  381.     width:500px;
  382.     text-transform:uppercase;
  383.     font-style:normal;
  384.     color:{color:tags};
  385.     letter-spacing:2px;
  386.     line-height:120%;
  387.     font-size:8px;
  388.     text-align:right;
  389.     padding:2px;
  390.     -moz-transition-duration:0.5s;
  391.     -webkit-transition-duration:0.5s;
  392.     -o-transition-duration:0.5s;
  393.     }
  394.    
  395.     .tags a {
  396.     color:{color:text};
  397.     letter-spacing:1px;
  398.     padding:1px;
  399.     }
  400.    
  401.     .tags a:hover {
  402.     color:{color:Tags Hover};
  403.     }
  404.    
  405.     ul.chat, .chat ol, .chat li {
  406.     list-style:none;
  407.     margin:0px;
  408.     padding:2px;
  409.     }
  410.    
  411.     .tab {
  412.     text-decoration:underline;
  413.     font-weight:700;
  414.     background-color:{color:bg};
  415.     margin-right:5px;
  416.     }
  417.    
  418.     #credit {
  419.     position:fixed;
  420.     font-size:8px;
  421.     font-weight:normal;
  422.     line-height:150%;
  423.     letter-spacing:2px;
  424.     right:10px;
  425.     bottom:10px;
  426.     text-transform:uppercase;
  427.     text-align:center;
  428.     }
  429.  
  430.     #credit a {
  431.     padding:3px;
  432.     color:{color:text};
  433.     -moz-transition-duration:0.5s;
  434.     -webkit-transition-duration:0.5s;
  435.     -o-transition-duration:0.5s;
  436.     }
  437.  
  438.     {CustomCSS}
  439.  
  440.     </style></head>
  441.  
  442. <body>
  443. <div style="background: url('{image:Background Image}');  height:300px; width:auto; position:fixed; bottom:0; right:0; left:0; top:50; z-index:-1;" id="Background-border"></div>
  444.  
  445. <div id="themenum">
  446.  
  447. <div id="sidebar" style="margin-top:180px;">
  448.  
  449.  <div class="slinks" style="width:225px; height:14px; border: 4px solid {color:Border}; border-top-right-radius:10px; border-top-left-radius:10px;">
  450.                 <a href="/">home</a>
  451.                 <a href="/archive">archive</a>
  452.                 <a href="/ask">ask</a>
  453.         <a href="http://sweetthemez.tumblr.com/">theme</a>
  454.             </div>
  455.  
  456. <div class="description" style="background-color:{color:Description box}; width:225px; height:auto; border:4px solid {color:Border};">
  457.  
  458. <center><img src="{image:sidebar}" class="sidebar_image" style="
  459.        max-width:150px; max-height:150px;"></center>
  460.  
  461.     {Title}
  462.  
  463. <br>
  464. <br>
  465.     {Description}
  466. <br>
  467. <br>
  468. <br>
  469.    
  470. <center><div style="width:100px; text-align:center; font-weight:bold; padding:5px;">
  471.     {block:Pagination}
  472.     <div class="pagination">
  473.     {block:PreviousPage}
  474.     <a href="{PreviousPage}"style="color:{color:Links};">«</a>
  475.     {/block:PreviousPage}
  476.     {block:JumpPagination length="3"}
  477.     {block:CurrentPage}
  478.     <span class="current_page" style="color:{color:Links};">{PageNumber}</span>
  479.     {/block:CurrentPage}
  480.     {block:JumpPage}
  481.     <a class="jump_page" href="{URL}" style="color:{color:Links};">{PageNumber}</a>
  482.     {/block:JumpPage}
  483.     {/block:JumpPagination}
  484.     {block:NextPage}
  485.     <a href="{NextPage}"style="color:{color:Links};"></a>
  486.     {/block:NextPage}
  487.     </div>
  488.     {/block:Pagination}
  489.     </div>
  490. </div></center>
  491.  
  492.  
  493. <div class="slinks" style="width:225px; height:14px; border: 4px solid {color:Border}; border-bottom-right-radius:10px; border-bottom-left-radius:10px; margin-top:-12px;">
  494.     {block:IfLink1}
  495.     <a href="{text:link1 url}">{text:link1}</a>
  496.     {/block:IfLink1}
  497.     {block:IfLink2}
  498.     <a href="{text:link2 url}">{text:link2}</a>
  499.     {/block:IfLink2}
  500.     {block:IfLink3}
  501.     <a href="{text:link3 url}">{text:link3}</a>
  502.     {/block:IfLink3}
  503. </div>
  504.  
  505. </div>
  506.  
  507.  
  508.  
  509.  
  510. <div id="postcontainer" style="width: 550px; height:100%; margin-left:140px; border-right: 4px solid {color:Border}; border-left: 4px solid {color:Border}; position:relative;" class="slinks-posts">
  511.  
  512.     {block:Posts}
  513.    
  514. <div id="posts" style="margin:20px;">
  515.  
  516.    
  517.     {block:Text}
  518.     {block:Title}
  519.     <h2>{Title}</h2>
  520.     {/block:Title}
  521.     {Body}
  522.     {/block:Text}
  523.      
  524.     {block:Quote}
  525.     <h2>“{Quote}”</h2>
  526.     <h1>{Source}</h1>
  527.     {/block:Quote}
  528.  
  529.     {block:Link}
  530.     <a href="{URL}"><h2>{Name}</h2></a>
  531.     {block:Description}
  532.     <p>{Description}</p>
  533.     {/block:Description}
  534.     {/block:Link}
  535.  
  536.     {block:Photo}
  537.     <center><img src="{PhotoURL-500}"/></center>
  538.     {block:Caption}
  539.     {Caption}
  540.     {/block:Caption}
  541.     {/block:Photo}
  542.  
  543.     {block:Photoset}
  544.     <center>{Photoset-500}</center>
  545.     {block:Caption}
  546.     {Caption}
  547.     {/block:Caption}
  548.     {/block:Photoset}
  549.  
  550. {block:Chat}<ul class="chat">{block:Title}<h2>{Title}</h2>{/block:Title}{block:Lines}<li>{block:Label}<span class="tab">{Label}</span>{/block:Label}&nbsp;{Line}</li>{/block:Lines}</ul>{/block:Chat}
  551.  
  552. {block:Video}{Video-500}{block:Caption}{Caption}{/block:Caption}{/block:Video}
  553.  
  554. {block:Answer}<div class="question">{Asker} asked: {Question}</div><div class="answer">{Answer}</div>{/block:answer}
  555.  
  556. {block:Audio}<div class="music">{block:AlbumArt}<div class="albumart"><img src="{AlbumArtURL}"/></div>{/block:AlbumArt}
  557. <div class="musicinfo">{block:TrackName}<b>Title:</b> {TrackName}<br />{/block:TrackName}{block:Artist}<b>Artist:</b> {Artist}<br />{/block:Artist}
  558. {/block:ExternalAudio}<b>Played:</b> {PlayCount} times</div>
  559. <br><div class="playercontainer">{AudioPlayerWhite}</div></div>
  560. {block:Caption}{Caption}{/block:Caption}<br>{/block:Audio}
  561.  
  562.  
  563.  
  564. {block:Date}<div id="info">{TimeAgo} {block:NoteCount} WITH <a href="{Permalink}">{NoteCountWithLabel}</a>{/block:NoteCount}{block:RebloggedFrom} VIA <a href="{ReblogParentURL}">{ReblogParentName}</a>{/block:RebloggedFrom}
  565. {block:ContentSource}  (Source: <a href="{SourceURL}">{SourceLink})</a>{/block:ContentSource}</div>{/block:Date}
  566. {block:HasTags}
  567. <div class="tags">
  568. Tagged as: {block:Tags}<a href="{TagURL}">{Tag}</a>,{/block:Tags}</div>
  569. {/block:HasTags}
  570. <div class="postnote">
  571. {block:PostNotes}{PostNotes}{/block:PostNotes}
  572. </div>
  573. </div>
  574. {/block:Posts}
  575.  
  576.  
  577. </div>
  578.  
  579. <div id="credit"><a href="http://ziaemthemes.tumblr.com/">base code</a></div>
  580.  
  581. </div>
  582. </div>
  583. </div>
  584. </body>
  585. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement