Advertisement
ameliasdreams

theme 17 - gossamer

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