Advertisement
ameliasdreams

theme 24 - solstice

Jul 14th, 2014
1,099
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 9.65 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"><html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  2.  
  3. <!---
  4.  
  5. solstice (theme #24) by melodypcnd(.tumblr.com)
  6.  
  7. - do not remove the credit or edit it
  8. - do not remove it and put the credit on another page
  9. - do not steal or claim this as your own
  10. - do not use this as a base code
  11. - and lastly, don't take parts of the code, as that it also stealing
  12.  
  13. but please like or reblog the post! :) enjoy the theme! <3
  14.  
  15. --->
  16.  
  17. <head>
  18.  
  19. <title>{Title}</title>
  20.  
  21. <link rel="shortcut icon" href="{Favicon}">
  22.  
  23. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  24.  
  25. {block:Description}
  26. <meta name="description" content="{MetaDescription}"/>
  27. {/block:Description}
  28.  
  29. <meta name="color:text" content="#777777" />
  30. <meta name="color:link" content="#777777" />
  31. <meta name="color:background" content="#ffffff" />
  32.  
  33. <meta name="text:tab 2 title" content="tab 2" />
  34. <meta name="text:tab 2 content" content="" />
  35. <meta name="text:tab 3 title" content="tab 3" />
  36. <meta name="text:tab 3 content" content="" />
  37. <meta name="text:tab 4 title" content="tab 4" />
  38. <meta name="text:tab 4 content" content="" />
  39. <meta name="text:tab 5 title" content="tab 5" />
  40. <meta name="text:tab 5 content" content="" />
  41.  
  42. <script language="JavaScript" src="http://static.tumblr.com/oxr8htj/zBcn8d5im/tabs_javascript.txt" type="text/JavaScript"></script>
  43.  
  44. <script language="JavaScript" src="http://dl.dropbox.com/u/3173073/GothicDarkness/qTip.js" type="text/JavaScript"></script>
  45.  
  46. <style type="text/css">
  47.  
  48. div#qTip {
  49. position:absolute;
  50. display:none;
  51. padding:2px 5px;
  52. margin-left:15px;
  53. color:{color:text};
  54. background-color:{color:background};
  55. z-index:99999999999999;
  56. }
  57.  
  58. body {
  59. background:{color:background};
  60. color:{color:text};
  61. font-family:'arial', sans-serif;
  62. letter-spacing:1px;
  63. line-height:150%;
  64. font-size:10px;
  65. text-align:justify;
  66. }
  67.  
  68. ::-webkit-scrollbar {width:5px;background-color:{color:background};}
  69. ::-webkit-scrollbar-thumb {background-color:{color:text};}
  70.  
  71. a {color:{color:link};text-decoration:none;}
  72.  
  73. blockquote {
  74. border-left:1px solid #000;
  75. padding:0px 10px;
  76. margin-left:10px;
  77. }
  78.  
  79. h1 {
  80. padding:5px 0px;
  81. font-size:12px;
  82. letter-spacing:3px;
  83. text-transform:uppercase;
  84. text-align:center;
  85. }
  86.  
  87. #header {
  88. position:relative;
  89. width:500px;
  90. left:50%;
  91. margin-left:-250px;
  92. margin-top:40px;
  93. }
  94.  
  95. #title {
  96. padding:6px 0px;
  97. font-size:14px;
  98. font-weight:bold;
  99. letter-spacing:3px;
  100. text-transform:uppercase;
  101. text-align:center;
  102. }
  103.  
  104. .tabs {
  105. width:500px;
  106. }
  107.  
  108. .tabs nav ul {
  109. padding:0px;
  110. margin:0px;
  111. list-style:none;
  112. display:inline-block;
  113. }
  114.  
  115. .tabs nav ul li {
  116. display:block;
  117. float:left;
  118. position:relative;
  119. }
  120.  
  121. .tabs nav a {
  122. display:block;
  123. text-transform:uppercase;
  124. padding:5px;
  125. border-top:1px solid #eee;
  126. border-bottom:1px solid #eee;
  127. width:90px;
  128. text-align:center;
  129. -webkit-transition-duration:0.3s;
  130. -moz-transition-duration:0.3s;
  131. -o-transition-duration:0.3s;
  132. }
  133.  
  134. .tabs nav a:hover {border-bottom:1px solid #aaa;}
  135.  
  136. .tabs nav li.tab-current a {
  137. font-weight:bold;
  138. border-bottom:1px solid #aaa;
  139. letter-spacing:4px;
  140. }
  141.  
  142. .content section {display:none;}
  143.  
  144. .content section.content-current {display:block;}
  145.  
  146. .stuff {
  147. width:480px;
  148. padding:10px;
  149. background-color:#eee;
  150. }
  151.  
  152. #entry {
  153. position:absolute;
  154. left:50%;
  155. margin-left:-250px;
  156. padding:50px 0px;
  157. margin-top:30px;
  158. height:100%;
  159. }
  160.  
  161. #post {
  162. width:500px;
  163. margin-bottom:50px;
  164. font-style:none;
  165. }
  166.  
  167. .cap {
  168. font-size:9px;
  169. letter-spacing:1px;
  170. text-align:left;
  171. padding:4px;
  172. }
  173.  
  174. #quote {
  175. font-size:15px;
  176. font-style:italic;
  177. line-height:100%;
  178. text-align:left;
  179. text-transform:none;
  180. }
  181.  
  182. #src {
  183. font-size:9px;
  184. letter-spacing:2px;
  185. text-align:right;
  186. }
  187.  
  188. #chat {
  189. text-align:left;
  190. }
  191.  
  192. .line {
  193. border-bottom:1px solid {color:Border};
  194. padding-bottom:7px;
  195. }
  196.  
  197. .newplayerbutton {
  198. position:relative;
  199. width:28px;
  200. height:27px;
  201. overflow:hidden;
  202. }
  203.  
  204. .playerbuttonhug {
  205. position:absolute;
  206. top:-11px;
  207. left:-12px;
  208. }
  209.  
  210. .tumblr_audio_player {
  211. border:none;
  212. padding:0px;
  213. margin:0px;
  214. height:50px;
  215. width:500px;
  216. padding-left:12.5px;
  217. }
  218.  
  219. .playerbuttonbg {
  220. position:absolute;
  221. left:20px;
  222. top:20px;
  223. width:28px;
  224. height:28px;
  225. background-color:#000;
  226. padding:10px;
  227. }
  228.  
  229. .trackdetails {
  230. width:auto;
  231. display:inline-block;
  232. margin-left:100px;
  233. min-height:85px;
  234. text-transform:lowercase;
  235. letter-spacing:1px;
  236. line-height:125%;
  237. font-size:9px;
  238. color:#eee;
  239. }
  240.  
  241. .audiowrapper {
  242. position:relative;
  243. display:block;
  244. background-color:#000;
  245. padding:2px;
  246. }
  247.  
  248. #q {
  249. padding:10px 0px;
  250. font-size:10px;
  251. letter-spacing:1px;
  252. border-top:1px solid #eee;
  253. border-bottom:1px solid #eee;
  254. text-align:center;
  255. }
  256.  
  257. #asker {
  258. padding-top:5px;
  259. margin-bottom:-3px;
  260. }
  261.  
  262. #asker a {
  263. font-weight:bold;
  264. letter-spacing:2px;
  265. text-transform:uppercase;
  266. }
  267.  
  268. #info {
  269. margin-top:2.5px;
  270. padding:3px 1px;
  271. font-size:8px;
  272. text-transform:uppercase;
  273. border-top:1px solid #eee;
  274. border-bottom:1px solid #eee;
  275. }
  276.  
  277. #info a {padding:0px 3px;}
  278.  
  279. #tags {
  280. margin-top:3px;
  281. margin-left:5px;
  282. font-size:8px;
  283. text-transform:uppercase;
  284. opacity:0;
  285. -webkit-transition-duration:0.5s;
  286. -moz-transition-duration:0.5s;
  287. -o-transition-duration:0.5s;
  288. }
  289.  
  290. #post:hover #tags {
  291. opacity:1;
  292. -webkit-transition-duration:0.5s;
  293. -moz-transition-duration:0.5s;
  294. -o-transition-duration:0.5s;
  295. }
  296.  
  297. .notecont {
  298. width:500px;
  299. font-size:7px;
  300. letter-spacing:1px;
  301. word-spacing:5px;
  302. text-transform:uppercase;
  303. margin-left:-35px;
  304. }
  305.  
  306. .notecont li {
  307. list-style-type:none;
  308. line-height:275%;
  309. }
  310.  
  311. .notecont img {
  312. display:none;
  313. }
  314.  
  315. #pagi {
  316. position:absolute;
  317. padding:4px 0px;
  318. width:500px;
  319. left:50%;
  320. margin-left:-250px;
  321. margin-bottom:30px;
  322. text-align:left;
  323. letter-spacing:2px;
  324. font-size:8px;
  325. text-transform:uppercase;
  326. border-top:1px solid #ddd;
  327. }
  328.  
  329. #poop {
  330. font-size:8px;
  331. font-family:calibri;
  332. letter-spacing:2px;
  333. }
  334.  
  335. #poop a {
  336. position:fixed;
  337. width:20px;
  338. padding-top:3px;
  339. padding-bottom:3px;
  340. bottom:5px;
  341. right:5px;
  342. text-align:center;
  343. box-align:center;
  344. text-transform:none;
  345. color:#777;
  346. background-color:#eee;
  347. border:3px double #fff;
  348. }
  349.  
  350. </style></head><body>
  351.  
  352. <div id="header">
  353. <div id="title">{Title}</div>
  354. <div id="tabs" class="tabs">
  355. <nav><ul>
  356. <li><a title="description" href="#section-1"> one</a></li>
  357. <li><a title="{text:tab 2 title}" href="#section-2"> two </a></li>
  358. <li><a title="{text:tab 3 title}" href="#section-3"> three </a></li>
  359. <li><a title="{text:tab 4 title}" href="#section-4"> four </a></li>
  360. <li><a title="{text:tab 5 title}" href="#section-5"> five </a></li>
  361. </ul></nav>
  362.  
  363. <div class="content">
  364.  
  365. <section id="section-1">
  366. <div class="stuff">
  367. {Description}
  368. </div>
  369. </section>
  370.  
  371. <section id="section-2">
  372. <div class="stuff">
  373. {text:tab 2 content}
  374. </div>
  375. </section>
  376.  
  377. <section id="section-3">
  378. <div class="stuff">
  379. {text:tab 3 content}
  380. </div>
  381. </section>
  382.  
  383. <section id="section-4">
  384. <div class="stuff">
  385. {text:tab 4 content}
  386. </div>
  387. </section>
  388.  
  389. <section id="section-5">
  390. <div class="stuff">
  391. {text:tab 5 content}
  392. </div>
  393. </section>
  394.  
  395. </div>
  396. </div>
  397. </div>
  398. <script src="js/cbpFWTabs.js"></script>
  399. <script>
  400. new CBPFWTabs( document.getElementById( 'tabs' ) );
  401. </script>
  402.  
  403. <div id="entry">
  404. {block:Posts}
  405. <div id="post">
  406.  
  407. {block:Text}
  408. <h1>
  409. {block:Title}
  410. {Title}
  411. {/block:Title}
  412. </h1>
  413. <div class="cap">{Body}</div>
  414. {/block:Text}
  415.  
  416. {block:blockquote}
  417. {/block:blockquote}
  418.  
  419. {block:Photo}
  420. <center>
  421. {LinkOpenTag}
  422. <img src="{PhotoURL-500}" alt="{PhotoAlt}"/>
  423. {LinkCloseTag}
  424. </center>
  425. {/block:Photo}
  426.  
  427. {block:Photoset}
  428. {Photoset-500}
  429. {/block:Photoset}
  430.  
  431. {block:Quote}
  432. <div id="quote">❝{Quote}❞</div><p>
  433. {block:Source}
  434. <div id="src">—{Source}</div>
  435. {/block:Source}
  436. {/block:Quote}
  437.  
  438. {block:Link}
  439. <h1>
  440. <a href="{URL}"{Target}>{Name}</a>
  441. </h1>
  442. {block:Description}
  443. <div class="cap">{Description}</div>
  444. {/block:Description}
  445. {/block:Link}
  446.  
  447. {block:Chat}
  448. <div id="chat">
  449. {block:Title}
  450. <h1>
  451. {Title}
  452. </h1>
  453. {/block:Title}
  454. {block:Lines}
  455. {block:Label}
  456. <div class="line">
  457. <b>{Label}</b>
  458. {/block:Label}
  459. {Line}
  460. </div><br>
  461. {/block:Lines}
  462. </div>
  463. {/block:Chat}
  464.  
  465. {block:AudioPlayer}
  466. <div class="audiowrapper">
  467. <div class="playerbuttonbg">
  468. <div class="newplayerbutton">
  469. <div class="playerbuttonhug">
  470. {AudioPlayerBlack}
  471. </div></div></div>
  472. <div class="trackdetails"><br><br>
  473. {block:TrackName}{TrackName}{/block:TrackName}<br>
  474. {block:Artist}{Artist}{/block:Artist}<br>
  475. {PlayCountWithLabel}
  476. </div></div>
  477. {/block:AudioPlayer}
  478.  
  479. {block:Video}
  480. {Video-500}
  481. {/block:Video}
  482.  
  483. {block:Answer}
  484. <div id="q">
  485. <div id="asker"><a href="{askerURL}">{Asker} whispered:</a></div><br>
  486. {Question}<p>
  487. </div>
  488. <div class="cap">{Answer}</div>
  489. {/block:Answer}
  490.  
  491. {block:Caption}
  492. <div class="cap">{Caption}</div>
  493. {/block:Caption}
  494.  
  495. <div id="info">
  496. {block:Date}
  497. <a href="{Permalink}">{ShortMonth} {DayOfMonth}</a>
  498. {/block:Date}
  499. {block:NoteCount}
  500. <a href="{Permalink}">{NoteCount}</a>
  501. {/block:NoteCount}
  502. {block:RebloggedFrom}
  503. <a href="{ReblogParentURL}">from</a>
  504. {/block:RebloggedFrom}
  505. {block:ContentSource}
  506. <a href="{SourceURL}">source</a>
  507. {/block:ContentSource}
  508. </div>
  509. <div id="tags">
  510. {block:HasTags}
  511. {block:Tags}
  512. <a href="{TagURL}">#{Tag}&nbsp;</a>
  513. {/block:Tags}
  514. {/block:HasTags}
  515. </div>
  516.  
  517. {block:PostNotes}
  518. <div class="notecont">
  519. {PostNotes}
  520. </div>
  521. {/block:PostNotes}
  522. </div>
  523. {/block:Posts}
  524.  
  525. <div id="poop">
  526. <a href="http://melodypcnd.tumblr.com/">mk</a>
  527. </div>
  528.  
  529. <div id="pagi">
  530. {block:Pagination}
  531. {block:PreviousPage}
  532. <a href="{PreviousPage}">prev</a>
  533. {/block:PreviousPage}
  534. <span style="float:right">
  535. {block:NextPage}
  536. <a href="{NextPage}">next</a>
  537. {/block:NextPage}
  538. </span>
  539. {/block:Pagination}
  540. </div>
  541.  
  542. </body></html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement