Advertisement
rasperries

sunsgodownheader

May 7th, 2013
71
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 13.06 KB | None | 0 0
  1. <!DOCTYPE html>
  2. <html>
  3.  
  4. <head>
  5.  
  6. <!-- Misery Business theme by STATEOFGRACES -->
  7.  
  8. <meta name="color:bg" content="#FFFFFF">
  9. <meta name="color:postbg" content="#F7F7F7">
  10. <meta name="color:link" content="#E6E4E4">
  11. <meta name="color:hover" content="#454545">
  12. <meta name="color:text" content="#9A9A9A">
  13. <meta name="color:tags" content="#EDEDED">
  14. <meta name="color:scrollbar" content="#D6D5D5">
  15. <meta name="color:border" content="#F0F0F0">
  16. <meta name="color:accent1" content="#FCFCFC">
  17. <meta name="color:accent2" content="##5B6B9A">
  18.  
  19. <meta name="image:himage" content="">
  20.  
  21. <meta name="text:linkA" content="">
  22. <meta name="text:linkA url" content="/">
  23. <meta name="text:linkB" content="">
  24. <meta name="text:linkB url" content="/">
  25. <meta name="text:linkC" content="">
  26. <meta name="text:linkC url" content="/">
  27. <meta name="text:linkD" content="">
  28. <meta name="text:linkD url" content="/">
  29.  
  30.  
  31. <title>{Title}</title>
  32. {block:Description}
  33. <meta name="description" content="{MetaDescription}"/>
  34. {/block:Description}
  35. <link rel="shortcut icon" href="{Favicon}" />
  36. <link rel="alternate" type="application/rss+xml" href="{RSS}" />
  37.  
  38.  
  39. <link href='http://fonts.googleapis.com/css?family=Noto+Sans' rel='stylesheet' type='text/css'>
  40.  
  41. <link href='http://fonts.googleapis.com/css?family=Cutive+Mono' rel='stylesheet' type='text/css'>
  42.  
  43. <script type="text/javascript" src="http://static.tumblr.com/qlfmldj/1H6mmbwdm/jquery-1.7.1.min.js"></script>
  44.  
  45.  
  46. <script type="text/javascript">
  47.  
  48. $(function(){ // document ready
  49.  
  50. var stickyTop = $('.links').offset().top; // returns number
  51.  
  52. $(window).scroll(function(){ // scroll event
  53.  
  54. var windowTop = $(window).scrollTop(); // returns number
  55.  
  56. if (stickyTop < windowTop) {
  57. $('.links').css({ position: 'fixed', top: 0 });
  58. }
  59. else {
  60. $('.links').css('position','static');
  61. }
  62.  
  63. });
  64.  
  65. });
  66.  
  67. </script>
  68.  
  69.  
  70. </head>
  71.  
  72. <style type="text/css">
  73.  
  74.  
  75. a {
  76. color:{color:link};
  77. text-decoration:none;
  78. -moz-transition-duration:0.4s;
  79. -webkit-transition-duration:0.4s;
  80. -o-transition-duration:0.4s;
  81. }
  82.  
  83. a:hover {
  84. color:{color:hover};
  85. text-decoration:none;
  86. -moz-transition-duration:0.4s;
  87. -webkit-transition-duration:0.4s;
  88. -o-transition-duration:0.4s;
  89. }
  90.  
  91.  
  92. ::-webkit-scrollbar {background-color:{color:accent1}; height:8px; width:8px}
  93. ::-webkit-scrollbar-thumb:vertical {background-color:{color:scrollbar}; height:50px}
  94. ::-webkit-scrollbar-thumb:horizontal {background-color:{color:scrollbar}; height:8px!important}
  95. ::selection {background-color: {color:accent1};
  96. }
  97.  
  98.  
  99. body {
  100. font-family: 'Noto Sans', sans-serif;
  101. font-weight:normal;
  102. }
  103.  
  104. h1 {
  105. font-weight:normal;
  106. text-align:left;
  107. line-height:120%;
  108. letter-spacing:0px;
  109. font-size:9px;
  110. color:{color:text};
  111. }
  112.  
  113. h2 {
  114. font-weight:normal;
  115. text-align:left;
  116. line-height:120%;
  117. letter-spacing:0px;
  118. font-size:12px;
  119. color:{color:accent2};
  120. font-family: 'Cutive Mono', serif;
  121. }
  122.  
  123. h3 {
  124. font-weight:normal;
  125. text-align:left;
  126. line-height:80%;
  127. letter-spacing:-1px;
  128. font-size:12px;
  129. color:{color:accent2};
  130. font-family: 'Cutive Mono', serif;
  131. }
  132.  
  133. blockquote {
  134. border-left:1px solid {color:accent2};
  135. padding-left:5px;
  136. margin:0px;
  137. }
  138.  
  139. #theme {
  140. text-align: center;
  141. width:500px;
  142. margin: -10px auto -12px auto;
  143. background-color:{color:bg};
  144. }
  145.  
  146. #header {
  147. width:500px;
  148. height:175px;
  149. position: relative;
  150. }
  151.  
  152. .pagi {
  153. letter-spacing:3px;
  154. width:500px;
  155. text-transform:uppercase;
  156. font-style:normal;
  157. text-align:center;
  158. margin-bottom:50px;
  159. }
  160.  
  161. .pagi a {
  162. color:{color:accent2};
  163. text-align:center;
  164. padding:4px;
  165. margin:5px;
  166. background-color:{color:accent1};
  167. font-size:11px;
  168. font-family: 'Cutive Mono', serif;
  169. letter-spacing:-1px;
  170. }
  171.  
  172. .pagi a:hover {
  173. color:{color:bg};
  174. background-color:{color:accent2};
  175. }
  176.  
  177.  
  178. .sbar {
  179. width:500px;
  180. height:175px;
  181. position: relative;
  182. }
  183.  
  184. .sbar img {
  185. width:500px;
  186. height:175px;
  187. }
  188.  
  189. .sbar:hover .desc {
  190. opacity:1;
  191. -moz-transition-duration:0.6s;
  192. -webkit-transition-duration:0.6s;
  193. -o-transition-duration:0.6s;
  194. }
  195.  
  196. .links {
  197. width:480px;
  198. padding:10px;
  199. background-color:{color:accent1};
  200. border-bottom:2px solid {color:bg};
  201. opacity:0.9;
  202. -moz-transition-duration:0.6s;
  203. -webkit-transition-duration:0.6s;
  204. -o-transition-duration:0.6s;
  205. }
  206.  
  207. .links a{
  208. display:inline-block;
  209. text-transform:uppercase;
  210. background-color:{color:accent1};
  211. color:{color:text};
  212. padding:3px;
  213. margin:0px 2px 0px;
  214. font-size:7px;
  215. letter-spacing:1px;
  216. -moz-transition-duration:0.6s;
  217. -webkit-transition-duration:0.6s;
  218. -o-transition-duration:0.6s;
  219. }
  220.  
  221. .links a:hover{
  222. background-color:{color:link};
  223. color:{color:bg};
  224. -moz-transition-duration:0.6s;
  225. -webkit-transition-duration:0.6s;
  226. -o-transition-duration:0.6s;
  227. }
  228.  
  229.  
  230. .desc {
  231. width:400px;
  232. padding:20px;
  233. margin-top:-130px;
  234. margin-left:30px;
  235. margin-bottom:35px;
  236. text-align:center;
  237. font-size:9px;
  238. letter-spacing:1px;
  239. line-height:90%;
  240. color:{color:text};
  241. word-wrap:break-word;
  242. background-color:{color:accent1};
  243. opacity:0;
  244. background-color:{color:bg};
  245. -moz-transition-duration:0.6s;
  246. -webkit-transition-duration:0.6s;
  247. -o-transition-duration:0.6s;
  248. }
  249.  
  250.  
  251.  
  252. .pagi {
  253. letter-spacing:1px;
  254. width:500px;
  255. text-transform:uppercase;
  256. font-style:normal;
  257. text-align:center;
  258. margin-bottom:50px;
  259. }
  260.  
  261. .pagi a {
  262. color:{color:text};
  263. text-align:center;
  264. padding:4px;
  265. margin:5px;
  266. background-color:{color:accent1};
  267. font-size:8px;
  268. font-family: 'Cutive Mono', serif;
  269. letter-spacing:-1px;
  270. }
  271.  
  272. .pagi a.arrow{
  273. font-size:8px;
  274. color:{color:text};
  275. }
  276.  
  277. .pagi span.current{
  278. font-size:8px;
  279. color:{color:links};
  280. }
  281.  
  282. .pagi a:hover {
  283. color:{color:bg};
  284. background-color:{color:accent2};
  285. }
  286.  
  287. #stuffcontainer {
  288. float:left;
  289. margin-top:50px;
  290. z-index:-50;
  291. position:absolute;
  292. text-align:justify;
  293. color:{color:text};
  294. word-wrap:break-word;
  295. }
  296.  
  297.  
  298. #stuff {
  299. width:500px;
  300. text-align:center;
  301. font-size:9px;
  302. letter-spacing:1px;
  303. line-height:100%;
  304. color:{color:text};
  305. word-wrap:break-word;
  306. background-color:{color:bg};
  307. }
  308.  
  309. #caption {
  310. background-color:{color:postbg};
  311. text-align:justify;
  312. font-size:9px;
  313. width:480px;
  314. padding:0px;
  315. text-align:justify;
  316. line-height:120%;
  317. word-wrap:break-word;
  318. }
  319.  
  320. .ask {
  321. padding:10px;
  322. width:440px;
  323. text-align:left;
  324. color:{color:text};
  325. background-color:{color:bg};
  326. word-wrap:break-word;
  327. }
  328.  
  329. .ans {
  330. padding:10px;
  331. padding-bottom:0px;
  332. width:440px;
  333. text-align:left;
  334. color:{color:text};
  335. }
  336.  
  337. .audio {
  338. width:500px;
  339. }
  340.  
  341. .ai {
  342. text-align:center;
  343. width:480px;
  344. line-height:130%;
  345. background-color:{color:accent1};
  346. padding:10px;
  347. font-size:9px;
  348. color:{color:text};
  349. }
  350.  
  351. .track {
  352. font-family: 'Cutive Mono', serif;
  353. font-size:16px;
  354. letter-spacing:-1px;
  355. }
  356.  
  357. .aplay {
  358. width:27px;
  359. height:27px;
  360. overflow:hidden;
  361. z-index:2;
  362. display:block;
  363. background-color:white;
  364. margin:-35px 0px 0px 235px;
  365. position:absolute;
  366. opacity:1;
  367. }
  368.  
  369.  
  370.  
  371. .postinfo {
  372. text-transform:uppercase;
  373. margin:2px 0px 150px 0px;
  374. display:inline-block;
  375. font-style:normal;
  376. font-size:8px;
  377. color:{color:accent2};
  378. text-align:left;
  379. -moz-transition-duration:0.5s;
  380. -webkit-transition-duration:0.5s;
  381. -o-transition-duration:0.5s;
  382. }
  383.  
  384. .postinfo a {
  385. color:{color:text};
  386. display:inline-block;
  387. font-style:normal;
  388. }
  389.  
  390. .postinfo a:hover {
  391. color:{color:hover};
  392. }
  393.  
  394. .time {
  395. background-color:{color:accent1};
  396. padding:5px;
  397. position:absolute;
  398. width:490px;
  399. text-align:right;
  400. }
  401.  
  402. .count {
  403. background-color:{color:accent2};
  404. color:{color:bg};
  405. padding:5px;
  406. position:absolute;
  407. text-align:left;
  408. }
  409.  
  410. .count a {
  411. color:{color:bg};
  412. }
  413.  
  414. .count a:hover {
  415. color:{color:bg};
  416. }
  417.  
  418. .triangle {
  419. width:0px;
  420. height:0px;
  421. margin-top:-15px;
  422. margin-left:450px;
  423. position:absolute;
  424. border-bottom:15px solid {color:accent1};
  425. border-left:15px solid transparent;
  426. border-right:15px solid transparent;
  427. font-size:0px;
  428. line-height:0px;
  429. }
  430.  
  431. .note {
  432. text-transform:uppercase;
  433. font-style:normal;
  434. letter-spacing:0px;
  435. font-size:8px;
  436. text-align:left;
  437. line-height:90%;
  438. margin-left:-40px;
  439. }
  440.  
  441. .note li {
  442. list-style-type:none;
  443. height:20px;
  444. border-bottom:1px solid {color:border};
  445. padding:10px 25px 10px 25px;
  446. text-align:left;
  447. margin:0px;
  448. background-color:{color:bg};
  449. -moz-transition-duration:0.5s;
  450. -webkit-transition-duration:0.5s;
  451. -o-transition-duration:0.5s;
  452. }
  453.  
  454. .note li:hover {
  455. background-color:{color:accent1};
  456. -moz-transition-duration:0.5s;
  457. -webkit-transition-duration:0.5s;
  458. -o-transition-duration:0.5s;
  459. }
  460.  
  461. .note img {
  462. width:20px;
  463. height:20px;
  464. margin-bottom:-7px;
  465. margin-right:5px;
  466. }
  467.  
  468. .blogs {
  469. position:absolute;
  470. text-align:left;
  471. margin-left:500px;
  472. padding:5px;
  473. text-transform:uppercase;
  474. font-style:normal;
  475. letter-spacing:0px;
  476. font-size:8px;
  477. -moz-transition-duration:0.5s;
  478. -webkit-transition-duration:0.5s;
  479. -o-transition-duration:0.5s;
  480. }
  481.  
  482. .accent {
  483. font-size:7px;
  484. color:{color:bg};
  485. padding:5px;
  486. background-color:{color:accent1};
  487. }
  488.  
  489. .tags {
  490. width:500px;
  491. margin-top:25px;
  492. font-style:normal;
  493. text-transform:lowercase;
  494. text-align:left;
  495. letter-spacing:0.5px;
  496. text-transform:uppercase;
  497. -moz-transition-duration:0.5s;
  498. -webkit-transition-duration:0.5s;
  499. -o-transition-duration:0.5s;
  500. }
  501.  
  502. .tags a {
  503. color:{color:link};
  504. background-color:{color:bg};
  505. display:inline-block;
  506. padding:3px;
  507. margin-right:5px;
  508. -moz-transition-duration:0.5s;
  509. -webkit-transition-duration:0.5s;
  510. -o-transition-duration:0.5s;
  511. }
  512.  
  513. .tags a:hover {
  514. color:{color:bg};
  515. background-color:{color:accent2};
  516. -moz-transition-duration:0.5s;
  517. -webkit-transition-duration:0.5s;
  518. -o-transition-duration:0.5s;
  519. }
  520.  
  521. .convo {
  522. padding-bottom:10px;
  523. }
  524.  
  525. ul.chat, .chat ol, .chat li {
  526. list-style:none;
  527. margin:0px;
  528. padding:0px;
  529. }
  530.  
  531. .chat li:nth-child(odd) {
  532. background-color:{color:bg};
  533. padding:5px;
  534. }
  535.  
  536. .chat li:nth-child(even) {
  537. background-color:{color:accent1};
  538. padding:5px;
  539. }
  540.  
  541. .label {
  542. margin-right:5px;
  543. }
  544.  
  545. {CustomCSS}
  546.  
  547. </style>
  548.  
  549. <body>
  550.  
  551. <div id="theme">
  552.  
  553. <div id="header">
  554. <img src="{image:himage}">
  555. </div>
  556. <div class="sbar">
  557. <div class="desc">
  558. {Description}
  559. </div>
  560.  
  561.  
  562. <div class="links">
  563. <a href="/">home</a>
  564. <a href="/ask">ask</a>
  565. {block:IfLinkA}
  566. <a href="{text:linkA url}">{text:linkA}</a>
  567. {/block:IfLinkA}
  568. {block:IfLinkB}
  569. <a href="{text:linkB url}">{text:linkB}</a>
  570. {/block:IfLinkB}
  571. {block:IfLinkC}
  572. <a href="{text:linkC url}">{text:linkC}</a>
  573. {/block:IfLinkC}
  574. {block:IfLinkD}
  575. <a href="{text:linkD url}">{text:linkD}</a>
  576. {/block:IfLinkD}
  577. </div>
  578. </div>
  579.  
  580. <div id="stuffcontainer">
  581.  
  582. {block:Posts}
  583.  
  584. <div class="blogs">{block:RebloggedFrom}<span class="accent"><a href="{ReblogParentURL}">via</a></span><br><br>{/block:RebloggedFrom}{block:ContentSource}<span class="accent"> <a href="{SourceURL}">©</a></span>{/block:ContentSource}</div>
  585.  
  586. {block:Text}<div id="caption">{block:Title}<h2>{Title}</h2>{/block:Title}{Body}</div>{/block:Text}
  587.  
  588. {block:Quote}<div id="caption"><h1>“{Quote}”</h1><h3>— {Source}</h3></div>{/block:Quote}
  589.  
  590. {block:Link}<div id="caption"><a href="{URL}"><h2>{Name}</h2></a>
  591. {block:Description}<p>{Description}</p>{/block:Description}</div>{/block:Link}
  592.  
  593. {block:Photo}<div id="stuff"><img src="{PhotoURL-500}"/></div>
  594. {block:Caption}<div id="caption">{Caption}</div>{/block:Caption}{/block:Photo}
  595.  
  596. {block:Photoset}<div id="stuff"><center>{Photoset-500}</center></div>
  597. {block:Caption}<div id="caption">{Caption}</div>{/block:Caption}{/block:Photoset}
  598.  
  599. {block:Chat}<div id="caption"><div class="convo"><ul class="chat">{block:Title}<h1>{Title}</h1>{/block:Title}{block:Lines}<li>{block:Label}<span class="label">{Label}</span>{/block:Label}&nbsp;{Line}</li>{/block:Lines}</ul></div></div>{/block:Chat}
  600.  
  601. {block:Video}<div id="stuff">{Video-500}</div>
  602. {block:Caption}<div id="caption">{Caption}</div>{/block:Caption}{/block:Video}
  603.  
  604. {block:Answer}<div id="caption"><div class="ask">{Asker} said: {Question}</div><div class="ans">{Answer}</div></div>{/block:answer}
  605.  
  606. {block:Audio}<div class="audio"><div class="ai">{block:Artist}{Artist}{/block:Artist}<br>{block:TrackName}<span class="track">{TrackName}<br></span>{/block:TrackName}{block:Album}{Album}{/block:Album}<br>{block:PlayCount}Played {FormattedPlayCount} times{/block:PlayCount}</div></div><br><br><div class="aplay">{AudioPlayerWhite}</div>
  607. {block:Caption}<div id="caption">{Caption}</div>{/block:Caption}{/block:Audio}
  608.  
  609. {block:Date}
  610. <div class="postinfo">
  611. <div class="triangle">
  612. </div>
  613. <div class="time"><a href="{Permalink}">{TimeAgo}</a></div>
  614. {block:NoteCount}<div class="count"><a href="{Permalink}">{NoteCount}</a></div>{/block:NoteCount}
  615.  
  616. {block:HasTags}<div class="tags">under:
  617. {block:Tags}<a href="{TagURL}">#{Tag}</a>{/block:Tags}
  618. </div>{/block:HasTags}
  619.  
  620. </div>
  621. {/block:Date}
  622.  
  623.  
  624. <div class="note">
  625. {block:PostNotes}{PostNotes}{/block:PostNotes}
  626. </div>
  627.  
  628. {/block:Posts}
  629.  
  630. {block:Pagination}
  631. <div class="pagi">
  632. {block:PreviousPage}<a class="arrow" href="{PreviousPage}">←</a>{/block:PreviousPage}
  633. {block:JumpPagination length="5"}
  634. {block:CurrentPage}<span class="current">{PageNumber}</span>{/block:CurrentPage}
  635. {block:JumpPage}<a class="page" href="{URL}">{PageNumber}</a>{/block:JumpPage}{/block:JumpPagination}
  636. {block:NextPage}<a class="arrow" href="{NextPage}">→</a>{/block:NextPage}
  637. </div>
  638. {/block:Pagination}
  639.  
  640.  
  641. </div>
  642.  
  643. </div>
  644.  
  645. </body>
  646.  
  647. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement