Advertisement
dracares

theme 10 - dracares

Apr 18th, 2014
3,350
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 11.74 KB | None | 0 0
  1. <!DOCTYPE html><head>
  2. <title>{Title}</title>
  3. <link rel="shortcut icon" href="{Favicon}">
  4. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  5. <link href='http://fonts.googleapis.com/css?family=Lato:300,400,700' rel='stylesheet' type='text/css'>
  6. {block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}
  7.  
  8. <!--
  9.  
  10. theme by dracares.tumblr.com
  11.  
  12. like the usual, don't remove the credit or use this theme as base
  13.  
  14. also don't move the credit anywhere keep it in that bottom right corner
  15.  
  16. please
  17.  
  18. and thank u for using my themes :))
  19.  
  20. -->
  21.  
  22. <meta name="color:Background" content="#ffffff"/>
  23. <meta name="color:Text" content="#000000"/>
  24. <meta name="color:Link" content="#101010"/>
  25. <meta name="color:Link Hover" content="#eeeeee"/>
  26. <meta name="color:Details" content="#fcfcfc"/>
  27. <meta name="color:Border" content="#eeeeee"/>
  28.  
  29. <meta name="image:Header" content=""/>
  30.  
  31. <meta name="text:Link 1" content=""/>
  32. <meta name="text:Link 1 URL" content=""/>
  33. <meta name="text:Link 2" content=""/>
  34. <meta name="text:Link 2 URL" content=""/>
  35. <meta name="text:Link 3" content=""/>
  36. <meta name="text:Link 3 URL" content=""/>
  37. <meta name="text:Link 4" content=""/>
  38. <meta name="text:Link 4 URL" content=""/>
  39.  
  40. <style type="text/css">
  41.  
  42. /*hover link title*/
  43.  
  44. #s-m-t-tooltip{
  45. position:absolute;
  46. margin-top:15px;
  47. z-index:9999;
  48. font-size:7px;
  49. text-transform:uppercase;
  50. letter-spacing:1px;
  51. padding:0px 8px;
  52. background:{color:Details};
  53. }
  54.  
  55. /*basics*/
  56.  
  57. body {
  58. background:{color:Background};
  59. color:{color:Text};
  60. font-family:Helvetica, Arial, sans-serif;
  61. font-size:11px;
  62. text-align:justify;
  63. margin:0;
  64. line-height:22px;
  65. }
  66.  
  67. small {
  68. font-size:9px;
  69. }
  70.  
  71. big {
  72. font-size:12px;
  73. }
  74.  
  75. a {
  76. color:{color:Link};
  77. text-decoration:none;
  78. -webkit-transition:all 0.3s;
  79. -moz-transition:all 0.3s;
  80. -ms-transition:all 0.3s;
  81. -o-transition:all 0.3s;
  82. transition:all 0.3s;
  83. }
  84.  
  85. a:hover {
  86. text-shadow:1px 1px 1px {color:Link Hover};
  87. }
  88.  
  89. img{
  90. opacity:1;
  91. border:none;
  92. text-decoration:none;
  93. }
  94.  
  95. /*scrollbar*/
  96.  
  97. ::-webkit-scrollbar {
  98. width:7px;
  99. background:{color:Background};
  100. border-left:1px solid {color:Border};
  101. }
  102.  
  103. ::-webkit-scrollbar-thumb {
  104. background:{color:Background};
  105. }
  106.  
  107. /*posts*/
  108.  
  109. #entries {
  110. margin:370px auto 120px;
  111. width:400px;
  112. }
  113.  
  114. #posts {
  115. width:400px;
  116. margin-top:75px;
  117. }
  118.  
  119. .captions {
  120. margin-top:-10px;
  121. padding:5px 15px 10px;
  122. max-width:400px;
  123. }
  124.  
  125. blockquote {
  126. padding:0px 0px 0px 15px;
  127. border-left:1px solid {color:Border};
  128. margin-left:15px;
  129. }
  130.  
  131. blockquote img {
  132. max-width:300px;
  133. }
  134.  
  135. /*header*/
  136.  
  137. #header {
  138. width:500px;
  139. height:200px;
  140. margin:0px auto 60px;
  141. padding:40px 0 10px;
  142. }
  143.  
  144. #headerimage {
  145. width:500px;
  146. margin:40px auto 0;
  147. }
  148.  
  149. #headerimage img {
  150. width:100%;
  151. max-height:250px;
  152. }
  153.  
  154. #headertext {
  155. width:400px;
  156. margin:20px auto 0;
  157. }
  158.  
  159. #blogtitle {
  160. font-size:18px;
  161. font-family:'Lato', sans-serif;
  162. font-weight:300;
  163. text-transform:uppercase;
  164. letter-spacing:4px;
  165. margin-left:-3px;
  166. }
  167.  
  168. #description {
  169. font-size:10px;
  170. font-family:'Lato', sans-serif;
  171. padding:20px 0 0;
  172. font-weight:300;
  173. text-transform:uppercase;
  174. }
  175.  
  176. #linkstick {
  177. background:{color:Background};
  178. padding:30px 0;
  179. position:absolute;
  180. width:100%;
  181. top:490px;
  182. left:0;
  183. margin:0 auto;
  184. z-index:9999;
  185. }
  186.  
  187. #links {
  188. font-size:9px;
  189. font-family:'Lato', sans-serif;
  190. letter-spacing:2px;
  191. font-weight:300;
  192. text-align:center;
  193. text-transform:uppercase;
  194. }
  195.  
  196. #links a {
  197. display:inline-block;
  198. border-bottom:1px solid {color:Border};
  199. }
  200.  
  201. /*pagination*/
  202.  
  203. #pagination {
  204. text-align:right;
  205. border-top:1px solid {color:Border};
  206. padding-top:4px;
  207. width:400px;
  208. margin:-20px auto 160px;
  209. font-size:9px;
  210. letter-spacing:1px;
  211. }
  212.  
  213. #pagination a {
  214. padding:9px 10px;
  215. }
  216.  
  217. #pagination a.currentpage {
  218. border-top:2px solid {color:Text};
  219. padding:9px 10px;
  220. }
  221.  
  222. /*main text*/
  223.  
  224. #title {
  225. font-size:14px;
  226. letter-spacing:1px;
  227. margin-bottom:10px;
  228. padding-left:25px;
  229. text-transform:uppercase;
  230. font-family:'Lato', sans-serif;
  231. font-weight:300;
  232. }
  233.  
  234. #title:before {
  235. content:"";
  236. background:{color:Text};
  237. position:absolute;
  238. margin:11px -25px;
  239. width:20px;
  240. height:1px;
  241. }
  242.  
  243. /*quotes*/
  244.  
  245. #titlequote {
  246. width:300px;
  247. margin:auto;
  248. font-size:12px;
  249. padding:0 0 10px;
  250. }
  251.  
  252. #source {
  253. padding:10px 0;
  254. font-size:8px;
  255. letter-spacing:1px;
  256. text-transform:uppercase;
  257. border-top:1px solid {color:Border};
  258. text-align:center;
  259. }
  260.  
  261. /*audio*/
  262.  
  263. .audioposts {
  264. margin-bottom:5px;
  265. }
  266.  
  267. .audioinfo {
  268. font-size:9px;
  269. max-height:76px;
  270. max-width:400px;
  271. line-height:20px;
  272. text-align:right;
  273. padding:19px;
  274. background:{color:Details};
  275. }
  276.  
  277. .aplayer {
  278. margin-left:0px;
  279. margin-top:0px;
  280. padding:2px;
  281. overflow:hidden;
  282. }
  283.  
  284. .player {
  285. width:32px;
  286. height:32px;
  287. background:#fff;
  288. margin-top:23px;
  289. margin-left:23px;
  290. position:absolute;
  291. opacity:0.7;
  292. -webkit-transition:all 0.3s;
  293. -moz-transition:all 0.3s;
  294. -ms-transition:all 0.3s;
  295. -o-transition:all 0.3s;
  296. transition:all 0.3s;
  297. }
  298.  
  299. .player:hover {
  300. opacity:0.9;
  301. }
  302.  
  303. /*asks*/
  304.  
  305. .questions {
  306. padding:0 10px 10px;
  307. border-bottom:1px solid {color:Border};
  308. }
  309.  
  310. .asker {
  311. text-align:right;
  312. font-size:8px;
  313. text-transform:uppercase;
  314. letter-spacing:1px;
  315. padding:5px 0px 0px;
  316. }
  317.  
  318. .answers {
  319. padding:10px 10px 0;
  320. }
  321.  
  322. /*chat*/
  323.  
  324. #chat {
  325. margin-bottom:-50px;
  326. }
  327.  
  328. .chat ol {
  329. padding:0;
  330. margin-left:0px;
  331. list-style:none;
  332. }
  333.  
  334. .line {
  335. padding:5px 0;
  336. }
  337.  
  338. .label {
  339. font-weight:bold;
  340. }
  341.  
  342. /*permalink & notes*/
  343.  
  344. #info {
  345. text-align:center;
  346. font-size:9px;
  347. padding:5px 0;
  348. line-height:16px;
  349. }
  350.  
  351. #tags {
  352. }
  353.  
  354. span.tag2 {
  355. display:none;
  356. }
  357.  
  358. a.tag + span.tag2 {
  359. display:inline;
  360. }
  361.  
  362. /*notes*/
  363.  
  364. ol {
  365. list-style-type:none;
  366. text-align:justify;
  367. font-size:8px;
  368. text-transform:uppercase;
  369. letter-spacing:1px;
  370. width:400px;
  371. margin:60px -40px;
  372. }
  373.  
  374. ol.notes li {
  375. padding-bottom:10px;
  376. width:400px;
  377. }
  378.  
  379. ol.notes li img, .x {
  380. display:none !important;
  381. }
  382.  
  383. /*don't remove the credits -- be a cool person*/
  384.  
  385. #credit {
  386. font-size:9px;
  387. position:fixed;
  388. bottom:5px;
  389. right:5px;
  390. letter-spacing:1px;
  391. }
  392.  
  393. #credit a {
  394. color:#ddd;
  395. }
  396.  
  397. #credit a:hover {
  398. color:{color:Text};
  399. text-decoration:none;
  400. }
  401.  
  402. {CustomCSS}</style>
  403.  
  404. <!--Javascripts-->
  405.  
  406. <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
  407.  
  408. <!--lazyload-->
  409.  
  410. <script type="text/javascript" src="http://static.tumblr.com/bmdsqsc/ogWm7q8w1/lazyload.js"></script>
  411.  
  412. <!--style my tooltips-->
  413.  
  414. <script src="http://static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script>
  415.  
  416. <script type="text/javascript" charset="utf-8">
  417. var $j = jQuery.noConflict();
  418. $j(function() {
  419. if (navigator.platform == "iPad" || navigator.platform == "iPhone") return;
  420. $j("img").lazyload({
  421. placeholder : "http://static.tumblr.com/twte3d7/RSvlio0k5/grey.gif",
  422. effect: "fadeIn",
  423. });
  424. });
  425. </script>
  426.  
  427. <script>
  428.  
  429. (function($){
  430.  
  431. $(document).ready(function(){
  432.  
  433. $("a[title]").style_my_tooltips({
  434.  
  435. tip_follows_cursor:true,
  436.  
  437. tip_delay_time:30,
  438.  
  439. tip_fade_speed:300,
  440.  
  441. attribute:"title"
  442.  
  443. });
  444.  
  445. });
  446.  
  447. })(jQuery);
  448.  
  449. </script>
  450.  
  451. <!--sticky links-->
  452.  
  453. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
  454.  
  455. <script type="text/javascript">
  456. $(function(){ // document ready
  457. if (!!$('#linkstick').offset()) { // make sure ".sticky" element exists
  458. var stickyTop = $('#linkstick').offset().top; // returns number
  459. $(window).scroll(function(){ // scroll event
  460. var windowTop = $(window).scrollTop(); // returns number
  461. if (stickyTop < windowTop){
  462. $('#linkstick').css({ position: 'fixed', top: 0 });
  463. }
  464. else {
  465. $('#linkstick').css('position','static');
  466. }
  467. });
  468. }
  469. });
  470. </script>
  471.  
  472. <!--End Java-->
  473.  
  474. </head><body>
  475.  
  476. <div id="header">
  477.  
  478. <div id="headerimage"><img src="{image:Header}"></div><br>
  479.  
  480. <div id="headertext">
  481.  
  482. <div id="blogtitle"><a href="/">{Title}</a></div>
  483.  
  484. <div id="description">{Description}</div></div>
  485.  
  486. <div id="linkstick"><div id="links">
  487. {block:ifLink1}<a href="{text:Link 1 URL}">{text:Link 1}</a>{/block:ifLink1}&emsp;&emsp;&emsp;
  488. {block:ifLink2}<a href="{text:Link 2 URL}">{text:Link 2}</a>{/block:ifLink2}&emsp;&emsp;&emsp;
  489. {block:ifLink3}<a href="{text:Link 3 URL}">{text:Link 3}</a>{/block:ifLink3}&emsp;&emsp;&emsp;
  490. {block:ifLink4}<a href="{text:Link 4 URL}">{text:Link 4}</a>{/block:ifLink4}</div></div>
  491.  
  492. </div>
  493.  
  494. <div id="entries">{block:Posts}<div id="posts">
  495.  
  496. {block:Quote}
  497. <div id="titlequote">“{Quote}”</div>{block:Source}<div id="source">{Source}</div>{/block:Source}
  498. {/block:Quote}
  499.  
  500. {block:Text}
  501. {block:Title}<div id="title">{Title}</div>{/block:Title}{Body}
  502. {/block:Text}
  503.  
  504. {block:Link}
  505. <div id="title"><a href="{URL}">{Name}</a></div>{block:Description}{Description}{/block:Description}
  506. {/block:Link}
  507.  
  508. {block:Chat}
  509. <div id="chat">{block:Title}<h1>{Title}</h1>{/block:Title}<div class="chat"><ol>{block:Lines}<li class="line {Alt}">{block:Label}<span class="label">{Label}</span>{/block:Label}{Line}</li>{/block:Lines}</ol></div></div>
  510. {/block:Chat}
  511.  
  512. {block:Photo}
  513. {LinkOpenTag}<img src="{PhotoURL-500}" width="400" alt="{PhotoAlt}"/>{LinkCloseTag}
  514. {/block:Photo}
  515.  
  516. {block:Photoset}
  517. {Photoset-400}
  518. {/block:Photoset}
  519.  
  520. {block:Video}
  521. {Video-400}
  522. {/block:Video}
  523.  
  524. {block:Audio}
  525. <div class="audioposts"><div class="player"><div class="aplayer">{AudioPlayer}</div></div><div class="audioinfo">{block:TrackName}{TrackName}{/block:TrackName}{block:Artist}<br>{Artist}{/block:Artist}</div></div>
  526. {/block:Audio}
  527.  
  528. {block:Answer}
  529. <div class="questions">{Question}<div class="asker">asked by {Asker}</div></div><div class="answers">{Answer}</div>
  530. {/block:Answer}
  531.  
  532. {block:Caption}
  533. <div class="captions">{Caption}</div>
  534. {/block:Caption}
  535.  
  536. {block:Date}
  537. <div id="info">
  538.  
  539. <a href="{Permalink}"><b>{12Hour}:{Minutes}{CapitalAmPm}</b></a>
  540.  
  541. {block:NoteCount} / <a href="{Permalink}">{NoteCountWithLabel}</a>{/block:NoteCount}
  542.  
  543. {block:PermalinkPage}{block:RebloggedFrom} &mdash; <a href="{ReblogParentURL}">via</a>{block:ContentSource} / <a href="{ReblogRootURL}">source</a>{/block:ContentSource}{/block:RebloggedFrom}{/block:PermalinkPage}
  544.  
  545. {block:PermalinkPage}{block:HasTags}<div id="tags">{block:Tags}<span class="tag2">,&nbsp;</span><a class="tag" href="{TagURL}">{Tag}</a>{/block:Tags}</div>{/block:HasTags}{/block:PermalinkPage}</div>
  546. {/block:Date}
  547.  
  548. </div>
  549.  
  550. {block:PostNotes}{PostNotes}{/block:PostNotes}
  551.  
  552. {/block:Posts}
  553.  
  554. </div>
  555.  
  556. {block:IndexPage}<div id="pagination">
  557. {block:PreviousPage}
  558. <a href="{PreviousPage}">BACK </a>
  559. {/block:PreviousPage}
  560. {block:JumpPagination length="6"}
  561. {block:CurrentPage}
  562. <a href="#" class="currentpage"><b>{PageNumber}</b></a>
  563. {/block:CurrentPage}
  564. {block:JumpPage}
  565. <a class="jump_page" href="{URL}">{PageNumber}</a>
  566. {/block:JumpPage}
  567. {/block:JumpPagination}
  568. {block:NextPage}
  569. <a href="{NextPage}"> FORTH</a>
  570. {/block:NextPage}</div>
  571. {/block:IndexPage}
  572.  
  573. {block:ContentSource}<!-- {SourceURL}{block:SourceLogo}<img src="{BlackLogoURL}" width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}"/> {/block:SourceLogo} {block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo} -->{/block:ContentSource}
  574.  
  575. <div id="credit"><a href="http://dracares.tumblr.com/">DRCRS</a></div>
  576.  
  577. </body></html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement