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

02. DRAWING DAYS

By: enchantique on Aug 8th, 2012  |  syntax: None  |  size: 16.06 KB  |  hits: 1,417  |  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. <!--
  2. THEME: #02 - Drawing Days
  3. by sakurane - (sakurane.tumblr.com)
  4. ----------------------------------------------------------------------
  5. TERMS OF USAGE
  6. 1. Do not remove the credit. (You may move it to a credits page.)
  7. 2. Do not use as a base code.
  8. 3. Do not take any part of the code.
  9. 4. Do not redistribute.
  10. 5. Do not claim as your own.
  11. 6. You may customize to your liking, but keep the credit intact.
  12. -->
  13.  
  14. <!DOCTYPE html>
  15. <html>
  16. <head>
  17.  
  18. <title>{Title}</title>
  19.  
  20. <link rel="shortcut icon" href="{Favicon}">
  21. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  22. <link rel="stylesheet" href="http://static.tumblr.com/kzorqqu/8EOmgtzik/normalize.css"/>
  23.  
  24. <link href='http://static.tumblr.com/6hsqxdt/CPem845ky/stylesheet.css' rel='stylesheet' type='text/css'>
  25.  
  26. {block:Description}
  27. <meta name="description" content="{MetaDescription}" />
  28. {/block:Description}
  29.  
  30. <meta name="image:Sidebar" content="">
  31. <meta name="image:Background" content="">
  32. <meta name="image:Fixed BG" content="">
  33.  
  34. <meta name="color:Background" content="#efefef">
  35. <meta name="color:Text" content="#bababa">
  36. <meta name="color:Bold" content="#a3a3a3">
  37. <meta name="color:Italic" content="#9b9b9b">
  38. <meta name="color:Link" content="#959595">
  39. <meta name="color:Link Hover" content="#d8d8d8">
  40. <meta name="color:Post Title" content="#808080">
  41. <meta name="color:Post Background" content="#fdfbfb">
  42. <meta name="color:Desc Text" content="#b6b6b6">
  43. <meta name="color:Title" content="#6d6d6d">
  44. <meta name="color:Title Background" content="#f9f8f8">
  45. <meta name="color:Sidebar Background" content="#fdfdfd">
  46. <meta name="color:Dash Border" content="#c6c6c6">
  47. <meta name="color:Nav Link" content="#fff">
  48. <meta name="color:Nav Link Hover" content="#a2a2a2">
  49. <meta name="color:Nav Background" content="#a4a4a4">
  50. <meta name="color:Nav Hover Background" content="#c0c0c0">
  51. <meta name="color:Perma Link" content="#aeaeae">
  52. <meta name="color:Perma Link Hover" content="#fff">
  53. <meta name="color:Perma Background" content="#dedede">
  54. <meta name="color:Ask Background" content="#ccc">
  55. <meta name="color:Scrollbar Bar" content="#fff">
  56. <meta name="color:Scrollbar Background" content="#eee">
  57.  
  58. <meta name="if:500px" content="0">
  59. <meta name="if:400px" content="1">
  60. <meta name="if:250px" content="0">
  61. <meta name="if:infinite scroll" content="0">
  62. <meta name="if:faded image" content="0">
  63. <meta name="if:grayscale" content="0">
  64. <meta name="if:grayscale with hover" content="0">
  65. <meta name="if:show caption" content="0">
  66.  
  67. <meta name="font:Body" content="verdana">
  68. <meta name="text:Font Size" content="9">
  69.  
  70. <meta name="text:Blog Title" content="">
  71. <meta name="text:Link 1" content="">
  72. <meta name="text:Link Url 1" content="">
  73. <meta name="text:Link 2" content="">
  74. <meta name="text:Link Url 2" content="">
  75. <meta name="text:Link 3" content="">
  76. <meta name="text:Link Url 3" content="">
  77. <meta name="text:Link 4" content="">
  78. <meta name="text:Link Url 4" content="">
  79. <meta name="text:Link 5" content="">
  80. <meta name="text:Link Url 5" content="">
  81.  
  82. <style type="text/css">
  83. @import url(http://static.tumblr.com/6hsqxdt/md2mgu4of/tinytots.css);
  84.  
  85. *, body, a, a:hover {
  86.         cursor: url(http://static.tumblr.com/6hsqxdt/ofQm8ehf8/cursor.png), auto;
  87. }
  88. iframe#tumblr_controls {
  89.         position: fixed!important;
  90.         right: 3px!important;
  91. }
  92. ::-webkit-scrollbar-thumb:vertical {
  93.         height: 100px;
  94.         background: {color:Scrollbar Bar};
  95. }
  96. ::-webkit-scrollbar {
  97.         height: 10px;
  98.         width: 10px;
  99.         background: {color:Scrollbar Background};
  100. }
  101. body {
  102.         font: {text:Font Size}px {font:Body};
  103.         color: {color:Text};
  104.         text-align: justify;
  105.         background: {color:Background} url({image:Background}) repeat fixed;
  106.         margin: 0;
  107. }
  108. b, strong {
  109.         color: {color:Bold};
  110.         text-transform: uppercase;
  111. }
  112. i, em {
  113.         color: {color:Italic};
  114. }
  115. a {
  116.         color: {color:Link};
  117.         text-decoration: none;
  118. }
  119. a:hover {
  120.         color: {color:Link Hover};
  121. }
  122. bg {
  123.         position: fixed;
  124.         bottom: 0px;
  125.         right: 0px;
  126.         z-index: -1;
  127. }
  128. #container {
  129.         {block:IndexPage}{block:If500px} margin-left: 210px; {/block:If500px}
  130.         {block:If250px} margin-left: 460px; {/block:If250px}{/block:IndexPage}
  131.         {block:If400px} width: 400px; margin-left: 310px; {/block:If400px}
  132.         {block:IfNot400px}{block:PermalinkPage} width: 500px; margin-left: 210px; {/block:PermalinkPage}{/block:IfNot400px}
  133.         padding-bottom: 10px;
  134. }
  135. #entry {
  136.         {block:IndexPage}{block:If500px} width: 500px; {/block:If500px}
  137.         {block:If250px} width: 250px; {/block:If250px}{/block:IndexPage}
  138.         {block:If400px} width: 400px; {/block:If400px}
  139.         {block:IfNot400px}{block:PermalinkPage} width: 500px; {/block:PermalinkPage}{/block:IfNot400px}
  140.         background: {color:Post Background};
  141.         padding: 4px;
  142.         margin-top: 10px;
  143.         overflow: hidden;
  144. }
  145. #entry img {
  146.         border: 0;
  147.         {block:If400px} max-width: 400px; {/block:If400px}
  148.         {block:IndexPage}{block:If250px} max-width: 250px; {/block:If250px}{/block:IndexPage}
  149. }
  150. {block:IndexPage}#entry img, .photoset {
  151.         {block:IfFadedImage} opacity: 0.8; {/block:IfFadedImage}
  152.         {block:IfNotGrayscale}{block:IfGrayscaleWithHover} filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale"); /* Firefox 3.5+ *
  153.         filter: gray; /* IE6-9 */
  154.         -webkit-filter: grayscale(100%); /* Google Chrome */ {/block:IfGrayscaleWithHover}{/block:IfNotGrayscale}
  155.         {block:IfFadedImage} opacity: 0.8; {/block:IfFadedImage}
  156.         {block:IfNotGrayscaleWithHover}{block:IfGrayscale} filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale"); /* Firefox 3.5+ *
  157.         filter: gray; /* IE6-9 */
  158.         -webkit-filter: grayscale(100%); /* Google Chrome */ {/block:IfGrayscale}{/block:IfNotGrayscaleWithHover}
  159.         -webkit-transition: all 0.9s ease-in-out;
  160.         -moz-transition: all 0.9s ease-in-out;
  161.         -o-transition: all 0.9s ease-in-out;
  162. }
  163. #entry img:hover, .photoset:hover {
  164.         {block:IfFadedImage} opacity: 1; {/block:IfFadedImage}
  165.         {block:IfNotGrayscale}{block:IfGrayscaleWithHover} filter: none;
  166.         -webkit-filter: grayscale(0%); {/block:IfGrayscaleWithHover}{/block:IfNotGrayscale}
  167. }{/block:IndexPage}
  168. h1 {
  169.         font: lighter 12px 'Courier New', Courier, monospace;
  170.         color: {color:Post Title};
  171.         text-transform: uppercase;
  172.         text-align: center;
  173.         background: {color:Sidebar Background};
  174.         border-bottom: 1px dashed {color:Dash Border};
  175.         padding: 2px 0;
  176.         margin: 0 25px;
  177. }
  178. h1 a {
  179.         color: {color:Post Title};
  180. }
  181. h1 a:hover {
  182.         color: {color:Link Hover};
  183. }
  184. blockquote {
  185.         color: {color:Desc Text};
  186.         background: {color:Sidebar Background};
  187.         border-left: 1px dashed {color:Dash Border};
  188.         padding: 0 5px;
  189.         margin: 5px 15px;
  190. }
  191. #entry:hover #tags {
  192.         opacity: 1;
  193. }
  194. #tags {
  195.         width: 100px;
  196.         position: absolute;
  197.         margin-left: -130px;
  198.         font-size: 9px;
  199.         color: {color:Perma Link};
  200.         text-align: right;
  201.         background: {color:Post Background};
  202.         border-radius: 5px;
  203.         -moz-border-radius: 5px;
  204.         padding: 5px;
  205.         opacity: 0;
  206.         -webkit-transition: all 0.8s ease-in-out;
  207.         -moz-transition: all 0.8s ease-in-out;
  208.         -o-transition: all 0.8s ease-in-out;
  209. }
  210. #perma {
  211.         {block:IndexPage}{block:If500px} width: 508px; {/block:If500px}
  212.         {block:If250px} width: 258px; {/block:If250px}{/block:IndexPage}
  213.         {block:If400px} width: 408px; {/block:If400px}
  214.         {block:IfNot400px}{block:PermalinkPage} width: 508px; {/block:PermalinkPage}{/block:IfNot400px}
  215.         color: {color:Perma Link};
  216.         letter-spacing: none;
  217.         text-align: right;
  218.         background: {color:Perma Background};
  219.         border-top: 1px dashed {color:Dash Border};
  220.         border-radius: 0 0 5px 5px;
  221.         -moz-border-radius: 0 0 5px 5px;
  222.         padding: 0;
  223.         margin: 0;
  224. }
  225. #perma a {
  226.         color: {color:Perma Link};
  227. }
  228. #perma a:hover {
  229.         color: {color:Perma Link Hover};
  230. }
  231. #permatags {
  232.         {block:If400px} width: 408px; {/block:If400px}
  233.         {block:IfNot400px} width: 508px; {/block:IfNot400px}
  234. }
  235. #notes {
  236.         text-align: left;
  237. }
  238. #sidebar {
  239.         width: 250px;
  240.         position: fixed;
  241.         top: 100px;
  242.         left: 750px;
  243. }
  244. #sidebar img {
  245.         text-align: center;
  246.         border: 1px dashed {color:Dash Border};
  247.         border-bottom: none;
  248.         padding: 5px;
  249.         margin: 5px 0;
  250.         z-index: 2;
  251. }
  252. #pg {
  253.         position: fixed;
  254.         margin-left: 250px;
  255. }
  256. #pg a {
  257.         font: 15px WebSymbolsRegular;
  258.         color: {color:Link};
  259.         background: {color:Sidebar Background};
  260.         border-radius: 0 5px 5px 0;
  261.         -moz-border-radius: 0 5px 5px 0;
  262.         display: block;
  263.         padding: 5px;
  264.         margin: 5px 0;
  265. }
  266. #pg a:hover {
  267.         color: {color:Nav Link Hover};
  268.         background: {color:Nav Hover Background};
  269. }
  270. #sb {
  271.         background: {color:Sidebar Background};
  272.         border-radius: 0 0 5px 5px;
  273.         -moz-border-radius: 0 0 5px 5px;
  274.         z-index: 1;
  275. }
  276. #sb a {
  277.         color: {color:Perma Link};
  278. }
  279. #sb a:hover {
  280.         color: {color:Perma Link Hover};
  281. }
  282. .title {
  283.         width: 240px;
  284.         position: fixed;
  285.         font: bold 14px 'Courier New', Courier, monospace;
  286.         color: {color:Title};
  287.         text-transform: uppercase;
  288.         text-align: center;
  289.         background: {color:Title Background};
  290.         padding: 4px 0;
  291.         margin: -25px 0 0 5px;
  292.         z-index: 3;
  293. }
  294. #nav {
  295.         width: 250px;
  296. }
  297. #nav a {
  298.         color: {color:Nav Link};
  299.         text-transform: uppercase;
  300.         text-align: left;
  301.         background: {color:Nav Background};
  302.         display: inline-block;
  303.         padding: 10px 20px;
  304.         -webkit-transition: all 0.8s ease-in-out;
  305.         -moz-transition: all 0.8s ease-in-out;
  306.         -o-transition: all 0.8s ease-in-out;
  307. }
  308. #nav a:hover {
  309.         color: {color:Nav Link Hover};
  310.         background: {color:Nav Hover Background};
  311.         border-left: none;
  312. }
  313. #nav a, .desc, #perma {
  314.         font: 8px tinytots;
  315. }
  316. .desc {
  317.         color: {color:Desc Text};
  318.         text-transform: uppercase;
  319.         text-align: justify;
  320.         border-bottom: 1px dashed {color:Dash Border};
  321.         padding: 5px;
  322. }
  323. #customlinks {
  324.         background: {color:Perma Background};
  325.         border-radius: 0 0 5px 5px;
  326.         -moz-border-radius: 0 0 5px 5px;
  327.         padding-bottom: 2px;
  328. }
  329. .quote {
  330.         font: italic 15px 'Courier New', Courier, monospace;
  331.         text-indent: 25px;
  332.         padding: 0 15px;
  333.         margin-bottom: 5px;
  334. }
  335. .qtsource {
  336.         text-align: right;
  337. }
  338. .audio {
  339.         width: 100%;
  340.         background: #fff;
  341. }
  342. .ask {
  343.         width: 60px;
  344.         position: relative;
  345.         float: left;
  346.         background: {color:Ask Background};
  347.         margin-right: 20px;
  348. }
  349. .ask img {
  350.         padding: 10px;
  351. }
  352. .ask:after {
  353.         height: 0;
  354.         width: 0;
  355.         content: " ";
  356.         position: absolute;
  357.         left: 100%;
  358.         border: solid transparent;
  359.         pointer-events: none;
  360. }
  361. .ask:after {
  362.         border-left-color: {color:Ask Background};
  363.         border-width: 10px;
  364.         top: 50%;
  365.         margin-top: -10px;
  366. }
  367. .qs {
  368.         width: 100%;
  369.         font: 11px 'Courier New', Courier, monospace;
  370. }
  371. .answer {
  372.         border-top: 1px dashed {color:Dash Border};
  373.         margin-top: 8px;
  374. }
  375. #backtotop {
  376.         text-align: center;
  377.         position: fixed;
  378.         bottom: 0;
  379.         right: 10px;
  380.         padding: 5px;
  381. }
  382. #backtotop a {
  383.         font: 30px lucida console, tebuchet ms, sans-serif;
  384.         color: {color:Link};
  385. }
  386. #backtotop a:hover {
  387.         color: {color:Link Hover};
  388. }
  389. {CustomCSS}    
  390. </style>
  391.  
  392. {block:IfInfiniteScroll}<script type="text/javascript" src="http://codysherman.com/tools/infinite-scrolling/code"></script>{/block:IfInfiniteScroll}
  393.  
  394. </head><body>
  395.  
  396. <div id="backtotop"><a href="javascript:scroll(0,0)">▲</a></div>
  397.  
  398. <div id="bg"><img src="{image:Fixed BG}"></div>
  399.  
  400. <div id="sidebar">
  401. <div id="sb">
  402. {block:IfNotInfiniteScroll}<div id="pg">
  403. {block:Pagination}
  404.             {block:PreviousPage}
  405.                 <a href="{PreviousPage}"><</a>
  406.             {/block:PreviousPage}
  407.  
  408.             {block:NextPage}
  409.                 <a href="{NextPage}">></a>
  410.             {/block:NextPage}
  411.         {/block:Pagination}
  412. </div>{/block:IfNotInfiniteScroll}
  413. <center><img src="{image:Sidebar}" width=230px></center>
  414. {block:IfBlogTitle}<div class="title">{text:Blog Title}</div>{/block:IfBlogtitle}
  415. <div id="nav"><center>
  416. <a href="/">index</a>
  417. <a href="/ask">ask</a>
  418. <a href="/archive">past</a>
  419. <a href="http://sakurane.tumblr.com">theme</a>
  420. </center></div>
  421. <div class="desc">
  422. {Description}
  423. </div>
  424. <div id="customlinks"><center>{block:IfLink1}<a class="sb" href="{text:Link Url 1}">{text:Link 1}</a>{/block:IfLink1}
  425. {block:IfLink2}&middot; <a href="{text:Link Url 2}">{text:Link 2}</a>{/block:IfLink2}
  426. {block:IfLink3}&middot; <a href="{text:Link Url 3}">{text:Link 3}</a>{/block:IfLink3}
  427. {block:IfLink4}&middot; <a href="{text:Link Url 4}">{text:Link 4}</a>{/block:IfLink4}
  428. {block:IfLink5}&middot; <a href="{text:Link Url 5}">{text:Link 5}</a>{/block:IfLink5}</center></div>
  429. </div>
  430. </div>
  431.  
  432. <div id="container">
  433. {block:IfInfiniteScroll}
  434. <div class="autopagerize_page_element">
  435. {/block:IfInfiniteScroll}
  436. {block:Posts}
  437.  
  438. <div id="entry">{block:IndexPage}{block:HasTags}<div id="tags">tagged:<br>{block:Tags}<a href="{TagUrl}">{Tag}</a>#<br> {/block:Tags}</div>{/block:HasTags}{/block:IndexPage}
  439.  
  440. {block:Text}{block:Title}<h1>{Title}</h1>{/block:Title}{Body}{/block:Text}
  441.  
  442. {block:Photo}{LinkOpenTag}<img src="{PhotoURL-500}" alt="{PhotoAlt}" {block:If400px}width="400"{/block:If400px}{block:IndexPage}{block:If250px}width="250"{/block:If250px}{/block:IndexPage}/>{LinkCloseTag}{block:IfNotShowCaption}{block:PermalinkPage}{block:Caption}{Caption}{/block:Caption}{/block:PermalinkPage}{/block:IfNotShowCaption}{block:IfShowCaption}{block:Caption}{Caption}{/block:Caption}{/block:IfShowCaption}{/block:Photo}
  443.  
  444. {block:Photoset}<div class="photoset">{block:IndexPage}{block:If500px}{Photoset-500}{/block:If500px}{block:If250px}{Photoset-250}{/block:If250px}{/block:IndexPage}{block:If400px}{Photoset-400}{/block:If400px}{block:IfNot400px}{block:PermalinkPage}{Photoset-500}{/block:PermalinkPage}{/block:IfNot400px}</div>{block:IfNotShowCaption}{block:PermalinkPage}{block:Caption}{Caption}{/block:Caption}{/block:PermalinkPage}{/block:IfNotShowCaption}{block:IfShowCaption}{block:Caption}{Caption}{/block:Caption}{/block:IfShowCaption}{/block:Photoset}
  445.  
  446. {block:Quote}<div class="quote">" {Quote}</div>{block:Source} <div class="qtsource">—{Source}</div>{/block:Source}{/block:Quote}
  447.  
  448. {block:Link}<h1><a href="{URL}" {Target}>{Name}</a></h1>{block:Description}{Description}{/block:Description}{/block:Link}
  449.  
  450. {block:Chat}{block:Title}<t>{Title}</t>{/block:Title}{block:Lines}{block:Label}<b>{Label}</b>{/block:Label} {Line}<br>{/block:Lines}{/block:Chat}
  451.  
  452. {block:Audio}<div class="audio">{AudioPlayerWhite}</div>{block:IfNotShowCaption}{block:PermalinkPage}{block:Caption}{Caption}{/block:Caption}{/block:PermalinkPage}{/block:IfNotShowCaption}{block:IfShowCaption}{block:Caption}{Caption}{/block:Caption}{/block:IfShowCaption}{/block:Audio}
  453.  
  454. {block:Video}{block:IndexPage}{block:If500px}{Video-500}{/block:If500px}{block:If250px}{Video-250}{/block:If250px}{/block:IndexPage}{block:If400px}{Video-400}{/block:If400px}{block:IfNot400px}{block:PermalinkPage}{Video-500}{/block:PermalinkPage}{/block:IfNot400px}{block:IfNotShowCaption}{block:PermalinkPage}{block:Caption}{Caption}{/block:Caption}{/block:PermalinkPage}{block:IfNotShowCaption}{block:IfShowCaption}{block:Caption}{Caption}{/block:Caption}{/block:IfShowCaption}{/block:Video}
  455.  
  456. {block:Answer}<table class="qs"><tr><td width="60"><div class="ask"><img src="{AskerPortraitURL-40}"></div></td><td style="line-height: 10px;"><font style="text-transform: uppercase;">{Asker}</font>: <i>{Question}</i></td></tr></table><div class="answer">{Answer}</div>{/block:Answer}
  457.  
  458. {block:ContentSource}
  459. <!-- {SourceURL}{block:SourceLogo}<img src="{BlackLogoURL}"
  460. width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" />
  461. {/block:SourceLogo}
  462. {block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo} -->
  463. {/block:ContentSource}
  464.  
  465. </div>
  466.  
  467. <div id="perma">{block:RebloggedFrom}<div style="float:left; text-transform: uppercase;"><a href="{ReblogParentURL}">via</a> &middot; <a href="{ReblogRootURL}">source</a></div>{block:RebloggedFrom}{block:Date}<a href="{Permalink}">{Month} {DayOfMonthWithZero}, {Year}</a>{/block:Date}{block:NoteCount} | {{NoteCount}}{/block:NoteCount}</div>
  468.  
  469. {block:PermalinkPage}<div id="permatags">{block:HasTags}tagged: {block:Tags}#<a href="{TagUrl}">{Tag}</a> {/block:Tags}{/block:HasTags}</div>{/block:PermalinkPage}
  470.  
  471. {block:permalinkpage}<div id="notes">{block:PostNotes}{PostNotes}
  472. {/block:PostNotes}</div>{/block:permalinkpage}
  473.  
  474. {/block:Posts}</div>
  475.  
  476. </body></html>