hamibal

Theme #4 w/ tags

May 15th, 2014
444
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 11.54 KB | None | 0 0
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  3. <head>
  4.  
  5. <!-- this is my LITHIUM theme. If you need help with anything feel free to message me @ hamibal.tumblr.com/ask.
  6.  
  7. If you're familiar with coding you may customise this but !!!PLEASE DO NOT REMOVE MY CREDIT!!! Thank you!-->
  8.  
  9.  
  10. {block:Description}
  11. <meta name="description" content="{MetaDescription}" />
  12. {/block:Description}
  13. <meta charset="utf-8">
  14. <meta name="viewport" content="initial-scale=1.0, width=device-width" />
  15. <title>{block:TagPage}{Tag} posts - {/block:TagPage} {block:SearchPage}{lang:Search results for SearchQuery} - {/block:SearchPage}{block:PostSummary}{PostSummary} - {/block:PostSummary}{Title}</title>
  16. <link rel="shortcut icon" href="{Favicon}">
  17. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  18. <link href="http://static.tumblr.com/wgijwsy/k1Hm9ei8b/normalize.css" rel="stylesheet" type="text/css" />
  19.  
  20.  
  21.  
  22. <meta name="color:scrollbar" content="#000000" />
  23. <meta name="color:scrollbar background" content="#ffffff" />
  24. <meta name="color:background" content="#ffffff"/>
  25. <meta name="color:title" content="#000000"/>
  26. <meta name="color:text" content="#7b7b7b"/>
  27. <meta name="color:link" content="#7b7b7b"/>
  28. <meta name="color:link hover" content="#000000"/>
  29. <meta name="color:askbg" content="#eaeaea"/>
  30. <meta name="color:tags" content="#7b7b7b"/>
  31.  
  32. <meta name="font:body" content="Helvetica"/>
  33.  
  34. <meta name="text:Link1" content="" />
  35. <meta name="text:Link1 text" content="" />
  36. <meta name="text:Link2" content="" />
  37. <meta name="text:Link2 text" content="" />
  38. <meta name="text:Link3" content="" />
  39. <meta name="text:Link3 text" content="" />
  40. <meta name="text:Link4" content="" />
  41. <meta name="text:Link4 text" content="" />
  42. <meta name="text:Link5" content="" />
  43. <meta name="text:Link5 text" content="" />
  44.  
  45.  
  46.  
  47. <script type="text/javascript" src="http://static.tumblr.com/bmdsqsc/8mXm7q8vn/jquery.js"></script>
  48. <script type="text/javascript" src="http://static.tumblr.com/bmdsqsc/ogWm7q8w1/lazyload.js"></script>
  49. <script type="text/javascript" charset="utf-8">
  50. var $j = jQuery.noConflict();
  51. $j(function() {
  52. if (navigator.platform == "iPad" || navigator.platform == "iPhone") return;
  53. $j("img").lazyload({
  54. placeholder : "http://static.tumblr.com/twte3d7/RSvlio0k5/grey.gif",
  55. effect: "fadeIn",
  56. });
  57. });
  58. </script>
  59.  
  60. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  61.  
  62. <script src="http://static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script>
  63.  
  64. <script>
  65.  
  66. (function($){
  67.  
  68. $(document).ready(function(){
  69.  
  70. $("a[title]").style_my_tooltips({
  71.  
  72. tip_follows_cursor:true,
  73.  
  74. tip_delay_time:30,
  75.  
  76. tip_fade_speed:300,
  77.  
  78. attribute:"title"
  79.  
  80. });
  81.  
  82. });
  83.  
  84. })(jQuery);
  85.  
  86. </script>
  87.  
  88.  
  89. <style>
  90.  
  91. #s-m-t-tooltip{
  92. position:absolute;
  93. margin-top: 15px;
  94. z-index:9999;
  95. background:#fff;
  96. color:{color:text};
  97. text-transform:lowercase;
  98. padding:3px 4px;
  99. line-height:10px;
  100. font-size:10px;
  101. font-family: helvetica;
  102. letter-spacing: -0.5px;
  103. -webkit-transition:all 0.3s;
  104. -moz-transition:all 0.3s;
  105. -ms-transition:all 0.3s;
  106. -o-transition:all 0.3s;
  107. transition:all 0.3s;
  108. }
  109.  
  110. ::-webkit-scrollbar {width: 5px; height: 3px; background:{color:scrollbar background};}
  111. ::-webkit-scrollbar-thumb {background-color:{color:scrollbar} ;}
  112.  
  113. body{
  114. background: {color:background};
  115. color: {color:text};
  116. font-family: {font:body};
  117. font-size: 11px;
  118. line-height: 96%;
  119. letter-spacing: 96%; }
  120.  
  121. #post .tags {
  122. opacity: 0;
  123. height: 0;
  124. -webkit-transition: all 0.5s ease;
  125. -moz-transition: all 0.5s ease;
  126. -o-transition: all 0.5s ease;
  127. -ms-transition: all 0.5s ease;
  128. transition: all 0.5s ease;
  129. }
  130.  
  131. #post:hover .tags {
  132. opacity: 1;
  133. height: auto;
  134. -webkit-transition: all 0.5s ease;
  135. -moz-transition: all 0.5s ease;
  136. -o-transition: all 0.5s ease;
  137. -ms-transition: all 0.5s ease;
  138. transition: all 0.5s ease;
  139. }
  140.  
  141. b{
  142. font-weight:bold;}
  143.  
  144.  
  145.  
  146. em, italic {
  147. font-style:italic;}
  148.  
  149. a {
  150. color:{color:link};
  151. text-decoration:none;
  152. -webkit-transition: all 0.5s ease;
  153. -moz-transition: all 0.5s ease;
  154. -o-transition: all 0.5s ease;
  155. -ms-transition: all 0.5s ease;
  156. transition: all 0.5s ease; }
  157.  
  158. a:hover {
  159. color:{color:link hover};
  160. text-decoration:underline;}
  161.  
  162. h1 {
  163. font-family: {font:body};
  164. font-size: 17px;
  165. margin-bottom: 5px;
  166. font-weight: bold;
  167. font-style: italic;
  168. letter-spacing: -0.5;
  169. color: {color:title};}
  170.  
  171.  
  172. h2 {
  173. font-family: {font:body};
  174. font-size: 15px;
  175. margin-bottom: 5px;
  176. font-weight: bold;
  177. font-style: italic;
  178. letter-spacing: -0.5;
  179. color: {color:title};}
  180.  
  181. h3 {
  182. font-family: {font:body};
  183. font-size: 10px;
  184. font-weight: bold;
  185. color: {color:title};}
  186.  
  187. #content {
  188. position:relative;
  189. margin-left:auto;
  190. margin-right:auto;
  191. margin-top: 100px;
  192. width:400px;
  193. text-align:justify;
  194. padding:0px;
  195. font-size: 11px;
  196. line-height: 12px;}
  197.  
  198. #post {
  199. margin-bottom: 110px;
  200. margin-left:auto;
  201. margin-right:auto;
  202. width:400px;
  203. padding:0px;
  204. }
  205.  
  206. #post img{
  207. max-width:400px;
  208. padding: 0px;
  209. }
  210.  
  211.  
  212. #header {
  213. width:400px;
  214. margin-left:auto;
  215. margin-right:auto;
  216. margin-top:100px;
  217. background: {color:background};
  218. padding: 0px;}
  219.  
  220.  
  221. bold {
  222. font-family: {font:body};
  223. font-size: 20px;
  224. color: {color:h1 color};
  225. text-align: right;
  226. font-weight: bold;}
  227.  
  228.  
  229.  
  230. strong {
  231. font-weight: bold;}
  232.  
  233.  
  234.  
  235. div.description {
  236. font-family: {font:body};
  237. font-size: 10px;
  238. color: {color:h1 color};
  239. margin-top: 0px;
  240. text-align: justify;
  241. margin-bottom: 5px;
  242. width: 400px;
  243. text-align:right;
  244. }
  245.  
  246. #nav {
  247. font-style: none;
  248. }
  249.  
  250. #nav a{
  251. color: {color:link};
  252. -webkit-transition-duration: .0s;
  253. -webkit-transition: all 0.5s ease;
  254. -moz-transition: all 0.5s ease;
  255. -o-transition: all 0.5s ease;
  256. -ms-transition: all 0.5s ease;
  257. transition: all 0.5s ease;
  258. margin-left: 0px;
  259. font-size: 10px;
  260. text-align: right;
  261. margin-top: 10px;
  262. cursor:help;
  263. }
  264.  
  265. #nav a:hover{
  266. color: {color:link hover};
  267. -webkit-transition: all 0.5s ease;
  268. -moz-transition: all 0.5s ease;
  269. -o-transition: all 0.5s ease;
  270. -ms-transition: all 0.5s ease;
  271. transition: all 0.5s ease; }
  272.  
  273. div.notes { padding:5px;
  274. margin: 10px 0;
  275. float:right;
  276. text-align: center;
  277. font-size: 8px;
  278. padding: 1px;
  279. line-height: 10px;
  280. letter-spacing: 1px; }
  281.  
  282. div.notes a {
  283. color:{color:link}; border:none;
  284. -webkit-transition: all 0.8s ease;
  285. -moz-transition: all 0.8s ease;
  286. -o-transition: all 0.8s ease;
  287. -ms-transition: all 0.8s ease;
  288. transition: all 0.8s ease;}
  289.  
  290. div.notes:hover a {
  291. color:{color:linkhover};
  292. border:none;}
  293.  
  294.  
  295. #ask {
  296. margin-right:0px;}
  297.  
  298.  
  299. #question {
  300. background-color: {color:askbg};
  301. color:{color:text};
  302. text-align:right;
  303. padding-bottom: 10px;
  304. padding-right: 5px;
  305. width: 400px;
  306. padding-top: 10px;}
  307.  
  308.  
  309. #quote {
  310. font-family:{font:body};
  311. line-height: 15px;
  312. letter-spacing: -0.5px;
  313. font-weight:bold;
  314. font-size:15px; }
  315.  
  316. #important {
  317. font-weight: bold;
  318. letter-spacing: -1px;
  319. bottom:20px;
  320. right:20px;
  321. position:fixed;}
  322.  
  323. #pagination {
  324. font-size: 10px;
  325. margin-bottom: 5px;
  326. text-align: center;
  327. font-weight: bold;
  328. width: 400px;}
  329.  
  330. .tags {
  331. margin-top: -100px;
  332. display: block;
  333. padding-bottom: 50px;
  334. text-align:right;
  335. text-transform:lowercase;
  336. font-size:8px;
  337. font-style:none;
  338. color:{color:tags};
  339. background-color: {color:background};
  340. -webkit-transition: all 0.8s ease;
  341. -moz-transition: all 0.8s ease;
  342. -o-transition: all 0.8s ease;
  343. -ms-transition: all 0.8s ease;
  344. transition: all 0.8s ease; }
  345.  
  346.  
  347. .tags a:hover {
  348. color:{color:linkhover};
  349. -webkit-transition: all 0.8s ease;
  350. -moz-transition: all 0.8s ease;
  351. -o-transition: all 0.8s ease;
  352. -ms-transition: all 0.8s ease;
  353. transition: all 0.8s ease; }
  354.  
  355. </style>
  356. </head>
  357. <body>
  358.  
  359. <div id="important">
  360. <a href="http://hamibal.tumblr.com/">HM</a></div>
  361.  
  362.  
  363. <div id="header">
  364. <h2>{Title}</h2>
  365. <div id="nav">
  366. {block:ifLink1}<a href="{text:Link1}">{text:Link1 text}</a>{/block:ifLink1}
  367. {block:ifLink2} / <a href="{text:Link2}">{text:Link2 text}</a>{/block:ifLink2}
  368. {block:ifLink3} / <a href="{text:Link3}">{text:Link3 text}</a>{/block:ifLink3}
  369. {block:ifLink4} / <a href="{text:Link4}">{text:Link4 text}</a>{/block:ifLink4}
  370. {block:ifLink5} / <a href="{text:Link5}">{text:Link5 text}</a>{/block:ifLink5}
  371.  
  372.  
  373. </div><hr />
  374. <div class="description">
  375. {Description}
  376. </div>
  377.  
  378.  
  379.  
  380. </div>
  381.  
  382.  
  383.  
  384. <div id="content">{block:Posts}<div id="post">
  385. {block:NoteCount}<div class="notes"> <a href="{Permalink}">+{NoteCount}</a></div> {/block:NoteCount}
  386.  
  387. {block:Text}<h1>{block:Title}{Title}{/block:Title}</h1>{Body}{/block:Text}
  388.  
  389. {block:Photo}{LinkOpenTag}<img src="{PhotoURL-400}">{LinkCloseTag}{block:Caption}{Caption}{/block:Caption}{/block:Photo}
  390.  
  391. {block:Photoset}{Photoset-400}{block:Caption}{Caption}{/block:Caption}{/block:Photoset}
  392.  
  393. {block:Quote}<div id="quote">"{Quote}"</div>{block:Source} —{Source}{/block:Source}{/block:Quote}
  394.  
  395. {block:Link}<h1><a href="{URL}" {Target}>{Name}</a></h1>{block:Description}{Description}{/block:Description}{/block:Link}
  396.  
  397. {block:Chat}{block:Title}<h1>{Title}</h1>{/block:Title}{block:Lines}{block:Label}<b>{Label}</b>{/block:Label} {Line}<br>{/block:Lines}{/block:Chat}
  398.  
  399. {block:Audio}{AudioPlayerWhite}{block:Caption}{Caption}{/block:Caption}{/block:Audio}
  400.  
  401. {block:Video}{Video-400}{block:Caption}{Caption}{/block:Caption}{/block:Video}
  402.  
  403. {block:Answer}<div id="ask"></div><b>{Asker}</b> asked:<br><div id="question">{Question}</div>{Answer}{/block:Answer}
  404. </div>
  405. <div class="tags">{block:HasTags}{block:Tags} #<a href="{TagURL}" style="color:{color:tags};">{Tag}</a>{/block:Tags}{/block:HasTags}
  406. </div>
  407.  
  408. {block:PermalinkPage}<div style="border-top:solid 1px #eee;padding-top:3px;">
  409. {block:RebloggedFrom}<a href="{ReblogParentURL}"
  410. title="{ReblogParentName}">source</a> / <a href="{ReblogRootURL}"title="{ReblogRootName}">via</a>{/block:RebloggedFrom}<br><br /> {block:HasTags}{block:Tags}#<a href="{TagURL}"><small>{Tag} </small></a>{/block:Tags}{/block:HasTags}<br /><br /></div>
  411. {/block:PermalinkPage}
  412.  
  413. {block:PostNotes}{PostNotes}{/block:PostNotes}
  414.  
  415. {/block:Posts}
  416.  
  417. {block:Pagination}
  418. <div id="pagination">
  419. {block:PreviousPage}
  420. <a href="{PreviousPage}">&larr; Previous</a>
  421. {/block:PreviousPage}{block:NextPage}
  422. <a href="{NextPage}"> Next &rarr;</a>
  423. {/block:NextPage}
  424. </div>
  425. {/block:Pagination}
  426.  
  427. </div>
  428. </div>
  429.  
  430. </body></html>
Advertisement
Add Comment
Please, Sign In to add comment