Advertisement
Ilma

Theme #01: Shades of Grey

Sep 21st, 2012
173
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 13.01 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. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  3. <head>
  4. <title>{Title}</title>
  5. <link rel="shortcut icon" href="{Favicon}">
  6. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  7.  
  8. <meta name="font:title" content="Century Gothic" />
  9. <meta name="font:body" content="Century Gothic" />
  10. <meta name="font:description" content="Century Gothic" />
  11. <meta name="color:background" content="#d9d9d9" />
  12. <meta name="color:menubackground" content="#d8d8d8" />
  13. <meta name="color:post" content="#d2d2d2" />
  14. <meta name="color:sidebar" content="#d2d2d2" />
  15. <meta name="color:description" content="#878787" />
  16. <meta name="color:text" content="#878787" />
  17. <meta name="color:titlebg" content="#cecece" />
  18. <meta name="color:titlecolor" content="#fff" />
  19. <meta name="color:link" content="#585858" />
  20. <meta name="color:border" content="#cecece" />
  21. <meta name="color:linkhover" content="#848484" />
  22. <meta name="color:bold" content="#686868" />
  23. <meta name="color:italic" content="#8e8e8e" />
  24.  
  25. <meta name="image:sidebarimg" content="http://i.imgur.com/WtuqM.png" />
  26. <meta name="image:post" content="http://i1167.photobucket.com/albums/q632/iBear19/Background9.gif" />
  27. <meta name="image:sidebarbg" content="http://i1167.photobucket.com/albums/q632/iBear19/Background9.gif" />
  28. <meta name="image:background" content="http://i1167.photobucket.com/albums/q632/iBear19/Background10.png" />
  29.  
  30. <meta name="text:Link1" content="" />
  31. <meta name="text:Link1URL" content=""/>
  32. <meta name="text:Link2" content="" />
  33. <meta name="text:Link2URL" content=""/>
  34. <meta name="text:Link3" content="" />
  35. <meta name="text:Link3URL" content=""/>
  36. <meta name="text:Link4" content="" />
  37. <meta name="text:Link4URL" content=""/>
  38. <meta name="text:Link5" content="" />
  39. <meta name="text:Link5URL" content=""/>
  40. <meta name="text:Link6" content="" />
  41. <meta name="text:Link6URL" content=""/>
  42. <meta name="text:fontsize" content="10px"/>
  43. <meta name="text:Music" content="" />
  44.  
  45. <meta name="if:ShowCaptions" content="0" />
  46. <meta name="if:FadingImages" content="1" />
  47. <meta name="if:InfiniteScroll" content="1" />
  48. <meta name="if:Links" content="0" />
  49. <meta name="if:ShowTags" content="0" />
  50. <meta name="if:MusicPlayer" content="0" />
  51.  
  52. <style type="text/css">
  53.  
  54.         *, body, a, a:hover {cursor: url(http://img69.imageshack.us/img69/7673/cursorw.png), auto;}
  55.  
  56.         body {
  57.         background: {color:background};
  58.         background-image: url({image:background});
  59.         background-attachment: fixed;
  60.         margin: 0;
  61.         padding: 0;
  62.         font-family: {font:Body};
  63.         font-size: {text:fontsize};
  64.         }
  65.        
  66.         ::-webkit-scrollbar-thumb:vertical {
  67.         background-color: #707070;
  68.         height: 30px;}
  69.  
  70.         ::-webkit-scrollbar {
  71.         height: 30px;
  72.         width: 4px;
  73.         background-color:#fff;}
  74.  
  75.         iframe#tumblr_controls {
  76.         right: 1px;
  77.         position: fixed;}
  78.  
  79.         blockquote {
  80.         border-left:3px solid {color:border};
  81.         padding:3px;
  82.         }
  83.  
  84.         a {
  85.         text-decoration:none;
  86.         outline:none;
  87.         -moz-outline-style:none;
  88.         cursor:url("http://www.freewebs.com/cbitwboxes/tiny.cur");
  89.         color:{color:link};}
  90.  
  91.         a:hover {
  92.         text-decoration: none;
  93.         outline:none;
  94.  
  95.         -moz-outline-style:none;
  96.         color:{color:linkhover};}
  97.  
  98.         b,strong {
  99.         text-decoration:none;
  100.         outline:none;
  101.         -moz-outline-style:none;
  102.         color:{color:bold};}
  103.  
  104.         i,em {
  105.         text-decoration:none;
  106.         outline:none;
  107.         -moz-outline-style:none;
  108.         color:{color:italic};}
  109.  
  110.  
  111.         .button{
  112.         float:center;
  113.         color:{color:link};
  114.         text-align:center;
  115.         width:77px;
  116.         height:10px;
  117.         padding:10px 0px 10px 0px;
  118.         }
  119.          
  120.         .button:hover {
  121.         color:#ccc;
  122.         letter-spacing:3px;
  123.         font-weight:800;
  124.         }
  125.  
  126.         .entries img {
  127.         max-width:500px;
  128.         {block:iffadingimages}{block:indexpage}opacity:.7;{/block:indexpage}{/block:iffadingimages}
  129.         -webkit-transition: all 0.7s ease-in-out;
  130.         -moz-transition: all 0.7s ease-in-out;
  131.         -o-transition: all 0.7s ease-in-out;
  132.         -ms-transition: all 0.7s ease-in-out;
  133.         transition: all 0.7s ease-in-out;
  134.         }
  135.          
  136.         .entries img:hover{
  137.         opacity:1
  138.         ;}
  139.          
  140.         .photo{
  141.         {block:iffadingimages}{Block:indexpage}opacity:.7;{/block:indexpage}{/block:iffadingimages}
  142.         -webkit-transition: all 0.7s ease-in-out;
  143.         -moz-transition: all 0.7s ease-in-out;
  144.         -o-transition: all 0.7s ease-in-out;
  145.         -ms-transition: all 0.7s ease-in-out;
  146.         transition: all 0.7s ease-in-out;
  147.         }
  148.          
  149.         .photo:hover{
  150.         opacity:1;}
  151.        
  152.         .navigate{
  153.             width:300px;
  154.             height:20px;
  155.             background:#6e6e6e;
  156.             padding:5px;
  157.             padding-top:6px;
  158.             }
  159.  
  160.         #bar
  161.             { width: 100%;
  162.             position:fixed;
  163.             background-color: {color:titlebg};
  164.             font-family: calibri;
  165.             font-size: 13px;
  166.             text-transform: uppercase;
  167.             line-height: 100%;
  168.             text-align: center;
  169.             letter-spacing: 5px;
  170.             padding-top:10px;
  171.             padding-bottom: 10px;
  172.             color: {color:titlecolor};
  173.             border-bottom:5px solid {color:border};
  174.             z-index:2000;
  175.             }
  176.  
  177.         #title {
  178.             font-family:{font:title};
  179.             color:{color:text};
  180.             font-size:18px;
  181.             font-style:bold;
  182.             text-align:center;
  183.             text-decoration:none;
  184.             }
  185.  
  186.  
  187.         #sidebar {
  188.             position:fixed;
  189.             margin-top:50px;
  190.             margin-left:150px;
  191.             width:250px;
  192.             height:300px;
  193.             padding:5px;
  194.             border: 5px solid {color:border};
  195.             background-image: url({image:sidebarimg});
  196.             border-radius:10px;
  197.             -moz-border-radius:10%;
  198.             }
  199.  
  200.         #sidebar2 {
  201.             position:fixed;
  202.             margin-top:375px;
  203.             {block:IfLinks}margin-top:460px;{/block:IfLinks}
  204.             margin-left:150px;
  205.             width:250px;
  206.             padding:5px;
  207.             border: 5px solid {color:border};
  208.             background-image: url({image:sidebarbg});
  209.             border-radius:10px;
  210.             -moz-border-radius:5%;
  211.             }
  212.  
  213.         #sidebar3 {
  214.             position:fixed;
  215.             margin-top:375px;
  216.             margin-left:150px;
  217.             width:250px;
  218.             padding:5px;
  219.             text-align: center;
  220.             border: 5px solid {color:border};
  221.             background-image: url({image:sidebarbg});
  222.             border-radius:10px;
  223.             -moz-border-radius:5%;
  224.             }
  225.  
  226.  
  227.         #description {
  228.             margin-top:2px;    
  229.             width: 250px;
  230.             font-size:11px;
  231.             text-align:justify;
  232.             color:{color:description};
  233.             font-family:{font:description};
  234.             }
  235.  
  236.         #entry {
  237.              font-size:10px;
  238.              margin-right: 300px;
  239.              margin-top:50px;
  240.              float: right;
  241.              text-align: justify;
  242.              }
  243.  
  244.         #post {
  245.             font-size:10px;
  246.             padding: 5px;
  247.             width: 500px;
  248.             background-image:url({image:post});
  249.             color:{color:text};
  250.             border: 5px solid {color:border};
  251.             text-align: justify;
  252.             border-radius:10px;
  253.             -moz-border-radius:2%;
  254.              }
  255.  
  256.         #music{
  257.             text-align:center;
  258.             padding-bottom:4px;
  259.             padding-top:4px;
  260.             margin-bottom:385px;
  261.             margin-left:235px;
  262.             overflow:hidden;
  263.             left:5px;
  264.             width:74px;
  265.             height:10px;
  266.             z-index:999;
  267.             padding-left:4px;
  268.             padding-right:4px;
  269.             position:fixed;
  270.             bottom:5px;
  271.             opacity:.7;
  272.             -webkit-transition: all 0.5s ease-in-out;
  273.             -moz-transition: all 0.5s ease-in-out;
  274.             -o-transition: all 0.5s ease-in-out;
  275.             -ms-transition: all 0.5s ease-in-out;
  276.             transition: all 0.5s ease-in-out;}
  277.  
  278.         #music:hover #legif{
  279.             opacity:0;
  280.             margin-top:-10px;
  281.             z-index:-99;}
  282.            
  283.         #music:hover{
  284.             overflow:visible;
  285.             margin-left:175px;
  286.             }
  287.  
  288.         #gif{
  289.             opacity:.4;
  290.             z-index:1;
  291.             -webkit-transition: all 0.5s ease-in-out;
  292.             -moz-transition: all 0.5s ease-in-out;
  293.             -o-transition: all 0.5s ease-in-out;
  294.             -ms-transition: all 0.5s ease-in-out;
  295.             transition: all 0.5s ease-in-out;}
  296.  
  297.         #text{
  298.             opacity:0;
  299.             z-index:99;
  300.             padding:4px;
  301.             margin-top:0px;
  302.             -webkit-transition: all 0.5s ease-in-out;
  303.             -moz-transition: all 0.5s ease-in-out;
  304.             -o-transition: all 0.5s ease-in-out;
  305.             -ms-transition: all 0.5s ease-in-out;
  306.             transition: all 0.5s ease-in-out;}
  307.  
  308.         #music:hover #text{
  309.             opacity:1;
  310.             margin-top:-10px;}
  311.  
  312.         #links
  313.             {width:250px;
  314.             overflow:hidden;}
  315.  
  316.         #menu
  317.             {width:300px;
  318.             background-color:{color:menubackground};
  319.             margin-top: 300px;
  320.             margin-left: 135px;
  321.             position: fixed;
  322.             text-align: center;
  323.             overflow:hidden;
  324.             }
  325.  
  326.         #menu2
  327.             {width:310px;
  328.             margin-top: 325px;
  329.             margin-left: 130px;
  330.             position: fixed;
  331.             text-align: center;
  332.             overflow:hidden;
  333.             }
  334.  
  335.         #credit{
  336.             position:fixed;
  337.             bottom:5px;
  338.             right:5px;}
  339.          
  340.         #credit a{
  341.             color:#999;
  342.             font-size:13px;
  343.             text-decoration:none;
  344.             opacity:.7;}
  345.  
  346.         {CustomCSS}
  347. </style>
  348.  
  349. {block:IfInfiniteScroll}
  350. <script type="text/javascript" src="http://codysherman.com/tools/infinite-scrolling/code"></script>
  351. {/block:IfInfiniteScroll}
  352.  
  353. </head>
  354.  
  355. <body>
  356. <div id="bar">{title}</div>
  357. <div id="sidebar"></div>
  358. <div id="menu">
  359. <a href="/"><img src="http://i1167.photobucket.com/albums/q632/iBear19/home.png"></a></td>
  360. <a href="/ask"><img src="http://i1167.photobucket.com/albums/q632/iBear19/letter.png"></a></td>
  361. <a href="/archive"><img src="http://i1167.photobucket.com/albums/q632/iBear19/archive.png"></a></td>
  362. <a href="/mobile"><img src="http://i1167.photobucket.com/albums/q632/iBear19/phone.png"></a></td>
  363. </div>
  364. <div id="menu2">
  365. <div style="font: 36px arial; color:{color:border}; float:left;"></div>
  366. <div style="font: 36px arial; color:{color:border}; float:right;"></div>
  367. </div>
  368. {block:IfLinks}<div id="sidebar3">
  369. <div><table id="links" border="0" cellpadding="0" cellspacing="0" align="center">
  370. <tr>
  371. {block:iflink1}<td><a href="{text:Link1URL}"><div class="button"><span style="font-size:10px">{text:Link1}</span></div></a></td>{/block:iflink1}
  372. {block:iflink2}<td><a href="{text:Link2URL}"><div class="button"><span style="font-size:10px">{text:Link2}</span></div></a></td>{/block:iflink2}
  373. {block:iflink3}<td><a href="{text:Link3URL}"><div class="button"><span style="font-size:10px">{text:Link3}</span></div></a></td>{/block:iflink3}
  374. </tr>
  375. <tr>
  376. {block:iflink4}<td><a href="{text:Link4URL}"><div class="button"><span style="font-size:10px">{text:Link4}</span></div></a></td>{/block:iflink4}
  377. {block:iflink5}<td><a href="{text:Link5URL}"><div class="button"><span style="font-size:10px">{text:Link5}</span></div></a></td>{/block:iflink5}
  378. {block:iflink6}<td><a href="{text:Link6URL}"><div class="button"><span style="font-size:10px">{text:Link6}</span></div></a></td>{/block:iflink6}
  379. </tr>
  380. </table>
  381. </div>
  382. </div>{/block:IfLinks}
  383. <div id="sidebar2">
  384. <div id="description">{block:Description}{Description}{/block:Description}</div>
  385. <center>
  386. {block:IfNotInfiniteScroll}{block:PreviousPage}<a href="{PreviousPage}">← previous</a>{/block:PreviousPage} {block:NextPage} <a href="{NextPage}">next →</a>{/block:NextPage}{/block:IfNotInfiniteScroll}
  387. </center></div>
  388.  
  389. <div id="credit"><a href="http://classily-trashy.tumblr.com"><img src="http://i1167.photobucket.com/albums/q632/iBear19/certificate.png"></a></div>
  390.  
  391. {block:IfMusicPlayer}
  392. {block:IndexPage}
  393. <div id="music">
  394. <div id="gif">
  395. <img src="http://media.tumblr.com/tumblr_ll7wpyHlj71qi6qow.gif"></div>
  396. <div id="text">
  397. {text:Music}
  398. </div>
  399. </div>
  400. {/block:IndexPage}
  401. {/block:IfMusicPlayer}
  402.  
  403.  
  404. <div id="entry">
  405. {block:Posts}
  406. <div id="post">
  407.  <div class="entries">
  408. {block:Text}{Body}{/block:Text}
  409.  
  410. {block:Quote}<h2>“{Quote}” — {Source}</h2>{/block:Quote}
  411.  
  412. {block:Link}<a href="{URL}" class="link" {Target}> <h2>{Name}</h2></a>
  413. {block:Description}<P>{Description}</p>{/block:Description}{/block:Link}</div>
  414.  
  415.  <div class="photo">
  416. {block:Photo}<center>{LinkOpenTag}<img src="{PhotoURL-500}" alt="{PhotoAlt}"/>{LinkCloseTag}</center>{block:IfShowCaptions}{block:Caption}<br />{Caption}{/block:Caption}{/block:IfShowCaptions}{/block:Photo}
  417. {block:Photoset}<center>{Photoset-500}</center>{block:IfShowCaptions}{block:Caption}<br />{Caption}{/block:Caption}{/block:IfShowCaptions}{/block:Photoset}</div>
  418.  
  419. {block:Chat}{block:Title}<t>{Title}</t><br>{/block:Title}{block:Lines}{block:Label}<b>{Label}</b>{/block:Label} {Line}<br>{/block:Lines}{/block:Chat}
  420. {block:Video}{Video-500}{block:IfShowCaptions}{block:Caption}<br />{Caption}{/block:Caption}{/block:IfShowCaptions}{/block:Caption}{/block:Video}
  421.  
  422.  
  423. {block:Answer}
  424. <center><img src="{PortraitURL-48}" style="border-radius:24px;border:5px solid {color:border};"></center> <br><div class="question" style="background:#f7f7f7;padding:5px;">
  425. <b>{Asker}</b> whispered: {Question}</div>
  426. {Answer}
  427. {/block:Answer}
  428.  
  429.  
  430. {block:Audio}<span class="audio"><center>{block:AlbumArt}<img src="{AlbumArtURL}" width="100px" height="100px">{/block:AlbumArt}{AudioPlayerGrey}</center></span>{block:Caption}{Caption}{/block:Caption}{/block:Audio}
  431.  
  432. <div id="info">posted <a href="{Permalink}">{TimeAgo}</a>{/block:Date}{block:NoteCount} • <a href="{Permalink}">{NoteCount}</a> notes{/block:NoteCount}{block:RebloggedFrom} (<a href="{ReblogParentURL}">{ReblogParentName}</a>
  433. {block:ContentSource} source <a href="{SourceURL}">{SourceLink}</a>){block:ContentSource}{/block:RebloggedFrom}<br>
  434.  
  435. {block:IfShowTags}{block:HasTags}{block:Tags}#<a href="{TagURL}">{Tag}</a> {/block:Tags}{/block:HasTags}{/block:IfShowTags}</div></div><br>
  436. {/block:Posts}
  437.  
  438. {block:PostNotes}{PostNotes}{/block:PostNotes}
  439.  
  440. </div>
  441. </body>
  442. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement