Advertisement
midthemes

Theme 06 by Jenny

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