Advertisement
dracares

theme 11 - dracares

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