API tools faq
paste
Advertisement
midthemes

Theme 02 by Jenny

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