Advertisement
ammetrine

CLINOHUMITE Theme by Amemtrine

Feb 13th, 2016
191
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 16.28 KB | None | 0 0
  1. <!DOCTYPE html>
  2. <head>
  3. <link href='https://fonts.googleapis.com/css?family=Handlee' rel='stylesheet' type='text/css'>
  4. <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css">
  5. <link href='https://fonts.googleapis.com/css?family=Raleway' rel='stylesheet' type='text/css'>
  6. <script type="text/javascript"
  7. src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>
  8. <script>
  9. $(document).ready(function() {
  10. //
  11. $('a.poplight[href^=#]').click(function() {
  12. var popID = $(this).attr('rel'); //Get Popup Name
  13. var popURL = $(this).attr('href'); //Get Popup href to define size
  14. var query= popURL.split('?');
  15. var dim= query[1].split('&');
  16. var popWidth = dim[0].split('=')[1]; //Gets the first query string value
  17. $('#' + popID).fadeIn().css({ 'width': Number( popWidth ) }).prepend('<a href="#" class="close"></a>');
  18. var popMargTop = ($('#' + popID).height() + 80) / 2;
  19. var popMargLeft = ($('#' + popID).width() + 80) / 2;
  20. //Apply Margin to Popup
  21. $('#' + popID).css({
  22. 'margin-top' : -popMargTop,
  23. 'margin-left' : -popMargLeft
  24. });
  25. $('body').append('<div id="fade"></div>');
  26. $('#fade').css({'filter' : 'alpha(opacity=80)'}).fadeIn(); //Fade in the fade layer - .css({'filter' : 'alpha(opacity=80)'})
  27. return false;
  28. });
  29. $('a.close, #fade').live('click', function() {
  30. $('#fade , .popup_block').fadeOut(function() {
  31. $('#fade, a.close').remove(); //fade them both out
  32. });
  33. return false;
  34. });
  35. });
  36. </script>
  37.  
  38.  
  39.  
  40.  
  41. <title>{Title}</title>
  42.  
  43. <link rel="shortcut icon" href="{Favicon}">
  44. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  45. {block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}
  46.  
  47.  
  48. <meta name="image:Background" content=""/>
  49. <meta name="color:Background" content="#ffffff"/>
  50. <meta name="color:Blog Title" content="#000000"/>
  51. <meta name="color:Description" content="#000000" />
  52. <meta name="color:Text" content="#000000"/>
  53. <meta name="color:Link" content="#000000"/>
  54. <meta name="color:Link Hover" content="#000000"/>
  55. <meta name="color:Scrollbar" content="#ffefd8"/>
  56. <meta name="color:Sidebar Border" content="#000000"/>
  57. <meta name="color:Sidebar Background" content="#ffefd8"/>
  58. <meta name="color:Navlinks" content="#000000"/>
  59. <meta name="color:Navlinks Hover" content="#000000"/>
  60. <meta name="color:Post Background" content="#ffefd8"/>
  61. <meta name="color:Post Border" content="#000000"/>
  62. <meta name="color:Perma Background" content="#ffefd8"/>
  63. <meta name="color:Perma Border" content="#000000"/>
  64. <meta name="color:Perma Text" content="#000000"/>
  65. <meta name="color:Perma Text Hover" content="#000000"/>
  66. <meta name="color:Credit BG" content="#ffefd8"/>
  67.  
  68.  
  69. <meta name="if:Show Custom Link 1" content="1"/>
  70. <meta name="if:Show Custom Link 2" content="1"/>
  71. <meta name="if:Show Custom Link 3" content="1"/>
  72.  
  73.  
  74. <meta name="text:Link 1 URL" content="" />
  75. <meta name="text:Link 1 Title" content="" />
  76. <meta name="text:Link 2 URL" content="" />
  77. <meta name="text:Link 2 Title" content="" />
  78. <meta name="text:Link 3 URL" content="" />
  79. <meta name="text:Link 3 Title" content="" />
  80.  
  81.  
  82. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  83.  
  84.  
  85. <script src="http://static.tumblr.com/rzl30kg/eAxm7a751/jquery.style-my-tooltips.js"></script>
  86. <script>
  87. (function($){
  88. $(document).ready(function(){
  89. $("[title]").style_my_tooltips({
  90. tip_follows_cursor:true,
  91. tip_delay_time:0,
  92. tip_fade_speed:0
  93. }
  94. );
  95. });
  96. })(jQuery);
  97. </script>
  98.  
  99.  
  100. <link href='http://fonts.googleapis.com/css?family=Lato' rel='stylesheet' type='text/css'>
  101.  
  102.  
  103. <style type="text/css">
  104.  
  105. ::-webkit-scrollbar-thumb{
  106. background-color:{color:scrollbar};
  107. border:1px solid {color:background};
  108. height:6px;
  109. }
  110.  
  111. ::-webkit-scrollbar {
  112. height:6px;
  113. width:4px;
  114. background-color:{color:background};
  115. }
  116.  
  117. #s-m-t-tooltip{
  118. position:absolute;
  119. margin-top: 15px;
  120. z-index:9999;
  121. background:{color:background};
  122. }
  123.  
  124.  
  125. body {
  126. background:{color:Background};
  127. color:{color:text};
  128. font-family: 'Raleway', sans-serif;
  129. font-size:11px;
  130. text-align:justify;
  131. margin:0;
  132. line-height:16px;
  133.  
  134.  
  135. background-color:{color:Background};
  136. background-image:url('{image:background}');
  137. background-attachment:fixed;
  138.  
  139. }
  140.  
  141.  
  142. a {
  143. color:{color:link};
  144. text-decoration:none;
  145. -webkit-transition: all 0.2s ease-in-out;
  146. -moz-transition: all 0.2s ease-in-out;
  147. -o-transition: all 0.2s ease-in-out;
  148. }
  149.  
  150.  
  151. #sidebar {
  152. text-align:left;
  153. position:fixed;
  154. left:125px;
  155. top:110px;
  156. width:190px;
  157. border:Solid 1px {color:Sidebar Border};
  158. padding:7px;
  159. background:{color:Sidebar Background};
  160. }
  161.  
  162.  
  163. #blogt {
  164. font-size:22px;
  165. text-align:right;
  166. font-family: 'Raleway', sans-serif;
  167. text-transform:uppercase;
  168. color:{color:Blog Title};
  169. padding-top:7px;
  170. padding-bottom:13px;
  171. border-bottom:Dashed 1px {color:Sidebar Border};
  172. }
  173.  
  174.  
  175. .navlinks {
  176. line-height:16px;
  177. text-transform:lowercase;
  178. position:relative;
  179. font-family: 'Raleway', sans-serif;
  180. text-align:right;
  181.  
  182. }
  183.  
  184.  
  185. .navlinks a {
  186. margin-right:5px;
  187. margin-bottom:5px;
  188. display:inline-block;
  189. color:{color:Navlinks};
  190. }
  191.  
  192.  
  193. .navlinks a:hover {
  194. color:{color:Navlinks Hover};
  195. -webkit-transition:opacity 0.3s ease-in-out; opacity: 0.5;
  196. -webkit-transition:all 0.3s ease-in-out;
  197. -moz-transition:all 0.3s ease-in-out;
  198. transition:all 0.3s ease-in-out;
  199. }
  200.  
  201.  
  202. #description {
  203. margin:15px 0;
  204. color:{color:Description};
  205. font-family: 'Raleway', sans-serif;
  206. text-align:right;
  207. border-bottom:Dashed 1px {color:Sidebar Border};
  208. padding-bottom:15px;
  209. }
  210.  
  211.  
  212. #con {
  213. left:50%;
  214. margin-left:-250px;
  215. position:absolute;
  216. }
  217.  
  218.  
  219. #entries {
  220. width:650px;
  221. margin-top:50px;
  222. margin-left:20px;
  223.  
  224. {block:PermalinkPage}
  225. width:500px;
  226. {/block:PermalinkPage}
  227. }
  228.  
  229.  
  230. .posts {
  231. width:200px;
  232. float:left;
  233. margin-right:40px;
  234. padding:20px 20px 15px 20px;
  235. background:{color:Post Background};
  236. border:Solid 1px {color:Post Border};
  237. {block:IndexPage}
  238. margin-bottom:40px;
  239. {/block:IndexPage}
  240.  
  241.  
  242. {block:PermalinkPage}
  243. width:500px;
  244. margin-bottom:30px;
  245. position:relative;
  246. float:left;
  247. {/block:PermalinkPage}
  248. }
  249.  
  250.  
  251. .posts img {
  252. max-width:250px;
  253. }
  254.  
  255. .posts img, .posts li, .posts blockquote {max-width: 100%;}
  256. .caption {width:100%;
  257. margin-top:10px;
  258.  
  259. }
  260.  
  261. #title {
  262. font-size:12px;
  263. line-height:18px;
  264. font-weight:bold;
  265. margin-bottom:10px;
  266. text-transform:uppercase;
  267. text-align:left;
  268. }
  269.  
  270.  
  271. .text {
  272. font-size:11px;
  273. font-family: 'Raleway', sans-serif;
  274. }
  275.  
  276.  
  277. .text a:hover {
  278. text-decoration:underline;
  279. -webkit-transition:opacity 0.3s ease-in-out; opacity: 0.5;
  280. -webkit-transition:all 0.3s ease-in-out;
  281. -moz-transition:all 0.3s ease-in-out;
  282. transition:all 0.3s ease-in-out;
  283. }
  284.  
  285.  
  286. #quote{
  287. text-align:left;
  288. font-size:14px;
  289. line-height:18px;
  290. font-weight:bold;
  291. }
  292.  
  293.  
  294. #quote a:hover {
  295. text-decoration:underline;
  296. -webkit-transition:opacity 0.3s ease-in-out; opacity: 0.5;
  297. -webkit-transition:all 0.3s ease-in-out;
  298. -moz-transition:all 0.3s ease-in-out;
  299. transition:all 0.3s ease-in-out;
  300. }
  301.  
  302.  
  303. #quotesource {
  304. margin-top:15px;
  305. margin-left:15px;
  306.  
  307. }
  308.  
  309.  
  310. .player {
  311. width:25px;
  312. height:25px;
  313. overflow:hidden;
  314. position:absolute;
  315. margin-left:12px;
  316. margin-top:12px;
  317. background:white;
  318. }
  319.  
  320.  
  321. .audioinfo {
  322. margin-left:70px;
  323. }
  324.  
  325.  
  326. .albumart {
  327. position:absolute;
  328. {block:IndexPage}
  329. width:60px;
  330. height:60px;
  331. {/block:IndexPage}
  332. {block:PermalinkPage}
  333. width:60px;
  334. height:60px;
  335. {/block:PermalinkPage}
  336. }
  337.  
  338.  
  339. .albumart img {
  340. float:left;
  341. {block:IndexPage}
  342. width:60px;
  343. height:60px;
  344. {/block:IndexPage}
  345. {block:PermalinkPage}
  346. width:60px;
  347. height:60px;
  348. {/block:PermalinkPage}
  349. }
  350.  
  351.  
  352. .question {
  353. margin-bottom:10px;
  354. border-bottom:Dashed 1px {color:Sidebar Borders};
  355. padding-bottom:5px;
  356. }
  357.  
  358. .asker {
  359. font-weight:bold;
  360. }
  361.  
  362.  
  363. .answer {
  364. margin-top:10px;
  365. }
  366.  
  367.  
  368. .chat ol {
  369. padding:0;
  370. list-style:none;
  371. }
  372.  
  373.  
  374. .line {
  375. padding:5px 0;
  376. }
  377.  
  378.  
  379. .label {
  380. font-weight:bold;
  381. }
  382.  
  383.  
  384. #permalink {
  385. margin:5px;
  386. font-size:11px;
  387. text-align:left;
  388. padding:5px;
  389. opacity:0;
  390. position:absolute;
  391. bottom:-37px;
  392. right:-7px;
  393. background:{color:Perma Background};
  394. border:solid 1px {color:Perma Border};
  395. }
  396.  
  397. .posts:hover #permalink {
  398. opacity:1;
  399. }
  400.  
  401.  
  402. #permalink a {
  403.  
  404. color:{color:Perma Text};
  405. padding:3px;
  406. }
  407.  
  408.  
  409. #permalink a:hover {
  410. padding:3px;
  411. color:{color:Perma Text Hover};
  412. -webkit-transition:opacity 0.3s ease-in-out; opacity: 0.5;
  413. -webkit-transition:all 0.3s ease-in-out;
  414. -moz-transition:all 0.3s ease-in-out;
  415. transition:all 0.3s ease-in-out;
  416. }
  417.  
  418.  
  419. .pagination {
  420. display:none;
  421. }
  422.  
  423.  
  424. .popup_block{
  425. display:none;
  426. background:#fff;
  427. padding:20px;
  428. border:1px solid #eee; /* if you want a solid white pop-up, delete this */
  429. float:left;
  430. position:fixed;
  431. top:50%;left:50%;
  432. z-index: 99999;
  433. -webkit-box-shadow: 0px 0px 20px #000; /* delete for solid white */
  434. -moz-box-shadow: 0px 0px 20px #000; /* delete for solid white */
  435. box-shadow: 0px 0px 20px #000; /* delete for solid white */
  436. }
  437.  
  438. *html #fade {position: absolute;}
  439. *html .popup_block {position: absolute;}
  440. #fade {
  441. display:none;
  442. position:fixed;
  443. left:0px;
  444. top:0px;
  445. width:100%;
  446. height:100%;
  447. z-index:9999;
  448. background:#000; /* change to #fff for solid white */
  449. opacity:0.5; /* change to opacity:1; */
  450. }
  451.  
  452.  
  453. .notes {
  454. padding-left:20px;
  455. font-size:11px;
  456. }
  457.  
  458. .pagination {
  459. display: none;
  460. }
  461.  
  462.  
  463. #credit {
  464. position:fixed;
  465. right:20px;
  466. bottom:5px;
  467. background:{color:Credit BG};
  468. padding-top:5px;
  469. padding-right:5px;
  470. padding-left:5px;
  471. padding-bottom:2px;
  472. font-size:12px;
  473. font-family: 'Handlee', cursive;
  474. z-index:9999;
  475. }
  476.  
  477. #credit a{
  478. color:#666;
  479. }
  480.  
  481.  
  482. {CustomCSS}
  483. </style>
  484.  
  485. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script>
  486.  
  487. <script src="http://static.tumblr.com/6hsqxdt/vmwm2rb4g/infinitescrolling.js"></script><script src="http://static.tumblr.com/6hsqxdt/QBym35odk/jquery.masonry.js"></script>
  488.  
  489. <script>
  490. $(function(){
  491. var $container = $('#entries');
  492. $container.imagesLoaded(function(){
  493. $container.masonry({
  494. itemSelector: '.posts',
  495. });
  496. });
  497. $container.infinitescroll({
  498. itemSelector : ".posts",
  499. navSelector : "div.pagination",
  500. nextSelector : ".pagination a#next",
  501. loadingImg : "",
  502. loadingText : "<em></em>",
  503. bufferPx : 10000,
  504. extraScrollPx: 12000,
  505. },
  506. // trigger Masonry as a callback
  507. function( newElements ) {
  508. var $newElems = $( newElements ).css({ opacity: 0 });
  509. // ensure that images load before adding to masonry layout
  510. $newElems.imagesLoaded(function(){
  511. $newElems.animate({ opacity: 1 });
  512. $container.masonry( 'appended', $newElems, true );
  513. });
  514. }
  515. );
  516. });
  517. </script>
  518.  
  519.  
  520. </head>
  521.  
  522. <body>
  523.  
  524. <div id="con">
  525.  
  526. <div id="credit"><a href="http://ammetrine.tumblr.com/">AT</a></div>
  527.  
  528. <div id="sidebar">
  529. <div id="blogt">{Title}</div>
  530. <div id="description">{Description}</div>
  531.  
  532. <div class="navlinks">
  533. <a href="/">home</a>
  534. <a href="#?w=400" rel="box1" class="poplight">inbox</a>
  535. <a href="/archive">archive</a>
  536. {block:ifShowCustomlink1}<a href="{text:Link 1 URL}">{text:Link 1 Title}</a>
  537. {/block:ifShowCustomLink1}
  538. {block:ifShowCustomlink2}<a href="{text:Link 2 URL}" >{text:Link 2 Title}</a>{/block:ifShowCustomLink2}
  539. {block:ifShowCustomlink3}<a href="{text:Link 3 URL}">{text:Link 3 Title}</a>{/block:ifShowCustomLink3}
  540. <a href="http://ammetrine.tumblr.com" target="_blank"><i class="fa fa-copyright"></i>
  541. </a>
  542. </div>
  543.  
  544. </div>
  545.  
  546.  
  547. <div id="entries">
  548.  
  549. {block:Posts}
  550.  
  551. <div class="posts">
  552.  
  553. {block:Quote}
  554. <div class="quote">
  555. '<strong><i>{Quote}</i></strong>'
  556. </div>
  557. {block:Source}
  558. <br><div class="quotesource">β€” {Source}</div>
  559. {/block:Source}
  560.  
  561. {block:IndexPage}
  562. <div id="permalink">
  563. <a href="{Permalink}" >{NoteCount}</a>
  564. <a href="{ReblogURL}">reblog</a>
  565. </div>
  566. {/block:IndexPage}
  567. {/block:Quote}
  568.  
  569.  
  570. {block:Text}
  571. {block:Title}
  572. <div id="title">{Title}</div>
  573. {/block:Title}
  574. <div class="text">
  575. {Body}
  576. </div>
  577.  
  578. {block:IndexPage}
  579. <div id="permalink">
  580. <a href="{Permalink}" >{NoteCount}</a>
  581. <a href="{ReblogURL}">reblog</a>
  582. </div>
  583. {/block:IndexPage}
  584. {/block:Text}
  585.  
  586.  
  587. {block:Link}
  588. <div id="title">
  589. <a href="{URL}">{Name}</a>
  590. </div>
  591. {block:Description}{Description}{/block:Description}
  592.  
  593. {block:IndexPage}
  594. <div id="permalink">
  595. <a href="{Permalink}" >{NoteCount}</a>
  596. <a href="{ReblogURL}">reblog</a>
  597. </div>
  598. {/block:IndexPage}
  599. {/block:Link}
  600.  
  601.  
  602. {block:Chat}
  603. {block:Title}
  604. <h1>{Title}</h1>
  605. {/block:Title}
  606. <div class="chat">
  607. <ol>{block:Lines}
  608. <li class="line {Alt}">
  609. {block:Label}
  610. <span class="label">
  611. {Label}</span>
  612. {/block:Label}{Line}</li>
  613. {/block:Lines}
  614. </ol>
  615. </div>
  616.  
  617. {block:IndexPage}
  618. <div id="permalink">
  619. <a href="{Permalink}" >{NoteCount}</a>
  620. <a href="{ReblogURL}"</a>
  621. </div>
  622. {/block:IndexPage}
  623. {/block:Chat}
  624.  
  625.  
  626. {block:Photo}
  627. {block:IndexPage}
  628. <a href="{Permalink}"><img src="{PhotoURL-500}" alt="{PhotoAlt}"/></a>
  629.  
  630. <div id="permalink">
  631. <a href="{Permalink}" >{NoteCount}</a>
  632. <a href="{ReblogURL}">reblog</a>
  633. </div>
  634. {/block:IndexPage}
  635.  
  636. {block:PermalinkPage}
  637. <img src="{PhotoURL-500}" alt="{PhotoAlt}"/>
  638. <br>
  639. {/block:PermalinkPage}
  640. {/block:Photo}
  641.  
  642.  
  643. {block:Photoset}
  644. {block:IndexPage}
  645. {Photoset}
  646.  
  647. <div id="permalink">
  648. <a href="{Permalink}" >{NoteCount}</a>
  649. <a href="{ReblogURL}">reblog</a>
  650. </div>
  651. {/block:IndexPage}
  652. {block:PermalinkPage}{Photoset-500}{/block:PermalinkPage}
  653. {/block:Photoset}
  654.  
  655.  
  656. {block:Video}
  657. {Video-250}
  658.  
  659. {block:IndexPage}
  660. <div id="permalink">
  661. <a href="{Permalink}" >{NoteCount}</a>
  662. <a href="{ReblogURL}">reblog</a>
  663. </div>
  664. {/block:IndexPage}
  665. {/block:Video}
  666.  
  667.  
  668. {block:Audio}
  669. {block:AlbumArt}
  670. <div class="albumart">
  671. <img src="{AlbumArtURL}">
  672. </div>
  673. {/block:AlbumArt}
  674. <div class="player">{AudioPlayerWhite}</div>
  675.  
  676. <div class="audioinfo">
  677. Title: {block:TrackName}{TrackName}{/block:TrackName}<br>
  678.  
  679. Artist: {block:Artist}{Artist}{/block:Artist}<br>
  680.  
  681. Plays: {block:PlayCount}{FormattedPlayCount}{/block:PlayCount}
  682.  
  683. {block:IndexPage}
  684. <div id="permalink">
  685. <a href="{Permalink}" >{NoteCount}</a>
  686. <a href="{ReblogURL}">reblog</a>
  687. </div>
  688. {/block:IndexPage}
  689. </div>
  690. {/block:Audio}
  691.  
  692.  
  693. {block:Answer}
  694. <div class="question">
  695. <div class="asker">{Asker} said: </div>
  696. {Question}
  697. </div>
  698. <div class="answer">{Answer}</div>
  699.  
  700. {block:IndexPage}
  701. <div id="permalink">
  702. <a href="{Permalink}" >{NoteCount}</a>
  703. <a href="{ReblogURL}">reblog</a>
  704. </div>
  705. {/block:IndexPage}
  706. {/block:Answer}
  707.  
  708.  
  709.  
  710. {block:PermalinkPage}
  711. <div class="notes">
  712. {block:Date}{Caption} posted {TimeAgo}{/block:Date}
  713. {block:NoteCount} with {NoteCount} notes {/block:NoteCount}
  714. {block:RebloggedFrom}
  715. via <a href="{ReblogParentURL}">{ReblogParentName}</a>,
  716. {/block:RebloggedFrom}
  717. {block:ContentSource}originally from <a href="{SourceURL}">{SourceTitle} </a>{/block:ContentSource}
  718. <br>{block:hastags}{block:tags}#<a href="/tagged/{Tag}">{Tag}</a> &nbsp;&nbsp; {/block:tags}{/block:hastags}
  719. <br>{PostNotes}
  720. </div>
  721. {/block:PermalinkPage}
  722.  
  723. </div>
  724. {/block:Posts}
  725.  
  726. <div class="pagination">
  727. {block:Pagination}{block:PreviousPage}<a href="{PreviousPage}">previous</a> &middot;{/block:PreviousPage} {block:NextPage}<a href="{NextPage}" id="next">next</a>{/block:NextPage}{/block:Pagination}
  728. </div>
  729.  
  730.  
  731.  
  732. </div>
  733.  
  734. </div>
  735.  
  736. </body>
  737.  
  738. <div id="box1" class="popup_block">
  739. <iframe frameborder="0" height="200" id="ask_form" scrolling="yes" src="http://www.tumblr.com/ask_form/{Name}.tumblr.com" width="100%"></iframe>
  740.  
  741. </div>
  742.  
  743.  
  744. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement