Advertisement
ammetrine

Tanzanite Theme by Ammetrine

Feb 10th, 2016
95
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 15.66 KB | None | 0 0
  1. <!DOCTYPE html>
  2. <head>
  3.  
  4. <link href='https://fonts.googleapis.com/css?family=Raleway' rel='stylesheet' type='text/css'>
  5.  
  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="#666666"/>
  51. <meta name="color:Description" content="#666666" />
  52. <meta name="color:Text" content="#000000"/>
  53. <meta name="color:Link" content="#ccbccf"/>
  54. <meta name="color:Link Hover" content="#aaaaaa"/>
  55. <meta name="color:Scrollbar" content="#ccbccf"/>
  56. <meta name="color:Post Border" content="#ccbccf"/>
  57. <meta name="color:Blog Border" content="#ccbccf"/>
  58. <meta name="color:Description BG" content="#ccbccf"/>
  59. <meta name="color:Popup BG" content="#ccbccf"/>
  60.  
  61.  
  62. <meta name="if:Show Custom Link 1" content="1"/>
  63. <meta name="if:Show Custom Link 2" content="1"/>
  64. <meta name="if:Show Custom Link 3" content="1"/>
  65.  
  66.  
  67. <meta name="text:Link 1 URL" content="" />
  68. <meta name="text:Link 1 Title" content="" />
  69. <meta name="text:Link 2 URL" content="" />
  70. <meta name="text:Link 2 Title" content="" />
  71. <meta name="text:Link 3 URL" content="" />
  72. <meta name="text:Link 3 Title" content="" />
  73.  
  74.  
  75. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  76.  
  77.  
  78. <script src="http://static.tumblr.com/rzl30kg/eAxm7a751/jquery.style-my-tooltips.js"></script>
  79. <script>
  80. (function($){
  81. $(document).ready(function(){
  82. $("[title]").style_my_tooltips({
  83. tip_follows_cursor:true,
  84. tip_delay_time:0,
  85. tip_fade_speed:0
  86. }
  87. );
  88. });
  89. })(jQuery);
  90. </script>
  91.  
  92.  
  93. <link href='http://fonts.googleapis.com/css?family=Lato' rel='stylesheet' type='text/css'>
  94.  
  95.  
  96. <style type="text/css">
  97.  
  98.  
  99. #left {
  100. width:27px;
  101. height:100%;
  102. background-color:{color:Blog Border};
  103. z-index:999;
  104. left:0;
  105. position:fixed;}
  106.  
  107. #right {
  108. width:27px;
  109. height:100%;
  110. right:0;
  111. background-color:{color:Blog Border};
  112. z-index:999;
  113. position:fixed;}
  114.  
  115. ::-webkit-scrollbar-thumb{
  116. background-color:{color:scrollbar};
  117. border:1px solid {color:background};
  118. height:6px;
  119. }
  120.  
  121. ::-webkit-scrollbar {
  122. height:6px;
  123. width:4px;
  124. background-color:{color:background};
  125. }
  126.  
  127. #s-m-t-tooltip{
  128. position:absolute;
  129. margin-top: 15px;
  130. z-index:9999;
  131. background:{color:background};
  132. }
  133.  
  134.  
  135. body {
  136. background:{color:Background};
  137. color:{color:text};
  138. font-family: 'Raleway', sans-serif;
  139. font-size:11px;
  140. text-align:justify;
  141. margin:0;
  142. line-height:16px;
  143.  
  144.  
  145. background-color:{color:Background};
  146. background-image:url('{image:background}');
  147. background-attachment:fixed;
  148.  
  149. }
  150.  
  151.  
  152. a {
  153. color:{color:link};
  154. text-decoration:none;
  155. -webkit-transition: all 0.2s ease-in-out;
  156. -moz-transition: all 0.2s ease-in-out;
  157. -o-transition: all 0.2s ease-in-out;
  158. }
  159.  
  160.  
  161. #sidebar {
  162. text-align:justify;
  163. position:fixed;
  164. margin-left:580px;
  165. top:100px;
  166. width:220px;
  167. padding:7px;
  168. background:#fff;
  169.  
  170. {block:if2columns}
  171. margin-left:-230px;
  172. {/block:if2columns}
  173.  
  174. }
  175.  
  176.  
  177. #blogt {
  178. font-size:25px;
  179. text-align:left;
  180. padding:5px;
  181. border-bottom:1px solid #666;
  182. font-family: 'Raleway', sans-serif;
  183. text-transform:uppercase;
  184. color:{color:Blog Title};
  185. }
  186.  
  187.  
  188. .navlinks {
  189. color:{color:Link}
  190. line-height:16px;
  191. text-transform:lowercase;
  192. position:relative;
  193. font-family: 'Raleway', sans-serif;
  194. text-align:left;
  195. font-style:italic;
  196. }
  197.  
  198.  
  199. .navlinks a {
  200. margin-right:5px;
  201. margin-bottom:5px;
  202. display:inline-block;
  203. }
  204.  
  205.  
  206. .navlinks a:hover {
  207. color:{color:Link Hover};
  208. background:#fff;
  209. -webkit-transition:opacity 0.3s ease-in-out; opacity: 0.5;
  210. -webkit-transition:all 0.3s ease-in-out;
  211. -moz-transition:all 0.3s ease-in-out;
  212. transition:all 0.3s ease-in-out;
  213. }
  214.  
  215.  
  216. #description {
  217. margin:15px 0;
  218. color:{color:Description};
  219. background:{color:Description BG};
  220. font-family: 'Raleway', sans-serif;
  221. text-align:left;
  222. }
  223.  
  224.  
  225. #con {
  226. left:50%;
  227. margin-left:-350px;
  228. position:absolute;
  229. }
  230.  
  231.  
  232. #entries {
  233. width:600px;
  234. margin-top:50px;
  235. margin-left:-20px;
  236.  
  237. {block:if2columns}
  238. width:650px;
  239. {/block:if2columns}
  240.  
  241. {block:PermalinkPage}
  242. width:500px;
  243. {/block:PermalinkPage}
  244. }
  245.  
  246.  
  247. .posts {
  248. border: 10px solid {color:Post Border};
  249. width:220px;
  250. float:left;
  251. margin-right:40px;
  252.  
  253. {block:IndexPage}
  254. margin-bottom:40px;
  255. {/block:IndexPage}
  256.  
  257.  
  258. {block:PermalinkPage}
  259. width:500px;
  260. margin-bottom:30px;
  261. position:relative;
  262. float:left;
  263. {/block:PermalinkPage}
  264. }
  265.  
  266.  
  267. .posts img {
  268. max-width:250px;
  269. }
  270.  
  271. .posts img, .posts li, .posts blockquote {max-width: 100%;}
  272. .caption {width:100%;
  273. margin-top:10px;
  274.  
  275. }
  276.  
  277. #title {
  278. font-size:12px;
  279. line-height:18px;
  280. font-weight:bold;
  281. margin-bottom:10px;
  282. text-transform:uppercase;
  283. text-align:left;
  284. }
  285.  
  286.  
  287. .text {
  288. padding:5px;
  289. font-size:11px;
  290. font-family: 'Raleway', sans-serif;
  291. }
  292.  
  293.  
  294. .text 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. #quote{
  304. padding:5px;
  305. text-align:left;
  306. font-size:14px;
  307. line-height:18px;
  308. font-weight:bold;
  309. }
  310.  
  311.  
  312. #quote a:hover {
  313. text-decoration:underline;
  314. -webkit-transition:opacity 0.3s ease-in-out; opacity: 0.5;
  315. -webkit-transition:all 0.3s ease-in-out;
  316. -moz-transition:all 0.3s ease-in-out;
  317. transition:all 0.3s ease-in-out;
  318. }
  319.  
  320.  
  321. #quotesource {
  322. margin-top:15px;
  323. margin-left:15px;
  324.  
  325. }
  326.  
  327.  
  328. .player {
  329. width:25px;
  330. height:25px;
  331. overflow:hidden;
  332. position:absolute;
  333. margin-left:12px;
  334. margin-top:12px;
  335. background:white;
  336. }
  337.  
  338.  
  339. .audioinfo {
  340. margin-left:70px;
  341. }
  342.  
  343.  
  344. .albumart {
  345. position:absolute;
  346. {block:IndexPage}
  347. width:60px;
  348. height:60px;
  349. {/block:IndexPage}
  350. {block:PermalinkPage}
  351. width:60px;
  352. height:60px;
  353. {/block:PermalinkPage}
  354. }
  355.  
  356.  
  357. .albumart img {
  358. float:left;
  359. {block:IndexPage}
  360. width:60px;
  361. height:60px;
  362. {/block:IndexPage}
  363. {block:PermalinkPage}
  364. width:60px;
  365. height:60px;
  366. {/block:PermalinkPage}
  367. }
  368.  
  369.  
  370. .question {
  371. padding:5px;
  372. margin-bottom:10px;
  373. }
  374.  
  375. .asker {
  376. font-weight:bold;
  377. }
  378.  
  379.  
  380. .answer {
  381. padding:5px;
  382. margin-top:10px;
  383. }
  384.  
  385.  
  386. .chat ol {
  387. padding:5px;
  388. list-style:none;
  389. }
  390.  
  391.  
  392. .line {
  393. padding:5px 0;
  394. }
  395.  
  396.  
  397. .label {
  398. font-weight:bold;
  399. }
  400.  
  401.  
  402. #permalink {
  403. margin:-5px;
  404. font-size:11px;
  405. text-align:left;
  406. padding:3px;
  407. background:#ccbccf;
  408.  
  409. }
  410.  
  411.  
  412. #permalink a {
  413. margin-left:10px;
  414. color:#444;
  415. padding:3px;
  416. }
  417.  
  418.  
  419. #permalink a:hover {
  420. padding:3px;
  421. color:{color:Link Hover};
  422. -webkit-transition:opacity 0.3s ease-in-out; opacity: 0.5;
  423. -webkit-transition:all 0.3s ease-in-out;
  424. -moz-transition:all 0.3s ease-in-out;
  425. transition:all 0.3s ease-in-out;
  426. }
  427.  
  428.  
  429. .pagination {
  430. display:none;
  431. }
  432.  
  433.  
  434. .popup_block{
  435. display:none;
  436. background:{color:popup BG};
  437. padding:20px;
  438. float:left;
  439. position:fixed;
  440. top:50%;left:50%;
  441. z-index: 99999;
  442. -webkit-box-shadow: 0px 0px 20px #aaa; /* delete for solid white */
  443. -moz-box-shadow: 0px 0px 20px #aaa; /* delete for solid white */
  444. box-shadow: 0px 0px 20px #aaa; /* delete for solid white */
  445. }
  446.  
  447. *html #fade {position: absolute;}
  448. *html .popup_block {position: absolute;}
  449. #fade {
  450. display:none;
  451. position:fixed;
  452. left:0px;
  453. top:0px;
  454. width:100%;
  455. height:100%;
  456. z-index:9999;
  457. background:#000; /* change to #fff for solid white */
  458. opacity:0.5; /* change to opacity:1; */
  459. }
  460.  
  461.  
  462. .notes {
  463. padding-left:20px;
  464. font-size:11px;
  465. }
  466.  
  467. .pagination {
  468. display: none;
  469. }
  470.  
  471.  
  472. #credit {
  473. position:fixed;
  474. right:10px;
  475. z-index:9999;
  476. bottom:5px;
  477. }
  478.  
  479.  
  480. {CustomCSS}
  481. </style>
  482.  
  483. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script>
  484.  
  485. <script src="http://static.tumblr.com/6hsqxdt/vmwm2rb4g/infinitescrolling.js"></script><script src="http://static.tumblr.com/6hsqxdt/QBym35odk/jquery.masonry.js"></script>
  486.  
  487. <script>
  488. $(function(){
  489. var $container = $('#entries');
  490. $container.imagesLoaded(function(){
  491. $container.masonry({
  492. itemSelector: '.posts',
  493. });
  494. });
  495. $container.infinitescroll({
  496. itemSelector : ".posts",
  497. navSelector : "div.pagination",
  498. nextSelector : ".pagination a#next",
  499. loadingImg : "",
  500. loadingText : "<em></em>",
  501. bufferPx : 10000,
  502. extraScrollPx: 12000,
  503. },
  504. // trigger Masonry as a callback
  505. function( newElements ) {
  506. var $newElems = $( newElements ).css({ opacity: 0 });
  507. // ensure that images load before adding to masonry layout
  508. $newElems.imagesLoaded(function(){
  509. $newElems.animate({ opacity: 1 });
  510. $container.masonry( 'appended', $newElems, true );
  511. });
  512. }
  513. );
  514. });
  515. </script>
  516.  
  517.  
  518. </head>
  519.  
  520. <body>
  521.  
  522. <div id="right"></div>
  523. <div id="left"></div>
  524.  
  525. <div id="con">
  526.  
  527. <div id="credit"><a href="http://ammetrine.tumblr.com/" target="_blank" title="ammetrine's themes"><img src="http://38.media.tumblr.com/tumblr_lu2de5CqUh1qfoi4t.gif"></a></div>
  528.  
  529. <div id="sidebar">
  530. <div id="blogt">{Title}</div>
  531. <div id="description">{Description}</div>
  532.  
  533. <div class="navlinks">
  534. <a href="/">home</a>
  535. <a href="#?w=400" rel="box1" class="poplight">inbox</a>
  536. <a href="/archive">archive</a>
  537. {block:ifShowCustomlink1}<a href="{text:Link 1 URL}">{text:Link 1 Title}</a>
  538. {/block:ifShowCustomLink1}
  539. {block:ifShowCustomlink2}<a href="{text:Link 2 URL}" >{text:Link 2 Title}</a>{/block:ifShowCustomLink2}
  540. {block:ifShowCustomlink3}<a href="{text:Link 3 URL}">{text:Link 3 Title}</a>{/block:ifShowCustomLink3}
  541. <a href="http://ammetrine.tumblr.com" target="_blank">theme</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="{font-family: 'Raleway', sans-serif;}" >{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"><br><i>{Answer}</i></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