Advertisement
enchantique

04. SIMPLICITY

Jul 26th, 2012
4,699
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 12.83 KB | None | 0 0
  1. <!--
  2. THEME: #04 - Simplicity
  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. {block:Description}
  25. <meta name="description" content="{MetaDescription}" />
  26. {/block:Description}
  27.  
  28. <meta name="image:Background" content=""/>
  29.  
  30. <meta name="color:Background" content="#fff"/>
  31. <meta name="color:Post" content="#fff"/>
  32. <meta name="color:Text" content="#333"/>
  33. <meta name="color:Bold" content="#000"/>
  34. <meta name="color:Italic" content="#ccc"/>
  35. <meta name="color:Link" content="#808080"/>
  36. <meta name="color:Link Hover" content="#eee"/>
  37. <meta name="color:Title" content="#000"/>
  38. <meta name="color:Title Border" content="#ccc"/>
  39. <meta name="color:Description Background" content="#eee"/>
  40. <meta name="color:Perma Background" content="#fff"/>
  41. <meta name="color:Perma Link" content="#000"/>
  42. <meta name="color:Chat Text" content="#777"/>
  43. <meta name="color:Scrollbar Background" content="#eee"/>
  44. <meta name="color:Scrollbar Bar" content="#fff"/>
  45.  
  46. <meta name="if:500px" content="1"/>
  47. <meta name="if:400px" content="0"/>
  48. <meta name="if:250px" content="0"/>
  49. <meta name="if:infinite scroll" content="0"/>
  50. <meta name="if:faded image" content="0"/>
  51. <meta name="if:grayscale" content="0"/>
  52. <meta name="if:grayscale with hover" content="0"/>
  53. <meta name="if:show caption" content="0"/>
  54. <meta name="if:show tags" content="0"/>
  55. <meta name="if:no description" content="0"/>
  56.  
  57. <meta name="font:Body" content="Arial"/>
  58.  
  59. <meta name="text:Font Size" content="10"/>
  60. <meta name="text:Blog Title" content=""/>
  61. <meta name="text:Link 1" content=""/>
  62. <meta name="text:Link Url 1" content=""/>
  63. <meta name="text:Link 2" content=""/>
  64. <meta name="text:Link Url 2" content=""/>
  65. <meta name="text:Link 3" content=""/>
  66. <meta name="text:Link Url 3" content=""/>
  67. <meta name="text:Link 4" content=""/>
  68. <meta name="text:Link Url 4" content=""/>
  69.  
  70. <style>
  71. iframe#tumblr_controls {
  72. position: fixed!important;
  73. right: 3px!important;
  74. }
  75. ::-webkit-scrollbar-thumb:vertical {
  76. height: 100px;
  77. background: {color:Scrollbar Bar};
  78. }
  79. ::-webkit-scrollbar {
  80. height:5px;
  81. width:15px;
  82. background: {color:Scrollbar Background};
  83. }
  84. body {
  85. font: {text:Font Size}px {font:Body};
  86. color: {color:Text};
  87. text-align: justify;
  88. word-wrap: break-word;
  89. background: {color:Background} url({image:Background}) repeat fixed;
  90. }
  91. a {
  92. color: {color:Link};
  93. font: 9px arial;
  94. letter-spacing: 1px;
  95. text-decoration: none;
  96. }
  97. a:hover {
  98. color: {color:Link Hover};
  99. }
  100. b, strong {
  101. color: {color:Bold};
  102. }
  103. i, em {
  104. color: {color:Italic};
  105. }
  106. small {
  107. font-size: 10px;
  108. }
  109. pre {
  110. width: 100%;
  111. overflow: auto;
  112. }
  113. #entry img, iframe.photoset {
  114. border: 0;
  115. max-width: 100%;
  116. }
  117. .iframe.photoset {
  118. display: block;
  119. }
  120. #header {
  121. width: 100%;
  122. background: transparent;
  123. text-align: center;
  124. }
  125. .desc {
  126. {block:IndexPage}{block:If500px} width: 500px; {/block:If500px}
  127. {block:If250px} width: 250px; {/block:If250px}{/block:IndexPage}
  128. {block:If400px} width: 400px; {/block:If400px}
  129. {block:IfNot400px}{block:PermalinkPage} width: 500px; {/block:PermalinkPage}{/block:IfNot400px}
  130. font: 8px verdana;
  131. border-top: 1px dotted {color:Title Border};
  132. border-bottom: 1px dotted {color:Title Border};
  133. background: {color:Description Background};
  134. padding: 10px 0;
  135. margin-top: 4px;
  136. {block:IfNoDescription} display: none; {/block:IfNoDescription}
  137. }
  138. .title {
  139. font: 14px verdana;
  140. color: {color:Title};
  141. letter-spacing: 2px;
  142. text-transform: uppercase;
  143. }
  144. #container {
  145. {block:IndexPage}{block:If500px} width: 500px; {/block:If500px}
  146. {block:If250px} width: 250px; {/block:If250px}{/block:IndexPage}
  147. {block:If400px} width: 400px; {/block:If400px}
  148. {block:IfNot400px}{block:PermalinkPage} width: 500px; {/block:PermalinkPage}{/block:IfNot400px}
  149. padding-bottom: 12px;
  150. margin: 0 auto;
  151. }
  152. #entry {
  153. background: {color:Post};
  154. margin-top: 15px;
  155. overflow: hidden;
  156. }
  157. {block:IndexPage}#entry img, .photoset {
  158. {block:IfFadedImage} opacity: 0.8; {/block:IfFadedImage}
  159. {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+ *
  160. filter: gray; /* IE6-9 */
  161. -webkit-filter: grayscale(100%); /* Google Chrome */ {/block:IfGrayscaleWithHover}{/block:IfNotGrayscale}
  162. {block:IfFadedImage} opacity: 0.8; {/block:IfFadedImage}
  163. {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+ *
  164. filter: gray; /* IE6-9 */
  165. -webkit-filter: grayscale(100%); /* Google Chrome */ {/block:IfGrayscale}{/block:IfNotGrayscaleWithHover}
  166. -webkit-transition: all 0.9s ease-in-out;
  167. -moz-transition: all 0.9s ease-in-out;
  168. -o-transition: all 0.9s ease-in-out;
  169. }
  170. #entry img:hover, .photoset:hover {
  171. {block:IfFadedImage} opacity: 1; {/block:IfFadedImage}
  172. {block:IfNotGrayscale}{block:IfGrayscaleWithHover} filter: none;
  173. -webkit-filter: grayscale(0%); {/block:IfGrayscaleWithHover}{/block:IfNotGrayscale}
  174. }{/block:IndexPage}
  175. h1, .h1 {
  176. font: lighter 12px verdana;
  177. color: {color:Title};
  178. letter-spacing: 2px;
  179. text-transform: lowercase;
  180. border-bottom: 1px dotted {color:Title Border};
  181. }
  182. blockquote {
  183. margin: 6px;
  184. padding-left: 5px;
  185. background: {color:Description Background};
  186. border-left: 1px dotted {color:Title Border};
  187. }
  188. #entry:hover #perma {
  189. opacity: 0.8;
  190. }
  191. #perma {
  192. width: 120px;
  193. position: absolute;
  194. {block:If500px} margin-left: 175px; {/block:If500px}
  195. {block:If400px} margin-left: 130px; {/block:If400px}
  196. {block:If250px} margin-left: 55px; {/block:If250px}
  197. font: 8px verdana;
  198. text-transform: uppercase;
  199. text-align: center;
  200. background: {color:Perma Background};
  201. color: {color:Perma Link};
  202. opacity: 0;
  203. padding: 10px;
  204. z-index: 1;
  205. -webkit-transition: all 0.5s ease-in-out;
  206. -moz-transition: all 0.5s ease-in-out;
  207. -o-transition: all 0.5s ease-in-out;
  208. }
  209. #perma a {
  210. color: {color:Perma Link};
  211. font: 14px verdana;
  212. text-transform: uppercase;
  213. }
  214. #perma a:hover {
  215. color: {color:Link};
  216. }
  217. #tags {
  218. font-size: 9px;
  219. {block:IndexPage}{block:IfNotShowTags} display: none; {/block:IfNotshowTags}{/block:IndexPage}
  220. }
  221. #notes {
  222. text-align: left;
  223. }
  224. .quote {
  225. font-size: 15px;
  226. font-style: italic;
  227. text-indent: 25px;
  228. padding: 0 15px;
  229. }
  230. .qtsource {
  231. margin-top: 5px;
  232. text-align: right;
  233. }
  234. .chat {
  235. color: {color:Chat Text};
  236. padding: 1px;
  237. margin-bottom: 0px;
  238. }
  239. .chat.even {
  240. color: {color:Link};
  241. background: {color:Description Background};
  242. }
  243. .audio {
  244. width: 20px;
  245. overflow: hidden;
  246. background: #fff;
  247. float: left;
  248. }
  249. .audinfo {
  250. position: relative;
  251. margin: 5px 0 5px 35px;
  252. }
  253. .ask {
  254. padding: 10px;
  255. border-bottom: 1px dotted {color:Title Border};
  256. }
  257. .ask img {
  258. margin-right: 4px;
  259. }
  260. #backtotop{
  261. position:fixed;
  262. right: 10px;
  263. bottom:0px;
  264. padding:5px;
  265. text-align:center;
  266. }
  267. #backtotop a{
  268. font: 30px lucida console, trebuchet ms, sans-serif;
  269. color: {color:Link};
  270. }
  271. {CustomCSS}
  272. </style>
  273.  
  274. {block:IfInfiniteScroll}<script type="text/javascript" src="http://static.tumblr.com/b0mqilh/Zu2m0dn6s/infinitescrolling.js"></script>{/block:IfInfiniteScroll}
  275.  
  276. </head><body>
  277.  
  278. <div id="backtotop"><a href="javascript:scroll(0,0)">▲<br><div style="font-family: arial; font-size: 8px;">top</div></a></div>
  279.  
  280. <div id="header">{block:IfBlogTitle}<div class="title">{text:Blog Title}</div>{/block:IfBlogTitle}
  281. <center>{block:Description}<div class="desc">{Description}</div>{/block:Description}</center>
  282. <a href="/">home</a> &middot; <a href="/archive">archive</a> &middot; <a href="/ask">ask</a> &middot; {block:IfLink1} <a href="{text:Link Url 1}">{text:Link 1}</a> &middot;{/block:IfLink1} {block:IfLink2}<a href="{text:Link Url 2}">{text:Link 2}</a> &middot;{/block:IfLink2} {block:IfLink3} <a href="{text:Link Url 3}">{text:Link 3}</a> &middot;{/block:IfLink3} {block:IfLink4}<a href="{text:Link Url 4}">{text:Link 4}</a> &middot;{/block:IfLink4} <a href="http://enchantique.tumblr.com">theme</a>
  283. </div>
  284.  
  285. <div id="container">
  286. {block:IfInfiniteScroll}
  287. <div class="autopagerize_page_element">
  288. {/block:IfInfiniteScroll}
  289. {block:Posts}
  290.  
  291. <div id="entry">{block:IndexPage}<div id="perma">{block:Date}<a href="{Permalink}">{ShortMonth} {DayofMonthWithZero}, {ShortYear}</a><br>{12HourWithZero}:{Minutes} {CapitalAmPm}{/block:Date} {block:NoteCount}| {NoteCountWithLabel}{/block:NoteCount}{block:RebloggedFrom}<br><a href="{ReblogParentURL}">Via</a> &middot; <a href="{ReblogRootURL}">source</a>{/block:RebloggedFrom}</div>{/block:IndexPage}
  292.  
  293. {block:Text}{block:Title}<h1>{Title}</h1>{/block:Title}{Body}{/block:Text}
  294.  
  295. {block:Photo}{LinkOpenTag}<img style="display: block;" 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}
  296.  
  297. {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}
  298.  
  299. {block:Quote}<div class="quote">❝ {Quote}</div>{block:Source}<div class="qtsource"> —{Source}</div>{/block:Source}{/block:Quote}
  300.  
  301. {block:Link}<h1><a class="h1" href="{URL}" {Target}>{Name}</a></h1>{block:Description}{Description}{/block:Description}{/block:Link}
  302.  
  303. {block:Chat}{block:Title}<h1>{Title}</h1>{/block:Title}<div class="chat">{block:Lines}<div class="chat {Alt}">{block:Label}<b>{Label}</b>{/block:Label} {Line}</div>{/block:Lines}</div>{/block:Chat}
  304.  
  305. {block:Audio}<div class="audio">{AudioPlayerWhite}</div><div class="audinfo">{block:TrackName}<i>{TrackName}</i>{/block:TrackName} {block:Artist}by <b>{Artist}</b>{/block:Artist}</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}
  306.  
  307. {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}
  308.  
  309. {block:Answer}<div class="ask"><img src="{AskerPortraitURL-24}" align="left" style="padding: 4px; max-width: 24px;">{Asker}:<br> {Question}</div><div style="color: {color:Link}">{Answer}</div>{/block:Answer}
  310.  
  311. {block:ContentSource}
  312. <!-- {block:RebloggedFrom} via <a href="{ReblogParentURL}">{ReblogParentName}</a>{block:RebloggedFrom}{SourceURL}{block:SourceLogo}<img src="{BlackLogoURL}"
  313. width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" />
  314. {/block:SourceLogo}
  315. {block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo} -->
  316. {/block:ContentSource}
  317.  
  318. {block:HasTags}<div id="tags">tagged: {block:Tags}#</font><a href="{TagUrl}">{Tag}</a> {/block:Tags}</div>{/block:HasTags}
  319.  
  320. {block:permalinkpage}<div id="notes">{block:PostNotes}{PostNotes}
  321. {/block:PostNotes}</div>{/block:permalinkpage}
  322.  
  323. </div>{/block:Posts}</div>
  324.  
  325. {block:IfNotInfiniteScroll}<div style="text-align:center;">
  326. {block:Pagination}{block:PreviousPage}<a href="{PreviousPage}">previous</a> &middot;{/block:PreviousPage} {block:NextPage}<a href="{NextPage}">next</a>{/block:NextPage}{/block:Pagination}
  327. </div>{/block:IfNotInfiniteScroll}
  328.  
  329. </body></html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement