dearhannibal

Chrysalis

Apr 19th, 2014
846
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 15.20 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. <!-- oh hey look i made a theme *high five* edit all you want really, basically everything is customizable! as long as you leave the credit intact thank you -->
  6.  
  7.  
  8. <title>{Title}</title>
  9.  
  10. <link rel="shortcut icon" href="{Favicon}">
  11. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  12.  
  13. {block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}
  14.  
  15. <!-- default variables -->
  16.  
  17. <meta name="color:background" content="#ffffff">
  18. <meta name="color:title" content ="#3b3b3b">
  19. <meta name="color:text" content="#3b3b3b">
  20. <meta name="color:tags" content="#3b3b3b">
  21. <meta name="color:permalink" content="#e0e0e0">
  22. <meta name="color:link" content="#b8b8b8">
  23. <meta name="color:link hover" content="#3b3b3b">
  24. <meta name="color:border" content="#cacaca">
  25. <meta name="color:scrollbar" content="#eeeeee">
  26. <meta name="color:scrollbar bg" content="#ffffff">
  27.  
  28. <meta name="image:sidebar" content=""/>
  29.  
  30. <meta name="if:show captions" content="1"/>
  31. <meta name="text:Link 1 URL" content="" />
  32. <meta name="text:Link 1" content="" />
  33. <meta name="text:Link 2 URL" content="" />
  34. <meta name="text:Link 2" content="" />
  35. <meta name="text:Link 3 URL" content="" />
  36. <meta name="text:Link 3" content="" />
  37. <meta name="text:Link 4 URL" content="" />
  38. <meta name="text:Link 4" content=""/>
  39. <meta name="text:Link 5 URL" content="" />
  40. <meta name="text:Link 5" content="" />
  41. <meta name="text:Link 6 URL" content="" />
  42. <meta name="text:Link 6" content="" />
  43.  
  44. <link href='http://fonts.googleapis.com/css?family=Oleo+Script+Swash+Caps|Romanesco' rel='stylesheet' type='text/css'>
  45.  
  46.  
  47. <link href='http://fonts.googleapis.com/css?family=Rokkitt' rel='stylesheet' type='text/css'>
  48.  
  49.  
  50. <script type="text/javascript" src="http://laura-schmal.de/data/tumblr/lightbox/js/jquery-1.7.2.min.js"></script>
  51.  
  52. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  53.  
  54.  
  55.  
  56. <!-- tooltip script -->
  57.  
  58. <script src="http://static.tumblr.com/rzl30kg/eAxm7a751/jquery.style-my-tooltips.js"></script>
  59.  
  60. <script>
  61. (function($){
  62. $(document).ready(function(){
  63. $("[title]").style_my_tooltips({
  64. tip_follows_cursor:true,
  65. tip_delay_time:200,
  66. tip_fade_speed:300
  67. }
  68. );
  69. });
  70. })(jQuery);
  71. </script>
  72.  
  73.  
  74.  
  75.  
  76. <!-- CSS styling aww yeah. This is the fun part. -->
  77.  
  78. <style type="text/css">
  79.  
  80.  
  81. #s-m-t-tooltip {
  82. max-width:300px;
  83. margin:10px 0px 0px 15px;
  84. text-transform:uppercase;
  85. font-family:helvetica;
  86. letter-spacing:1px;
  87. font-size:8px;
  88. color:#ffffff;
  89. background:#060606;
  90. border:0px double #ebe9e9;
  91. padding:5px;
  92. z-index:999
  93. }
  94.  
  95. ::-webkit-scrollbar {width:5px; height:auto; background:{color:scrollbar bg};}
  96. ::-webkit-scrollbar-corner {background:{color:scrollbar};}
  97. ::-webkit-scrollbar-thumb:vertical {background:{color:scrollbar};}
  98. ::-webkit-scrollbar-thumb:horizontal {background:{color:scrollbar};}
  99.  
  100. #credit {position:fixed;
  101. float:right;
  102. opacity:0.7;
  103. bottom:18px;
  104. right:18px;
  105. padding:6px;
  106. font-size:10px;
  107. text-align:center;
  108. height:10px;
  109. width:10px;
  110. font-family:georgia;
  111. -webkit-transition:all 0.5s ease-in-out;
  112. -moz-transition:all 0.5s ease-in-out;
  113. transition:all 0.5s ease-in-out;}
  114. #credit a {color:black;}
  115.  
  116.  
  117.  
  118.  
  119.  
  120. body {
  121. margin:0px;
  122. padding:0px;
  123. width:auto;
  124. color:{color:text};
  125. background:{color:background};
  126. }
  127.  
  128. a:link, a, a:active, a:visited {
  129. text-decoration:none;
  130. color:{color:link};
  131. -webkit-transition: all 0.5s ease-in-out;
  132. -moz-transition: all 0.5s ease-in-out;
  133. -o-transition: all 0.5s ease-in-out;
  134. -ms-transition: all 0.5s ease-in-out;
  135. transition: all 0.5s ease-in-out;
  136. }
  137. a:hover {
  138. color:{color:link hover};
  139. }
  140.  
  141. #con {
  142. position:absolute;
  143. left:50%;
  144. margin-left:-195px;
  145. }
  146.  
  147. #entry {
  148. margin:auto;
  149. margin-top:-60px;
  150. position:absolute;
  151. width:400px;
  152. font-family:sans-serif;
  153. font-size:12px;
  154. padding-bottom:130px;
  155. }
  156.  
  157. .post {
  158. float:center;
  159. background-color:#fff;
  160. overflow:hidden;
  161. text-align:center;
  162. margin-left:86px;
  163. width:400px;
  164. margin-top:190px;
  165. margin-bottom:50px;
  166. overflow:hidden;
  167. border:1px solid {color:border};
  168. padding:6px;
  169. box-shadow: 3px 3px 16px #b8b8b8;
  170. }
  171.  
  172. .post img{
  173. width:auto;
  174. max-width:400px;
  175.  
  176. }
  177.  
  178.  
  179.  
  180.  
  181. iframe.photoset {
  182. width:400px;
  183. }
  184.  
  185. .text img{
  186. width:auto;
  187. }
  188.  
  189.  
  190. #permalinkpage {
  191. position:absolute;
  192. width:392px;
  193. margin-bottom:-10px;
  194. margin-top:50px;
  195. margin-left:1px;
  196. font-family:arial;
  197. font-size:9px;
  198. text-align:center;
  199. text-transform:lowercase;
  200. letter-spacing:2px;
  201. padding:10px;
  202. }
  203.  
  204. #permalinkpage a {
  205. margin-top:10px;
  206. color:{color:bottompost link};
  207. }
  208.  
  209. #permalinkpage a:hover {
  210. color:{color:bottompost link hover};
  211. }
  212.  
  213. #permalinkpage:hover #tags {
  214. opacity:0;
  215. }
  216.  
  217. #bottompost {
  218. font-size:11px;
  219. position:absolute;
  220. width:392px;
  221. opacity:0;
  222. margin-top:-40px;
  223. margin-bottom:10px;
  224. margin-left:-7px;
  225. text-align:center;
  226. text-transform:lowercase;
  227. padding:10px;
  228. -webkit-transition: all 0.5s ease-in-out;
  229. -moz-transition: all 0.5s ease-in-out;
  230. -o-transition: all 0.5s ease-in-out;
  231. -ms-transition: all 0.5s ease-in-out;
  232. transition: all 0.5s ease-in-out;
  233.  
  234. }
  235.  
  236. #bottompost a {
  237. padding-top:5px;
  238. color:{color:bottompost link};
  239. }
  240.  
  241. #bottompost a:hover {
  242. color:{color:bottompost link hover};
  243. }
  244.  
  245. .post:hover #bottompost {
  246. opacity:1;
  247. }
  248.  
  249.  
  250. #tags {
  251. opacity:0;
  252. width:395px;
  253. position:absolute;
  254. font-size:11px;
  255. padding:3px;
  256. margin-top:20px;
  257. color:{color:tags};
  258. text-align:center;
  259. -webkit-transition: all 0.5s ease-in-out;
  260. -moz-transition: all 0.5s ease-in-out;
  261. -o-transition: all 0.5s ease-in-out;
  262. -ms-transition: all 0.5s ease-in-out;
  263. transition: all 0.5s ease-in-out;
  264.  
  265. }
  266. #tags a {
  267. color:{color:tags};
  268. }
  269. #tags a:hover {
  270. color:{color:link hover};
  271. }
  272.  
  273. .post:hover #tags {
  274. opacity:1;
  275. -webkit-transition: all 0.5s ease-in-out;
  276. -moz-transition: all 0.5s ease-in-out;
  277. -o-transition: all 0.5s ease-in-out;
  278. -ms-transition: all 0.5s ease-in-out;
  279. transition: all 0.5s ease-in-out;
  280. }
  281.  
  282.  
  283. h1 {
  284. font-size:14px;
  285. text-transform:none;
  286. font-weight:lighter;
  287. padding-left:10px;
  288. color:{color:title};
  289. }
  290. h1 a {
  291. color:{color:title};
  292. text-transform:none;
  293. }
  294.  
  295. #sidebarimage {
  296. position:fixed;
  297. max-width:160px;
  298. max-height:200px;
  299. margin-top:250px;
  300. margin-left:-255px;
  301. border-radius:100%;
  302. }
  303.  
  304. #sidebarimage img{
  305. background-color:#fff;
  306. opacity:0.9;
  307. max-width:160px;
  308. max-height:200px;
  309. border-radius:100%;
  310. border:1px solid {color:border};
  311. padding:5px;
  312. box-shadow:3px 3px 13px #b8b8b8;
  313. }
  314.  
  315. #sidebar {
  316. position:fixed;
  317. text-align:justify;
  318. width:200px;
  319. margin-top:483px;
  320. z-index:1;
  321. border-bottom:0px solid {color:Border};
  322. margin-left:-280px;
  323. border:1px solid {color:border};
  324. padding:12px;
  325. box-shadow: 3px 3px 16px #b8b8b8;
  326. background-color:#fff;
  327. }
  328.  
  329.  
  330. #links{
  331. position:relative;
  332. width:180px;
  333. margin-bottom:-9px;
  334. padding:1px;
  335. margin-left:3px;
  336. font-weight:bold;
  337. color:#cb8b8b8;
  338. box-shadow: 1px 3px 3px rgba(50,50,50,0.1);
  339.  
  340.  
  341. border-radius:7px;
  342. outline: none;
  343. border-color:#cccccc;
  344. opacity:0.9;
  345. }
  346.  
  347.  
  348.  
  349. #title {
  350. font-size:20px;
  351. color:{color:title};
  352. }
  353.  
  354. .description{
  355. font-size:12px;
  356. text-align:justify;
  357. margin-top:30px;
  358. }
  359.  
  360.  
  361. .pagination {
  362. font-family:georgia;
  363. font-size:10px;
  364. font-style:italic;
  365. line-height:18px;
  366. width:120px;
  367. text-align:center;
  368. position:fixed;
  369. margin-top:39px;
  370. margin-left:35px;
  371. border:0px solid {color:border};
  372. color:{link};
  373. }
  374.  
  375. .pagination a {
  376. color:{color:title};
  377. margin-bottom:10px;
  378. padding:5px;
  379. -webkit-transition: all 0.5s ease-in-out;
  380. -moz-transition: all 0.5s ease-in-out;
  381. -o-transition: all 0.5s ease-in-out;
  382. -ms-transition: all 0.5s ease-in-out;
  383. transition: all 0.5s ease-in-out;
  384. }
  385.  
  386. .pagination a:hover {
  387. color:{color:link hover};
  388. }
  389.  
  390. .quote {
  391. font-family:sans-serif;
  392. font-weight:bold;
  393. font-size:12px;
  394. text-align:right;
  395. line-height:18px;
  396. padding-right:5px;
  397. padding-left:5px;
  398. padding-bottom:5px;
  399. }
  400.  
  401. #source {
  402. text-align:left;
  403. padding-left:20px;
  404. padding-right:5px;
  405. }
  406.  
  407.  
  408. .audio{
  409. position:absolute;
  410. width:40px;
  411. margin-left:10px;
  412. height:40px;
  413. }
  414.  
  415. .button {
  416. width:30px;
  417. height:30px;
  418. overflow:hidden;
  419. position:relative;
  420. opacity:0.6;
  421. z-index:100;
  422. margin:19px 18px 7px 10px;
  423. border-radius:100%;
  424. }
  425.  
  426. .audioplayer {
  427. margin-left:50px;
  428. float:center;
  429. opacity:0.7;
  430. background-color:#ffffff;
  431. position:absolute;
  432. z-index:100;
  433. }
  434.  
  435. .audioimage{
  436. margin-top:-50px;
  437. position:absolute;
  438. width:70px;
  439. height:70px;
  440. }
  441.  
  442. .audioimage img{
  443. float:left;
  444. opacity:1;
  445. width:70px;
  446. }
  447.  
  448. .audiodata {
  449. background-color:{color:background};
  450. font-size:10px;
  451. letter-spacing:1px;
  452. padding:10px;
  453. height:55px;
  454. width:305px;
  455. margin-left:75px;
  456. text-align:center;
  457. }
  458.  
  459.  
  460. .video {
  461. width:390px;
  462. background:#f4f4f4;
  463. padding:5px;
  464. }
  465.  
  466. .data {
  467. background-color:{color:background};
  468. color:{color:text};
  469. text-transform:uppercase;
  470. height:10px; padding:6px 0px 5px 0px;
  471. width:401px;
  472. margin-bottom:-7px;
  473. margin-left:99px;
  474. text-align:center
  475. }
  476.  
  477. .data b {
  478. color:{color:source};
  479. line-height:7px;
  480. }
  481.  
  482.  
  483. .caption {
  484. text-align:center;
  485. margin-top:10px;
  486. padding-left:10px;
  487. padding-right:10px;
  488. font-family:sans-serif;
  489. display:block;
  490. padding:3px;
  491.  
  492. }
  493. .caption img {
  494. max-width:auto;
  495. }
  496.  
  497. blockquote {
  498. padding-left:5px;
  499. border-left:1px solid {color:border};
  500. }
  501.  
  502. #asker {
  503. padding:5px;
  504. font-family:georgia;
  505. text-align:left;
  506. margin-top:0px;
  507. font-size:11px;
  508. font-style:italic;
  509. opacity:0.8;
  510. }
  511.  
  512. #asker a {
  513. letter-spacing:1px;
  514. border-bottom:0px solid {color:link};
  515. }
  516.  
  517. .question {
  518. font-size:12px;
  519. line-height:18px;
  520. font-weight:bold;
  521. text-align:center;
  522. margin-top:-18px;
  523. padding:2px;
  524. }
  525.  
  526. .answer {
  527. font-family:sans-serif;
  528. font-size:12px;
  529. margin-left:2px;
  530. margin-top:-6px;
  531. margin-bottom:-5px;
  532. line-height:18px;
  533. }
  534.  
  535. .answer img{
  536. width:auto;
  537. }
  538.  
  539. ol.notes {
  540. padding-left:13px;
  541. padding-bottom:2%;
  542. padding-top:15%;
  543. width:380px;
  544. list-style-type:none;
  545. text-align:center;
  546. }
  547.  
  548. ol.notes li.note{
  549. border-bottom:1px solid {color:border};
  550. padding:2%;
  551. }
  552.  
  553. ol.notes li.note img.avatar{
  554. width:0px;
  555. height:0px;}
  556.  
  557.  
  558.  
  559.  
  560. </style></head>
  561.  
  562. <body>
  563.  
  564.  
  565. <div id="credit"><a href="http://dehaan.tk/"><img src="http://oi43.tinypic.com/11rryja.jpg"></a></div>
  566.  
  567. <div id="con">
  568.  
  569. <div id="entry">
  570.  
  571. <div id="sidebarimage">
  572. <a href="/"><img src="{image:sidebar}"></a>
  573. </div>
  574.  
  575. <div id="sidebar">
  576.  
  577. <div id="links">
  578. <select onChange="location.href=this.options[this.selectedIndex].value;" id="links">
  579. <center><option>{Title}</option>
  580. {block:IfLink1}<option value="{text:Link 1 URL}">{text:Link 1}</option>{/block:IfLink1}
  581. {block:IfLink2}<option value="{text:Link 2 URL}">{text:Link 2}</option>{/block:IfLink2}
  582. {block:IfLink3}<option value="{text:Link 3 URL}">{text:Link 3}</option>{/block:IfLink3}
  583. {block:IfLink4}<option value="{text:Link 4 URL}">{text:Link 4}</option>{/block:IfLink4}
  584. {block:IfLink5}<option value="{text:Link 5 URL}">{text:Link 5}</option>{/block:IfLink5}
  585. {block:IfLink6}<option value="{text:Link 6 URL}">{text:Link 6}</option>{/block:IfLink6}
  586. </select></div></center>
  587.  
  588. <div class="description">
  589. {Description}
  590. </div>
  591.  
  592. <div class="pagination">
  593. {block:PreviousPage}
  594. <a href="{PreviousPage}">the future</a>
  595. {/block:PreviousPage}
  596. {block:NextPage}
  597. <a href="{NextPage}">the past</a>
  598. {block:NextPage}
  599. </div>
  600.  
  601. </div>
  602.  
  603.  
  604.  
  605. {block:Posts}
  606. <div class="post">
  607. <div id="bottompost"><a href="{Permalink}">{NoteCount}%</a></span><br></div>
  608.  
  609. <div class="text">{block:Text}
  610. {block:Title}<h1>{Title}</h1>{/block:Title}
  611. {Body}
  612. {/block:Text}</div>
  613.  
  614.  
  615. {block:Photo}
  616. <a href="{Permalink}"><img src="{PhotoURL-400}"></a>
  617. {block:Caption}
  618. {block:ifshowcaptions}
  619. <span class="caption">{Caption}</span>
  620. {/block:ifshowcaptions}
  621. {/block:Caption}
  622. {/block:Photo}
  623.  
  624.  
  625. {block:Photoset}
  626. {Photoset-400}
  627. {block:Caption}
  628. {block:ifshowcaptions}
  629. <span class="caption">{Caption}</span>
  630. {/block:ifshowcaptions}
  631. {/block:Caption}
  632. {/block:Photoset}
  633.  
  634. {block:Quote}
  635. <div class="quote">❝ {Quote} ❞</div>
  636. {block:Source}
  637. <div id="source">— {Source}</div>
  638. {/block:Source}
  639. {/block:Quote}
  640.  
  641.  
  642. {block:Link}
  643. <h1><a href="{URL}" {Target}>{Name}</a></h1>
  644. {block:Description}
  645. <div style="padding-left:5px;padding-right:5px;">{Description}</div>
  646. {/block:Description}
  647. {/block:Link}
  648.  
  649.  
  650. {block:Chat}
  651. {block:Title}<h1>{Title}</h1>{/block:Title}
  652. {block:Lines}
  653. {block:Label}<b>{Label}</b>{/block:Label} {Line}<br>
  654. {/block:Lines}
  655. {/block:Chat}
  656.  
  657. {block:Audio}
  658. <div class="audio">
  659. <div class="adioplayer"><div class="button">{block:AudioPlayer}{AudioPlayerWhite}{/block:AudioPlayer}</div></div>
  660. <div class="audioimage"><img src="http://static.tumblr.com/jn9hrij/20Ul2zzsr/albumart.jpg"></div>{block:AlbumArt}<div class="audioimage"><img src="{AlbumArtURL}"></div>{/block:AlbumArt}</div>
  661. <div class="audiodata"><br><font style="text-transform:lowercase">{block:TrackName}{TrackName} - {/block:TrackName}
  662. {block:Artist}{Artist}{/block:Artist}</font></div>
  663. <br>
  664.  
  665. {block:Caption}
  666. {block:ifshowcaptions}
  667. <span class="caption">{Caption}</span>
  668. {/block:ifshowcaptions}
  669. {/block:Caption}
  670. {/block:Audio}
  671.  
  672.  
  673. {block:Video}
  674. {Video-400}
  675. {block:Caption}
  676. {block:ifshowcaptions}
  677. <span class="caption">{Caption}</span>
  678. {/block:ifshowcaptions}
  679. {/block:Caption}
  680. {/block:Video}
  681.  
  682.  
  683. {block:Answer}
  684. <div id="asker"><center>{Asker} whispered: </div>
  685. <div class="question">
  686. <br>“{Question}”</font></center></div>
  687. <div class="answer" style="width:390px; text-align:center;">{Answer} </div>
  688. {/block:Answer}
  689.  
  690. <center><div id="tags">{block:HasTags}{block:Tags}
  691. <span style="opacity:0.5;"></span><a href="/tagged/{Tag}">{Tag}.</a>&nbsp;{/block:Tags}{/block:HasTags}</div></center>
  692.  
  693.  
  694. {block:PermalinkPage}
  695. <br><div id="permalinkpage">
  696. {block:Date}{DayOfWeek} {DayofMonth} of {Month}, {Year},{/block:Date}
  697. {block:NoteCount} with {NoteCountWithLabel} {/block:NoteCount}
  698. <br>{block:ContentSource}by: <a href="{SourceURL}">{SourceTitle}</a>{/block:ContentSource} {block:RebloggedFrom} &nbsp; via: <a href="{ReblogParentURL}">{ReblogParentName}</a>{/block:RebloggedFrom}</a>
  699. {/block:PermalinkPage}
  700.  
  701. </div>
  702.  
  703. {block:PermalinkPage}
  704. {block:PostNotes}
  705. <div id="notes" style="margin-top:40px;">{PostNotes}</div>
  706. {/block:PostNotes}
  707. {/block:permalinkpage}
  708.  
  709.  
  710. {/block:Posts}
  711.  
  712. </div>
  713.  
  714.  
  715. </div>
  716.  
  717. </body>
  718. </html>
Advertisement
Add Comment
Please, Sign In to add comment