Advertisement
midthemes

Theme 01 by Jenny

May 30th, 2014
697
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 15.31 KB | None | 0 0
  1. <!--------
  2.  
  3. theme 01 by midthemes (http://midgardens.tumblr.com/)
  4.  
  5. don't steal, claim as your own or remove the credit
  6.  
  7. ------>
  8.  
  9.  
  10. <!DOCTYPE html>
  11. <head>
  12.  
  13. <title>{title}</title>
  14. <link rel="shortcut icon" href="{Favicon}"/>
  15. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  16. {block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}
  17.  
  18. <link href='http://fonts.googleapis.com/css?family=IM+Fell+Great+Primer:400,400italic' rel='stylesheet' type='text/css'>
  19. <link href='http://fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,600italic,400,300,600' rel='stylesheet' type='text/css'>
  20.  
  21. <meta name="image:sidebar" content="" />
  22.  
  23. <meta name="color:background" content="#fbfbfb" />
  24. <meta name="color:posts" content="#ffffff" />
  25. <meta name="color:text" content="#888888" />
  26. <meta name="color:link" content="#bad8eb" />
  27. <meta name="color:link hover" content="#dcecf5" />
  28. <meta name="color:sidebar" content="#ffffff" />
  29. <meta name="color:navigation" content="#bad8eb" />
  30. <meta name="color:description" content="#bad8eb" />
  31. <meta name="color:info" content="#f2f5f5" />
  32. <meta name="color:scrollbar" content="#bad8eb" />
  33.  
  34. <meta name="if:Posts 500" content="" />
  35. <meta name="if:Posts 400" content="1" />
  36.  
  37. <meta name="text:title" content="" />
  38. <meta name="text:link 1" content="/" />
  39. <meta name="text:link 1 title" content="home" />
  40. <meta name="text:link 2" content="/" />
  41. <meta name="text:link 2 title" content="message" />
  42. <meta name="text:link 3" content="/" />
  43. <meta name="text:link 3 title" content="" />
  44. <meta name="text:link 4" content="/" />
  45. <meta name="text:link 4 title" content="" />
  46. <meta name="text:link 5" content="/" />
  47. <meta name="text:link 5 title" content="" />
  48. <meta name="text:link 6" content="/" />
  49. <meta name="text:link 6 title" content="" />
  50.  
  51. <style type="text/css">
  52.  
  53. ::-webkit-scrollbar-thumb:vertical {background-color:{color:scrollbar}; height:auto;}
  54. ::-webkit-scrollbar-thumb:horizontal {background-color:{color:scrollbar};height:10px !important;}
  55. ::-webkit-scrollbar {height:7px; width:7px; background-color:{color:background};}
  56.  
  57. #s-m-t-tooltip {
  58. max-width:300px;
  59. background-color: {color:navigation};
  60. font-family: calibri;
  61. font-size: 8px;
  62. text-transform: uppercase;
  63. color: #ffffff;
  64. padding: 5px;
  65. margin: 10px 0px 0px 20px;
  66. z-index: 9999999999999;
  67. }
  68.  
  69. body {
  70. font-family: 'Open Sans', sans-serif;
  71. font-size: 9px;
  72. font-style: none;
  73. letter-spacing: 0px;
  74. color: {color:text};
  75. background-color: {color:background};
  76. }
  77.  
  78. a:link, a:active, a:visited {
  79. color: {color:link};
  80. text-decoration: none;
  81. -webkit-transition: all 0.2s ease-in-out;
  82. -moz-transition: all 0.2s ease-in-out;
  83. -o-transition: all 0.2s ease-in-out;
  84. transition: all 0.2s ease-in-out;
  85. }
  86.  
  87. a:hover {
  88. color: {color:link hover};
  89. -webkit-transition: all 0.2s ease-in-out;
  90. -moz-transition: all 0.2s ease-in-out;
  91. -o-transition: all 0.2s ease-in-out;
  92. transition: all 0.3s ease-in-out;
  93. }
  94.  
  95. #content {
  96. {block:ifPosts500}width: 500px;{/block:ifPosts500}
  97. {block:ifPosts400}width: 400px;{/block:ifPosts400}
  98. {block:ifPosts500}margin: 50px 480px;{/block:ifPosts500}
  99. {block:ifPosts400}margin: 50px 520px;{/block:ifPosts400}
  100. text-align: justify;
  101. }
  102.  
  103. #posts {
  104. {block:ifPosts500}width: 500px;{/block:ifPosts500}
  105. {block:ifPosts400}width: 400px;{/block:ifPosts400}
  106. margin-top: 70px;
  107. background-color: {color:posts};
  108. padding: 30px;
  109. word-wrap: break-word;
  110. }
  111.  
  112. #sidebar {
  113. position: fixed;
  114. width: 220px;
  115. height: auto;
  116. {block:ifPosts500}margin: 130px 230px;{block:ifPosts500}
  117. {block:ifPosts400}margin: 130px 270px;{block:ifPosts400}
  118. }
  119.  
  120. #sidebar img {
  121. width: 60px;
  122. height: 60px;
  123. padding: 30px;
  124. background-color: {color:sidebar};
  125. }
  126.  
  127. #title {
  128. position: fixed;
  129. max-height: 25px;
  130. font-family:'IM Fell Great Primer', serif;
  131. font-size: 18px;
  132. font-style: italic;
  133. text-align: center;
  134. width: 120px;
  135. margin-top: -20px;
  136. overflow: hidden;
  137. }
  138.  
  139. #title a {
  140. color: {color:text};
  141. }
  142.  
  143. #description {
  144. width: 90px;
  145. padding: 15px;
  146. margin-top: 5px;
  147. margin-left: 0px;
  148. font-family: Palatino Linotype;
  149. font-size: 9px;
  150. color: white;
  151. text-align: justify;
  152. text-indent: 15px;
  153. font-style: italic;
  154. background-color: {color:description};
  155. }
  156.  
  157. #nav {
  158. position: absolute;
  159. width: 180px;
  160. margin-top: -1px;
  161. margin-left: -185px;
  162. background-color: transparent;
  163. color: ;
  164. }
  165.  
  166. #nav a {
  167. z-index:9999;
  168. float: right;
  169. display: inline-block;
  170. width: 6px;
  171. height: 6px;
  172. margin-left: 5px;
  173. margin-top: 1px;
  174. background-color: {color:navigation};
  175. font-family: arial;
  176. font-size: 7px;
  177. text-align: center;
  178. line-height: 20px;
  179. overflow: hidden;
  180. -webkit-transition: all 0.3s ease-in-out;
  181. -moz-transition: all 0.3s ease-in-out;
  182. -o-transition: all 0.3s ease-in-out;
  183. transition: all 0.3s ease-in-out;
  184. }
  185.  
  186. #nav a:hover {
  187. -webkit-border-radius: 6px;
  188. -moz-border-radius: 6px;
  189. -o-border-radius: 6px;
  190. border-radius: 6px;
  191. -webkit-transition: all 0.3s ease-in-out;
  192. -moz-transition: all 0.3s ease-in-out;
  193. -o-transition: all 0.3s ease-in-out;
  194. transition: all 0.3s ease-in-out;
  195. }
  196.  
  197. #pagin {
  198. width: 120px;
  199. text-align: center;
  200. margin-top: -3px;
  201. }
  202.  
  203. #pagin a {
  204. color: {color:text};
  205. text-align: right;
  206. }
  207.  
  208. .question {
  209. {block:ifPosts500}width: 480px;{/block:ifPosts500}
  210. {block:ifPosts400}width: 380px;{/block:ifPosts400}
  211. margin-top: -5px;
  212. padding: 10px;
  213. background-color: #fbfbfb;
  214. }
  215.  
  216. .quote {
  217. font-family: 'IM Fell Great Primer', serif;
  218. font-size: 12px;
  219. font-style: italic;
  220. font-weight: none;
  221. }
  222.  
  223. #tags {
  224. {block:ifPosts500}width: 500px;{/block:ifPosts500}
  225. {block:ifPosts400}width: 400px;{/block:ifPosts400}
  226. margin-top: 5px;
  227. padding-top: 3px;
  228. border-top: 1px solid {color:info};
  229. font-family: arial;
  230. font-size: 8px;
  231. letter-spacing: 1px;
  232. }
  233.  
  234. #info {
  235. position: absolute;
  236. {block:ifPosts500}margin-left: 535px;{/block:ifPosts500}
  237. {block:ifPosts400}margin-left: 435px;{/block:ifPosts400}
  238. margin-top: -30px;
  239. padding: 7px;
  240. font-size: 7px;
  241. text-align: left;
  242. line-height: 9px;
  243. {block:IndexPage}background-color: #ffffff;{/block:IndexPage}
  244. {block:PermalinkPage}background-color: transparent;{/block:PermalinkPage}
  245. {block:IndexPage}opacity: 0;{/block:IndexPage}
  246. {block:PermalinkPage}opacity:1;{/block:PermalinkPage}
  247. -webkit-transition: all 0.2s ease-out;
  248. -moz-transition: all 0.2s ease-out;
  249. -o-transition: all 0.2s ease-out;
  250. transition: all 0.2s ease-out;
  251. }
  252.  
  253. #info a {
  254. color:{color:text};
  255. }
  256.  
  257. #info a:hover {
  258. color:{color:link hover};
  259. }
  260.  
  261. #posts:hover #info {
  262. opacity: 1;
  263. -webkit-transition: all 0.3s ease-in;
  264. -moz-transition: all 0.3s ease-in;
  265. -o-transition: all 0.3s ease-in;
  266. transition: all 0.3s ease-in;
  267. }
  268.  
  269. #mg {
  270. position: fixed;
  271. right: 7px;
  272. bottom: 10px;
  273. padding: 6px;
  274. font-family: calibri;
  275. font-size: 9px;
  276. line-height: 8px;
  277. text-align: center;
  278. text-transform: uppercase;
  279. background-color: {color:scrollbar};
  280. -webkit-transition: all 0.2s ease-in;
  281. -moz-transition: all 0.2s ease-in;
  282. -o-transition: all 0.2s ease-in;
  283. transition: all 0.2s ease-in;
  284. }
  285.  
  286. #mg a {
  287. color: #ffffff;
  288. }
  289.  
  290. #mg:hover {
  291. background-color: {color:background};
  292. -webkit-transition: all 0.2s ease-in;
  293. -moz-transition: all 0.2s ease-in;
  294. -o-transition: all 0.2s ease-in;
  295. transition: all 0.2s ease-in;
  296. }
  297.  
  298. #mg:hover a {
  299. color: {color:scrollbar};
  300. }
  301.  
  302. .aart {
  303. position: absolute;
  304. }
  305.  
  306. .aart img {
  307. width: 80px;
  308. height: 80px;
  309. }
  310.  
  311. .aplayer {
  312. display: block;
  313. position: absolute;
  314. }
  315.  
  316. .audio {
  317. overflow: hidden;
  318. width: 27px;
  319. height: 28px;
  320. margin-top: 26px;
  321. margin-left: 26px;
  322. }
  323.  
  324. .ainfo {
  325. {block:ifPosts500}width: 420px;{/block:ifPosts500}
  326. {block:ifPosts400}width: 320px;{/block:ifPosts400}
  327. height: 47px;
  328. margin-left: 80px;
  329. padding-top: 33px;
  330. background-color: #f6f6f6;
  331. text-align: center;
  332. }
  333.  
  334. h1 {
  335. font-family: arial;
  336. font-size: 8px;
  337. text-decoration: none;
  338. font-style: none;
  339. font-weight: normal;
  340. letter-spacing: 2px;
  341. text-transform: uppercase;
  342. border-bottom: 1px solid {color:info};
  343. padding-bottom: 5px;
  344. padding-left: 10px;
  345. }
  346.  
  347. h2 {
  348. font-family: arial;
  349. font-size: 8px;
  350. text-decoration: none;
  351. font-style: none;
  352. font-weight: normal;
  353. letter-spacing: 2px;
  354. text-align: right;
  355. text-transform: uppercase;
  356. padding-bottom: 2px;
  357. margin-right: 10px;
  358. }
  359.  
  360. blockquote {
  361. border-left: 1px solid {color:info};
  362. padding-left: 10px;
  363. margin-left: 10px;
  364. }
  365.  
  366. blockquote img {
  367. {block:ifPosts500}max-width: 480px;{/block:ifPosts500}
  368. {block:ifPosts400}max-width: 380px;{/block:ifPosts400}
  369. }
  370.  
  371. ul, ol, li {list-style: square;}
  372.  
  373. .notes {
  374. {block:ifPosts500}width: 500px;{/block:ifPosts500}
  375. {block:ifPosts400}width: 400px;{/block:ifPosts400}
  376. padding: 10px;
  377. line-height: 10px;
  378. margin-top: 5px;
  379. }
  380.  
  381. ol.notes, .notes li {
  382. {block:ifPosts500}width: 500px;{/block:ifPosts500}
  383. {block:ifPosts400}width: 400px;{/block:ifPosts400}
  384. list-style: none;
  385. padding-bottom: 5px;
  386. }
  387.  
  388. .notes img {
  389. width: 10px;
  390. padding-right: 5px;
  391. }
  392.  
  393. </style>
  394.  
  395. <script type="text/javascript" src="http://static.tumblr.com/bmdsqsc/8mXm7q8vn/jquery.js"></script>
  396. <script type="text/javascript" src="http://static.tumblr.com/bmdsqsc/ogWm7q8w1/lazyload.js"></script>
  397. <script type="text/javascript" charset="utf-8">
  398. var $j = jQuery.noConflict();
  399. $j(function() {
  400. if (navigator.platform == "iPad" || navigator.platform == "iPhone") return;
  401. $j("img").lazyload({
  402. placeholder : "http://static.tumblr.com/twte3d7/RSvlio0k5/grey.gif",
  403. effect: "fadeIn",
  404. });
  405. });
  406. </script>
  407.  
  408.  
  409. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  410. <script src="http://static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script>
  411. <script>
  412. (function($){
  413. $(document).ready(function(){
  414. $("a[title]").style_my_tooltips({
  415. tip_follows_cursor:true,
  416. tip_delay_time:90,
  417. tip_fade_speed:600,
  418. attribute:"title"
  419. });
  420. });
  421. })(jQuery);
  422. </script>
  423.  
  424.  
  425. </head>
  426. <body>
  427.  
  428. <div id="sidebar">
  429. <div id="title"><a href="/">{text:title}</a></div>
  430. <div id="nav">
  431. <a href="{text:link 1}" title="{text:link 1 title}"></a><br>
  432. <a href="{text:link 2}" title="{text:link 2 title}"></a><br>
  433. {block:iflink3}<a href="{text:link 3}" title="{text:link 3 title}"></a><br>{/block:iflink3}
  434. {block:iflink4}<a href="{text:link 4}" title="{text:link 4 title}"></a><br>{/block:iflink4}
  435. {block:iflink5}<a href="{text:link 5}" title="{text:link 5 title}"></a><br>{/block:iflink5}
  436. {block:iflink6}<a href="{text:link 6}" title="{text:link 6 title}"></a>{/block:iflink6}</div>
  437. <img src="{image:sidebar}"/>
  438. <div id="description">{Description}</div>
  439. <div id="pagin">
  440. {block:Pagination}
  441. {block:PreviousPage}<a href="{PreviousPage}"><font size="2">&laquo;</font> </a>{/block:PreviousPage}{block:NextPage}<a href="{NextPage}"><font size="2">&raquo;</font></a>{/block:NextPage}
  442. {/block:Pagination}
  443. </div>
  444. </div>
  445.  
  446. <div id="mg"><a href="http://midthemes.tumblr.com/" target="_blank">theme</a></div>
  447.  
  448. <div id="content">
  449. {block:Posts}
  450. <div id="posts">
  451.  
  452.  
  453. <div id="info">
  454. {block:Date}<a href="{Permalink}"><font color="{color:link}">{DayOfMonthWithZero}.{MonthNumberWithZero}.{ShortYear}</font></a>{/block:Date}{block:NoteCount}<br><a href="{Permalink}">{NoteCountWithLabel}</a> {/block:NoteCount}<br>
  455. {block:RebloggedFrom}<a href="{ReblogParentURL}">via</a>{block:ContentSource}<a href="{SourceURL}"> / source</a>{/block:ContentSource}{/block:RebloggedFrom}
  456.  
  457. </div>
  458.  
  459. {block:Text}{block:Title}<h1>{Title}</h1>{/block:Title}{Body}{/block:Text}
  460.  
  461. {block:Photo}
  462. {LinkOpenTag}
  463. {block:ifPosts500}<img src="{PhotoURL-500}" width="500px" alt="{PhotoAlt}"/>{/block:ifPosts500}
  464. {block:ifPosts400}<img src="{PhotoURL-500}" width="400px" alt="{PhotoAlt}"/>{/block:ifPosts400}
  465. {LinkCloseTag}
  466. {block:Caption}{Caption}{/block:Caption}
  467. {/block:Photo}
  468.  
  469. {block:Photoset}
  470. {block:ifPosts500}{Photoset-500}{/block:ifPosts500}
  471. {block:ifPosts400}{Photoset-400}{/block:ifPosts400}
  472. {block:Caption}{Caption}{/block:Caption}
  473. {/block:Photoset}
  474.  
  475. {block:Quote}
  476. <div class="quote">&rdquo;{Quote}</div>
  477. {block:Source}<div style="text-align:right" />- {Source}</div>{/block:Source}
  478. {/block:Quote}
  479.  
  480. {block:Link}
  481. <a href="{URL}" target="_blank" /><h1>{Name}</h1></a>
  482. {block:Description}{Description}{/block:Description}
  483. {/block:Link}
  484.  
  485. {block:Chat}
  486. {Title}
  487. {block:Lines}
  488. {block:Label}
  489. {Label}
  490. {/block:Label}
  491. {Line}<br>
  492. {/block:Lines}
  493. {/block:Chat}
  494.  
  495. {block:Audio}
  496. {block:AlbumArt}<div class="aart"><img src="{AlbumArtURL}"/></div>{/block:AlbumArt}
  497. <div class="aplayer"><div class="audio">{AudioPlayerWhite}</div></div>
  498. <div class="ainfo">{block:TrackName}{TrackName}{/block:TrackName}
  499. {block:Artist} by <b>{Artist}</b>{/block:Artist}</div>
  500. {block:Caption}{Caption}{/block:Caption}
  501. {/block:Audio}
  502.  
  503. {block:Video}
  504. {block:ifPosts500}{Video-500}{/block:ifPosts500}
  505. {block:ifPosts400}{Video-400}{/block:ifPosts400}
  506. {block:Caption}{Caption}{/block:Caption}
  507. {/block:Video}
  508.  
  509. {block:Answer}
  510. <h2>{Asker}</h2><div class="question">{Question}</div>
  511. {Answer}
  512. {/block:Answer}
  513.  
  514. <div id="tags">
  515.  
  516. {block:HasTags}{block:Tags}<a href="{TagURL}">{Tag}</a>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;{/block:Tags}{/block:HasTags}
  517.  
  518. </div>
  519.  
  520. {block:PermalinkPage}{block:PostNotes}{PostNotes}{/block:PostNotes}{/block:PermalinkPage}
  521.  
  522. </div>
  523. {/block:Posts}
  524. </div>
  525.  
  526. </body>
  527.  
  528. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement