altraviolence

theme 05 | fate

Jan 13th, 2018 (edited)
7,627
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 5 31.06 KB | None | 0 0
  1. <!DOCTYPE html>
  2.  
  3. <!--
  4.  
  5. FATE theme (05) by PEACHTHMS | peachthms.tumblr.com
  6. V1.0
  7.  
  8. - do not claim this page or any of the code as your own
  9. - do not redistribute this page or any of the code as your own
  10. - do not mix my code with another theme maker's code
  11. - do not remove or edit the credit in anyway; it must remain visible in the code and on the page
  12.  
  13. saturnthms - credit icon
  14. font awesome - icon font
  15. pixel union - extended tumblr photoset
  16. shythemes - video resize
  17. manos malihu - style my tooltips
  18. dave desandro - masonry
  19. magnusthemes - fuckstaff resize script
  20.  
  21. -->
  22.  
  23. <head>
  24.  
  25. <title>{Title} {block:PostSummary}| {PostSummary}{/block:PostSummary}</title>
  26.  
  27. <link rel="shortcut icon" href="{Favicon}">
  28.  
  29. <meta charset="UTF-8">
  30. <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
  31.  
  32. <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
  33.  
  34. <link href="https://fonts.googleapis.com/css?family=Roboto|Karla|Muli|Source+Sans+Pro|Lora" rel="stylesheet">
  35.  
  36. <link href="https://cdnjs.cloudflare.com/ajax/libs/normalize/7.0.0/normalize.min.css" rel="stylesheet">
  37.  
  38. <link href="//dl.dropbox.com/s/50g6fbds3rh4m0j/saturnicons.css" rel="stylesheet">
  39.  
  40. <script src="http://static.tumblr.com/cqvi50o/KXOozhlfj/pt-access.js"></script>
  41.  
  42. <script src="https://use.fontawesome.com/24c6d1af97.js"></script>
  43.  
  44. <script src ="//static.tumblr.com/fwgzvyf/Oj1o08f6h/shythemes.vr.js"></script>
  45.  
  46. <link href="https://static.tumblr.com/qudkd6d/OcDnl99gb/style.css" rel="stylesheet" type="text/css"/>
  47.  
  48. <script src="https://cdn.rawgit.com/pixelunion/Extended-Tumblr-Photoset/9b3cb866/js/pxuPhotoset.min.js"></script>
  49.  
  50. <script>
  51. $(document).ready(function(){
  52.    $('.photo-slideshow').pxuPhotoset({
  53.        lightbox: true,
  54.        rounded: false,
  55.        gutter: '3px',
  56.        borderRadius: '0px',
  57.        photoset: '.photo-slideshow',
  58.        photoWrap: '.photo-data',
  59.        photo: '.pxu-photo'
  60.    });
  61. });
  62. </script>
  63.  
  64. <script type="text/javascript" src="http://static.tumblr.com/cqvi50o/VSzox2ncv/style-my-tooltips.js"></script>
  65. <script>
  66.     (function($) {
  67.         $(document).ready(function() {
  68.             $("[title]").style_my_tooltips({
  69.                 tip_follows_cursor: true,
  70.                 tip_delay_time: 200,
  71.                 tip_fade_speed: 300
  72.             });
  73.         });
  74.     })(jQuery);
  75. </script>
  76.  
  77. <script src="https://cdn.rawgit.com/meetselva/attrchange/master/js/attrchange.js"></script>
  78. <script src="https://cdn.rawgit.com/meetselva/attrchange/master/js/attrchange_ext.js"></script>
  79. <script src="http://static.tumblr.com/2b2izpj/cB7ogqs8l/jquery.initialize.js"></script>
  80. <script src="http://static.tumblr.com/p0knose/CtEozruse/jquery.fuckstaff.js"></script>
  81.  
  82. <script>
  83. $(window).load(fuckTumblr(1280));
  84. $(document).ready(fuckTumblr(1280));
  85.  
  86. $(document).ready(function(){
  87.     $(".pxu-photo img").fuckStaff({
  88.         width:"1280"
  89.     });
  90.     $(".photo img").fuckStaff({
  91.         width:"1280" // or 540
  92.     });
  93.     $("a.tumblr-box").initialize(function(){
  94.         $(this).attr("href",function(i, src) {
  95.             return src.replace('_500.', '_1280.');
  96.         });
  97.     });
  98. });
  99. </script>
  100.  
  101. <meta http-equiv="x-dns-prefetch-control" content="off"/>
  102. <meta name="color:background" content="#ffffff"/>
  103. <meta name="color:text" content="#686868"/>
  104. <meta name="color:links" content="#686868"/>
  105. <meta name="color:navigation links" content="#c9b2ba"/>
  106. <meta name="color:accent" content="#c9b2ba"/>
  107. <meta name="color:caption borders" content="#eeeeee"/>  
  108. <meta name="color:permalink background hover" content="#d6bdc6"/>  
  109. <meta name="color:permalink hover text" content="#ffffff"/>  
  110. <meta name="color:post info background" content="#f6f6f6"/>  
  111. <meta name="text:font size" content="12px"/>
  112. <meta name="text:link 1 title" content=""/>
  113. <meta name="text:link 1" content=""/>
  114. <meta name="text:link 2 title" content=""/>
  115. <meta name="text:link 2" content=""/>
  116. <meta name="text:link 3 title" content=""/>
  117. <meta name="text:link 3" content=""/>
  118. <meta name="if:single column" content="0"/>
  119. <meta name="if:hide tags on index" content="0"/>
  120. <meta name="select:font" content="Karla" title="Karla"/>
  121. <meta name="select:font" content="Roboto" title="Roboto"/>
  122. <meta name="select:font" content="Source Sans Pro" title="Source Sans Pro"/>
  123. <meta name="select:font" content="Muli" title="Muli"/>
  124.  
  125. <style>
  126.  
  127. * {
  128.     margin: 0;
  129.     padding: 0;
  130. }
  131.  
  132. body {
  133.     background-color: {color:background};
  134.     font-family: '{select:font}',  Arial, Calibri, Helvetica, sans-serif;
  135.     color: {color:text};
  136.     font-size: {text:font size};
  137.     line-height: 1.8em;
  138. }
  139.  
  140. a {
  141.     color: {color:links};
  142.     text-decoration: none;
  143.     -webkit-transition-duration: 0.4s;
  144.     -moz-transition-duration: 0.4s;
  145.     transition-duration: 0.4s;
  146.    
  147. }
  148.  
  149. a:hover {
  150.     color: {color:accent};
  151. }
  152.  
  153. ul, ol {
  154.     margin-left: 15px;
  155. }
  156.  
  157. img {
  158.     max-width: 100%;
  159.     display: block;
  160. }
  161.  
  162. blockquote {
  163.     border-left: 2px solid {color:accent};
  164.     padding-left: 15px;
  165. }
  166.  
  167. small, big, sub, sup {
  168.     font-size: {text:font size};
  169. }
  170.  
  171. ::-moz-selection {
  172.     background-color: {color:permalink background hover};
  173.     color: {color:permalink hover text};
  174. }
  175.  
  176. ::selection {
  177.     background-color: {color:permalink background hover};
  178.     color: {color:permalink hover text};
  179. }
  180.  
  181. ::-webkit-scrollbar {
  182.     width: 8px;
  183.     height: 8px;
  184. }
  185.  
  186. ::-webkit-scrollbar-thumb {
  187.     background: {color:accent};
  188. }
  189.        
  190. ::-webkit-scrollbar-track {
  191.     background: #ffffff;
  192. }
  193.  
  194. .tmblr-iframe-compact .tmblr-iframe--unified-controls {
  195.     z-index: 99999999999;
  196.     transform: scale(0.7,0.7);
  197.     -webkit-filter: invert(50%);
  198.     filter: invert(50%);
  199. }
  200.  
  201. #s-m-t-tooltip {
  202.     max-width: 300px;
  203.     z-index: 100;
  204.     margin: 24px 14px 7px 12px;
  205.     padding: 2px 6px;
  206.     background-color: {color:accent};
  207.     color: #ffffff;
  208.     -webkit-border-radius: 3px;
  209.     -moz-border-radius: 3px;
  210.     border-radius: 3px;
  211. }
  212.  
  213. #container {
  214.     width: 100%;
  215.     height: 100%;
  216. }
  217.  
  218. header {
  219.     margin: 50px auto;
  220.     display: flex;
  221.     justify-content: space-between;
  222.     align-items: center;
  223.     width: 800px;
  224. }
  225.  
  226. header img {
  227.     width: 100px;
  228.     -webkit-border-radius: 50%;
  229.     -moz-border-radius: 50%;
  230.     border-radius: 50%;
  231. }
  232.  
  233. #header-info {
  234.     width: 600px;
  235.     padding: 0 30px;
  236. }
  237.  
  238. nav {
  239.     margin: 10px 0;    
  240.     font-weight: bold;
  241. }
  242.  
  243. nav a {
  244.     display: inline-block;
  245.     color: {color:links};
  246.     text-decoration: none;
  247.     border-bottom: 2px solid transparent;
  248.     -webkit-transition-duration: 0.6s;
  249.     -moz-transition-duration: 0.6s;
  250.     transition-duration: 0.6s;
  251.    
  252. }
  253.  
  254. nav a:hover {
  255.     border-bottom: 2px solid {color:accent};
  256. }
  257.  
  258. nav a:hover {
  259.     color: {color:accent};
  260. }
  261.  
  262. nav a:not(:last-of-type) {
  263.     margin-right: 15px;
  264. }
  265.  
  266. .posts-wrapper {
  267.     margin: 50px auto 0;
  268.     {block:ifnotsinglecolumn}
  269.     width: 900px;
  270.     {/block:ifnotsinglecolumn}
  271.     {block:ifsinglecolumn}
  272.     width: 540px;
  273.     {/block:ifsinglecolumn}
  274. }
  275.  
  276. .post-entry {  
  277.     {block:ifnotsinglecolumn}
  278.     float: left;
  279.     margin: 0 50px 50px;
  280.     width: 200px;
  281.     height: 200px;
  282.     {block:PermalinkPage}
  283.     float: none;
  284.     position: relative!important;
  285.     margin: 0 auto;
  286.     width: 540px;
  287.     height: auto;
  288.     {/block:PermalinkPage}
  289.     color: {color:post text};
  290.     overflow: hidden;
  291.     {/block:ifnotsinglecolumn}
  292.     {block:ifsinglecolumn}
  293.     margin: 200px auto;
  294.     width: 540px;
  295.     height: auto;
  296.     {/block:ifsinglecolumn}
  297.     {block:PermalinkPage}
  298.     margin-bottom: 50px;
  299.     {/block:PermalinkPage}
  300. }
  301.  
  302. .post-entry::after, .audio-perma::after {
  303.     content: '';
  304.     display: table;
  305.     clear: both;
  306. }
  307.  
  308. .post-entry .photo img, .post-entry .photo-space img {
  309.     display: block;
  310.     margin: 0 auto;
  311.     width: 540px;
  312. }
  313.  
  314. .post-entry p {
  315.     margin: 10px auto;
  316. }
  317.  
  318. .post-entry h1 {
  319.     margin-top: 0;
  320. }
  321.  
  322. .post-entry:first-of-type {
  323.     margin-top: 0;
  324. }
  325.  
  326. .post-entry:hover > #permalink {
  327.     {block:ifnotsinglecolumn}
  328.     opacity: 1;
  329.     {/block:ifnotsinglecolumn}
  330. }
  331.  
  332. .photo, .photoset {
  333.     {block:ifnotsinglecolumn}
  334.     {block:IndexPage}
  335.     width: 200px;
  336.     height: 200px;
  337.     background-repeat: no-repeat;
  338.     background-position: center;
  339.     background-size: cover;
  340.     {/block:IndexPage}
  341.     {block:PermalinkPage}
  342.     display: block;
  343.     height: auto;
  344.     {/block:PermalinkPage}
  345.     {/block:ifnotsinglecolumn}
  346.     {block:ifsinglecolumn}
  347.     display: none;
  348.     {/block:ifsinglecolumn}
  349. }
  350.  
  351. .photoset img {
  352.     {block:ifnotsinglecolumn}
  353.     display: none;
  354.     {/block:ifnotsinglecolumn}
  355. }
  356.  
  357. .photoset img:first-child {
  358.     {block:ifnotsinglecolumn}
  359.     display: block;
  360.     {/block:ifnotsinglecolumn}
  361. }
  362.  
  363. .photo-space .post-info {
  364.     margin-top: -7px;
  365. }
  366.  
  367. .video {
  368.     {block:ifnotsinglecolumn}
  369.     {block:IndexPage}
  370.     height: 200px;
  371.     {/block:IndexPage}
  372.     {/block:ifnotsinglecolumn}
  373. }
  374.  
  375. #quote, #question {
  376.     font-family: 'Lora', Times New Roman, serif;
  377.     font-style: italic;
  378.     text-align: center;
  379. }
  380.  
  381. #source {
  382.     margin-top: 7px;
  383.     text-align: center;
  384.     {block:ifnotsinglecolumn}
  385.     {block:PermalinkPage}
  386.     margin-bottom: 10px;
  387.     {/block:PermalinkPage}
  388.     {/block:ifnotsinglecolumn}
  389.     {block:ifsinglecolumn}
  390.     margin-bottom: 10px;
  391.     {/block:ifsinglecolumn}
  392. }
  393.  
  394. #lines {
  395.     margin-bottom: 10px;
  396. }
  397.  
  398. #lines b:first-of-type {
  399.     margin-right: 5px;
  400.     text-transform: uppercase;
  401. }
  402.  
  403. .audio {
  404.     {block:IndexPage}
  405.     display: flex;
  406.     justify-content: center;
  407.     align-items: center;
  408.     position: absolute;
  409.     width: 200px;
  410.     height: 200px;
  411.     background: {color:accent};
  412.     color: {color:permalink hover text};
  413.     font-size: 1.2em;
  414.     text-align: center;
  415.     {/block:IndexPage}
  416. }
  417.  
  418. .audio-player {
  419.     width: 500px;
  420. }
  421.  
  422. .album-art img {
  423.    position: relative;
  424.    height: 200px;
  425.    width: 200px;
  426.    z-index: 11;
  427. }    
  428.  
  429. .audio-perma {
  430.     position: relative;
  431.     width: 540px;
  432.     overflow: hidden;  
  433. }
  434.  
  435. .tumblr_audio_player {
  436.     float: left;
  437.     display: block;
  438.     margin-right: 20px;
  439.     padding: 28px;
  440.     width: 33px;
  441.     height: 30px;
  442.     background-color: {color:accent};
  443.     opacity: 1;
  444. }
  445.  
  446. .track-info-perma {
  447.     position: relative;
  448.     overflow: auto;
  449.     text-transform: uppercase;
  450.     height: 80px;
  451.     padding-right: 10px;
  452.     display: table-cell;
  453.     vertical-align: middle;
  454.     text-align: right;
  455.     width: 500px;
  456. }
  457.    
  458. img.album-art-perma {
  459.     float: right;
  460.     height: 86px;
  461. }
  462.  
  463. #asker {
  464.     {block:ifnotsinglecolumn}
  465.     padding: 10px;
  466.     background: {color:post info background};
  467.     {block:IndexPage}
  468.     text-align: center;
  469.     {/block:IndexPage}
  470.     {/block:ifnotsinglecolumn}
  471.     {block:ifsinglecolumn}
  472.     padding: 10px;
  473.     background: {color:post info background};
  474.     {/block:ifsinglecolumn}
  475. }
  476.  
  477. #asker a {
  478.     color: {color:accent};
  479.     text-transform: uppercase;
  480. }
  481.  
  482. #question {
  483.     margin: 10px 0 20px;
  484.     font-size: 0.95em;
  485.     {block:ifnotsinglecolumn}
  486.     {block:PermalinkPage}
  487.     padding: 10px;
  488.     background: {color:post info background};
  489.     {/block:PermalinkPage}
  490.     {/block:ifnotsinglecolumn}
  491.     {block:ifsinglecolumn}
  492.     padding: 10px;
  493.     background: {color:post info background};
  494.     {/block:ifsinglecolumn}
  495. }
  496.  
  497. .vignette, #vignette {
  498.     opacity: 0;
  499. }
  500.  
  501. .lightbox-image, #tumblr_lightbox img {
  502.     border: 5px solid white!important;
  503.     box-shadow: none!important;
  504.     -moz-box-sizing: border-box;
  505.     box-sizing: border-box;
  506. }
  507.  
  508. .tmblr-lightbox, #tumblr_lightbox {
  509.     background-color: rgba(245, 245, 245, 0.97)!important;
  510. }
  511.  
  512.  
  513. .lightbox-caption, #tumblr_lightbox_caption {
  514.     visibility: hidden;
  515. }
  516.  
  517. .text .caption, .audio .caption, .photo .caption {  
  518.     {block:PermalinkPage}
  519.     margin-top: 10px;
  520.     padding: 10px;
  521.     {/block:PermalinkPage}
  522. }
  523.  
  524. .caption {
  525.     display: block;
  526. }
  527.  
  528. .reblog-list {
  529.     display: block;
  530. }
  531.  
  532. .reblog-header {
  533.     padding-top: 10px;
  534.     border-top: 1px solid {color:caption borders};
  535. }
  536.  
  537. .reblog-header:first-of-type {
  538.     border-top: 0;
  539. }
  540.  
  541. .reblog-users a {
  542.     border-bottom: 2px solid transparent;
  543.     -webkit-transition-duration: 0.6s;
  544.     -moz-transition-duration: 0.6s;
  545.     transition-duration: 0.6s;  
  546. }
  547.  
  548. .reblog-users a:hover {
  549.     border-bottom: 2px solid {color:accent};
  550. }
  551.  
  552. .reblog-users img {
  553.     display: inline-block;
  554.     margin-right: 5px;
  555.     width: 20px;
  556.     vertical-align: middle;
  557.     border-radius: 50%;
  558. }
  559.  
  560. .reblog-content {
  561.     margin-bottom: 10px;
  562. }
  563.  
  564. .reblog-content:last-of-type {
  565.     margin-bottom: 0;
  566. }
  567.  
  568. #permalink {
  569.     {block:ifnotsinglecolumn}
  570.     {block:IndexPage}
  571.     position: absolute;
  572.     display: flex;
  573.     justify-content: center;
  574.     align-items: center;
  575.     width: 100%;
  576.     height: 100%;
  577.     bottom: 0;
  578.     background: {color:permalink background hover};
  579.     opacity: 0;
  580.     z-index: 99;
  581.     -webkit-transition-duration: 0.5s;
  582.     -moz-transition-duration: 0.5s;
  583.     transition-duration: 0.5s;
  584.     {/block:IndexPage}
  585.     {/block:ifnotsinglecolumn}
  586.     {block:PermalinkPage}
  587.     display: none!important;
  588.     {/block:PermalinkPage}
  589.     {block:ifsinglecolumn}
  590.     display: none!important;
  591.     {/block:ifsinglecolumn}
  592.    
  593. }
  594.  
  595. #permalink a, #permalink a:hover, .permalink-photo, .permalink-photo:hover {
  596.     border: 0;
  597. }
  598.  
  599. #post-types {
  600.     text-align: center;
  601. }
  602.  
  603. #post-types .fa {
  604.     font-size: 1.7em;
  605.     cursor: help;
  606. }
  607.  
  608. #permalink span a {
  609.     margin: 0 5px;
  610.     color: {color:permalink hover text};
  611.     text-transform: uppercase;
  612. }
  613.  
  614. #permalink .fa {
  615.     color: {color:permalink hover text};
  616. }
  617.  
  618. .post-info {
  619.     {block:ifnotsinglecolumn}
  620.     {block:IndexPage}
  621.     display: none!important;
  622.     {/block:IndexPage}
  623.     {/block:ifnotsinglecolumn}
  624.     padding: 10px;
  625.     background: {color:post info background};
  626.     font-size: 0.9em;    
  627.     text-align: center;
  628.     text-transform: lowercase;
  629. }
  630.  
  631. .post-section .fa {
  632.     margin-right: 5px;
  633.     color: {color:accent};
  634. }
  635.  
  636. .post-section span {
  637.     margin-right: 15px;
  638.     padding: 3px 5px;
  639. }
  640.  
  641. .post-section span:first-of-type {
  642.     padding-left: 0;
  643. }
  644.  
  645. #tags {
  646.     {block:ifnotsinglecolumn}
  647.     {block:IndexPage}
  648.     display: none!important;
  649.     {/block:IndexPage}
  650.     {/block:ifnotsinglecolumn}
  651.     {block:ifhidetagsonindex}
  652.     {block:IndexPage}
  653.     display: none!important;
  654.     {/block:IndexPage}
  655.     {/block:ifhidetagsonindex}
  656.     margin-top: 10px;
  657.     font-size: 0.9em;    
  658. }
  659.  
  660. #tags a {
  661.     margin-right: 10px;
  662. }
  663.  
  664. #tags a:last-of-type {
  665.     margin-right: 0;
  666. }
  667.  
  668. #postnotes {
  669.     margin: 0 auto 50px;
  670.     width: 540px;
  671.     background-color: {color:background};
  672.     text-transform: lowercase;
  673. }
  674.  
  675. #postnotes img {
  676.     display: none;
  677. }
  678.  
  679. #postnotes ol {
  680.     list-style: none;
  681.     margin-left: 0;
  682. }
  683.  
  684. .note {
  685.     margin: 10px 0;
  686. }
  687.  
  688. .note a {
  689.     padding-bottom: 2px;
  690. }
  691.  
  692. .note.like::before, .note.reblog::before, .note.reblog.with_commentary::before, .note.original_post::before, .note.reply::before {
  693.     margin-right: 10px;
  694.     font-family: 'FontAwesome';
  695.     font-size: 0.9em;
  696. }
  697.  
  698. .note.like::before {
  699.     content: "\f004";    
  700.     color: #ff8787;
  701. }
  702.  
  703. .note.reblog::before {
  704.     content: "\f021";      
  705.     color: {color:accent};
  706. }
  707.  
  708. .note.reblog.with_commentary::before {
  709.     content: "\f27a";
  710.     color: {color:accent};
  711. }
  712.  
  713. .note.reblog.with_commentary blockquote {
  714.     margin: 5px 0 0 25px;
  715.     padding-left: 5px;
  716.     border-left: 1px solid {color:accent2};
  717. }
  718.  
  719. .note.original_post::before {
  720.     content: "\f007";      
  721.     color: {color:accent};
  722. }
  723.  
  724. .note.reply::before {
  725.     content: "\f075";      
  726.     color: {color:accent2};
  727. }
  728.  
  729. #pag {
  730.     margin: 50px auto;
  731.     width: inherit;
  732.     text-align: center;
  733. }
  734.  
  735. #pag span {
  736.     margin: 0 40px;
  737. }
  738.  
  739. #pag i {
  740.     margin: 0 5px;
  741.     color: {color:accent};
  742. }
  743.  
  744. #btt {
  745.     position: fixed;
  746.     bottom: 10px;
  747.     right: 10px;
  748.     z-index: 999999;
  749.     color: {color:accent};
  750.     text-align: center;
  751. }
  752.  
  753. #btt:hover {
  754.     color: {color:links};
  755. }
  756.  
  757. .credit {
  758.     position: fixed;
  759.     bottom: 10px;
  760.     left: 17px;
  761.     font-size: 14px;
  762. }
  763.  
  764. .credit a {
  765.     font-weight: normal;
  766. }
  767.  
  768. .credit span {
  769.     font-size: 10px;
  770.     background: {color:accent};
  771.     color: #ffffff;
  772.     padding: 6px 9px;
  773.     border-radius: 6px;
  774.     opacity: 0;
  775.     transition-duration: 0.5s;
  776.     -moz-transition-duration: 0.5s;
  777.     -webkit-transition-duration: 0.5s;
  778. }
  779.  
  780. .credit:hover span {
  781.     margin-left: 15px;
  782.     opacity: 1;
  783. }
  784.  
  785. .credit:before {
  786.     content: '\e2b0';
  787.     font-family: 'saturnicons';
  788. }
  789.  
  790. .credit:hover:before {
  791.     color: {color:accent};
  792. }
  793.  
  794. </style>
  795.  
  796. </head>
  797.  
  798. <body id="top">
  799.  
  800. <section id="container">
  801.  
  802. <header>
  803.     <img src="{PortraitURL-128}">    
  804.    
  805.     <div id="header-info">
  806.         <div id="header-top">
  807.             <a href="/" title="refresh"><h1>{Name}</h1></a>
  808.             <div id="header-desc">{Description}</div>
  809.         </div>
  810.        
  811.         <nav>
  812.             {block:AskEnabled}<a href="/ask">message</a>{/block:AskEnabled}
  813.             {block:SubmissionsEnabled}<a href="/submit">submit</a>{/block:SubmissionsEnabled}
  814.             <a href="/archive">archive</a>
  815.             <a href="{text:link 1}">{text:link 1 title}</a>
  816.             <a href="{text:link 2}">{text:link 2 title}</a>
  817.             <a href="{text:link 3}">{text:link 3 title}</a>
  818.         </nav>
  819.        
  820.     </div>
  821.    
  822. </header>
  823.  
  824. <article class="posts-wrapper">
  825.  
  826. {block:Posts}
  827.  
  828. {block:ContentSource}
  829. <!-- {SourceURL}{block:SourceLogo}<img src="{BlackLogoURL}"width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" />{/block:SourceLogo}
  830. {block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo} -->
  831. {/block:ContentSource}
  832. <!-- {block:NoRebloggedFrom}
  833. {block:RebloggedFrom}{ReblogParentName}{/block:RebloggedFrom}
  834. {/block:NoRebloggedFrom} -->
  835.  
  836. <article class="post-entry">
  837. {block:ifnotsinglecolumn}
  838. <div id="permalink">
  839.  
  840.     <div id="permalink-wrapper">
  841.         <div id="post-types">
  842.             {block:Answer}<i class="fa fa-comment" aria-hidden="true" title="ask post"></i>{/block:Answer}
  843.             {block:Text}<i class="fa fa-font" aria-hidden="true" title="text post"></i>{/block:Text}
  844.             {block:Photo}<i class="fa fa-camera" aria-hidden="true" title="photo post"></i>{/block:Photo}
  845.             {block:Photoset}<i class="fa fa-camera" aria-hidden="true" title="photoset post"></i>{/block:Photoset}
  846.             {block:Quote}<i class="fa fa-quote-left" aria-hidden="true" title="quote post"></i> <i class="fa fa-quote-right" aria-hidden="true" title="quote post"></i>{/block:Quote}
  847.             {block:Link}<i class="fa fa-link" aria-hidden="true" title="link post"></i>{/block:Link}
  848.             {block:Chat}<i class="fa fa-comments" aria-hidden="true" title="chat post"></i>{/block:Chat}
  849.             {block:Video}<i class="fa fa-video-camera" aria-hidden="true" title="video post"></i>{/block:Video}
  850.             {block:Audio}<i class="fa fa-music" aria-hidden="true" title="audio post"></i>{/block:Audio}
  851.         </div>
  852.        
  853.         <div id="permalink-info">
  854.             <span>{block:NoteCount}
  855.             <a href="{Permalink}" title="{NoteCountWithLabel}"><i class="fa fa-heart" aria-hidden="true"></i> {NoteCount}</a>
  856.             {/block:NoteCount}
  857.        
  858.             {block:Date}
  859.             <a href="{Permalink}" title="posted on {Month} {DayOfMonth}{DayOfMonthSuffix}"><i class="fa fa-clock-o" aria-hidden="true"></i> {TimeAgo}</a>
  860.             {/block:Date}</span>
  861.         </div>
  862.     </div>
  863. </div>
  864. {/block:ifnotsinglecolumn}
  865.  
  866. {block:Text}
  867. {block:Title}<h1>{Title}</h1>{/block:Title}
  868. <div class="caption">
  869.     {block:NotReblog}<figcaption>{Body}</figcaption>{/block:NotReblog}
  870.     {block:RebloggedFrom}
  871.         <div class="reblog-list">
  872.             {block:Reblogs}
  873.             <div class="reblog-header">
  874.                 <div class="reblog-users">
  875.                     <img src="{PortraitURL-64}"><a href="{Permalink}" target="_blank">{Username}</a>
  876.                 </div>
  877.                 <div class="reblog-content">{Body}</div>
  878.             </div>
  879.             {/block:Reblogs}
  880.         </div>
  881.     {/block:RebloggedFrom}
  882. </div>  
  883. {/block:Text}
  884.                                        
  885. {block:Photo}
  886. {block:ifnotsinglecolumn}
  887. <div class="photo">
  888. <a href="#" class="permalink-photo" onclick="Tumblr.Lightbox.init([{ width: {PhotoWidth-HighRes}, height: {PhotoHeight-HighRes}, low_res: '{PhotoURL-500}', high_res: '{PhotoURL-HighRes}' }]); $('body').toggleClass('tumblr_lightbox_active'); return false">
  889.     {block:IndexPage}
  890.     <div class="photo" style="background-image: url('{PhotoURL-HighRes}');"></div>
  891.     {/block:IndexPage}  
  892.  
  893.     {block:PermalinkPage}
  894.     <img src="{PhotoURL-HighRes}">
  895.     {/block:PermalinkPage}
  896. </a>    
  897. </div>
  898. {/block:ifnotsinglecolumn}
  899.  
  900. {block:ifsinglecolumn}
  901. <div class="photo-space">
  902. <a href="#" class="permalink-photo" onclick="Tumblr.Lightbox.init([{ width: {PhotoWidth-HighRes}, height: {PhotoHeight-HighRes}, low_res: '{PhotoURL-500}', high_res: '{PhotoURL-HighRes}' }]); $('body').toggleClass('tumblr_lightbox_active'); return false">
  903.     <img src="{PhotoURL-HighRes}">
  904. </a>    
  905. </div>
  906. {/block:ifsinglecolumn}
  907.  
  908. {block:Caption}
  909. <div class="caption">
  910.     {block:NotReblog}<figcaption>{Caption}</figcaption>{/block:NotReblog}
  911.     {block:RebloggedFrom}
  912.         <div class="reblog-list">
  913.             {block:Reblogs}
  914.             <div class="reblog-header">
  915.                 <div class="reblog-users">
  916.                     <img src="{PortraitURL-64}"><a href="{Permalink}" target="_blank">{Username}</a>
  917.                 </div>
  918.                 <div class="reblog-content">{Body}</div>
  919.             </div>
  920.             {/block:Reblogs}
  921.         </div>
  922.     {/block:RebloggedFrom}
  923. </div>
  924. {/block:Caption}
  925. {/block:Photo}
  926.            
  927. {block:Photoset}
  928. {block:ifnotsinglecolumn}
  929.  
  930. {block:IndexPage}
  931. <div class="photoset">
  932.     {block:Photos}
  933.     <div class="photo" style="background-image: url('{PhotoURL-HighRes}');"></div>
  934.     {/block:Photos}
  935. </div>
  936. {/block:IndexPage}
  937.  
  938. {block:PermalinkPage}
  939. <div class="photo-slideshow" id="photoset_{PostID}" data-layout="{PhotosetLayout}">
  940.     {block:Photos}
  941.         <div class="photo-data">
  942.             <div class="pxu-photo">
  943.                 <img src="{PhotoURL-500}" width="{PhotoWidth-500}" height="{PhotoHeight-500}" data-highres="{PhotoURL-HighRes}" data-width="{PhotoWidth-HighRes}" data-height="{PhotoHeight-HighRes}">
  944.             </div>
  945.         <a class="tumblr-box" rel="post-{PostID}" href="{PhotoURL-HighRes}"></a>
  946.         </div>
  947.     {/block:Photos}
  948. </div>
  949. {/block:PermalinkPage}
  950. {/block:ifnotsinglecolumn}
  951.  
  952.  
  953. {block:ifsinglecolumn}
  954. <div class="photo-slideshow" id="photoset_{PostID}" data-layout="{PhotosetLayout}">
  955.     {block:Photos}
  956.         <div class="photo-data">
  957.             <div class="pxu-photo">
  958.                 <img src="{PhotoURL-500}" width="{PhotoWidth-500}" height="{PhotoHeight-500}" data-highres="{PhotoURL-HighRes}" data-width="{PhotoWidth-HighRes}" data-height="{PhotoHeight-HighRes}">
  959.             </div>
  960.         <a class="tumblr-box" rel="post-{PostID}" href="{PhotoURL-HighRes}"></a>
  961.         </div>
  962.     {/block:Photos}
  963. </div>
  964. {/block:ifsinglecolumn}
  965.  
  966. {block:Caption}
  967. <div class="caption">
  968.     {block:NotReblog}<figcaption>{Body}</figcaption>{/block:NotReblog}
  969.     {block:RebloggedFrom}
  970.         <div class="reblog-list">
  971.             {block:Reblogs}
  972.             <div class="reblog-header">
  973.                 <div class="reblog-users">
  974.                     <img src="{PortraitURL-64}"><a href="{Permalink}" target="_blank">{Username}</a>
  975.                 </div>
  976.                 <div class="reblog-content">{Body}</div>
  977.             </div>
  978.             {/block:Reblogs}
  979.         </div>
  980.     {/block:RebloggedFrom}
  981. </div>
  982. {/block:Caption}    
  983. {/block:Photoset}
  984.                                    
  985. {block:Video}
  986. {block:IndexPage}
  987. {Video-500}
  988. {/block:IndexPage}
  989. {block:PermalinkPage}
  990. <div class="video">{Video-500}</div>
  991. {/block:PermalinkPage}
  992. {block:Caption}
  993. <div class="caption">
  994.     {block:NotReblog}<figcaption>{Caption}</figcaption>{/block:NotReblog}
  995.     {block:RebloggedFrom}
  996.         <div class="reblog-list">
  997.             {block:Reblogs}
  998.             <div class="reblog-header">
  999.                 <div class="reblog-users">
  1000.                     <img src="{PortraitURL-64}"><a href="{Permalink}" target="_blank">{Username}</a>
  1001.                 </div>
  1002.                 <div class="reblog-content">{Body}</div>
  1003.             </div>
  1004.             {/block:Reblogs}
  1005.         </div>
  1006.     {/block:RebloggedFrom}
  1007. </div>
  1008. {/block:Caption}
  1009. {/block:Video}
  1010.                        
  1011. {block:Quote}
  1012. <div class="text">
  1013. <div id="quote">"{Quote}"</div>
  1014. {block:Source}<div id="source">{Source}</div>{/block:Source}
  1015. </div>
  1016. {/block:Quote}    
  1017.                        
  1018. {block:Link}
  1019. <div class="text">
  1020. <h1><a href="{URL}">{Name}</a></h1>
  1021. {block:Description}{Description}{/block:Description}
  1022. </div>
  1023. {/block:Link}    
  1024.                      
  1025. {block:Chat}
  1026. <div class="text">
  1027. {block:Title}<h1>{Title}</h1>{/block:Title}
  1028. {block:Lines}<div id="lines">
  1029. {block:Label}<b>{Label}</b>{/block:Label}
  1030. <span>{Line}<br></span></div>{/block:Lines}
  1031. </div>
  1032. {/block:Chat}
  1033.        
  1034. {block:Audio}
  1035. {block:ifnotsinglecolumn}
  1036. {block:IndexPage}
  1037. <div class="audio">
  1038. {block:TrackName}
  1039. {TrackName}
  1040. {/block:TrackName}
  1041. <br>
  1042. {block:Artist}
  1043. {Artist}
  1044. {/block:Artist}
  1045. </div>
  1046. {block:AudioPlayer}
  1047. {block:AlbumArt}
  1048. <div class="album-art"><img src="{AlbumArtURL}"></div>
  1049. {/block:AlbumArt}
  1050. {/block:AudioPlayer}
  1051. {/block:IndexPage}
  1052.  
  1053. {block:PermalinkPage}
  1054. <div class="audio-perma">
  1055. {block:AudioPlayer}{AudioPlayer}{/block:AudioPlayer}
  1056. {block:AlbumArt}
  1057. <img src="{AlbumArtURL}" class="album-art-perma">
  1058. {/block:AlbumArt}
  1059. <div class="track-info-perma">{block:TrackName}<b>{TrackName}</b>{/block:TrackName}{block:Artist}<br>by {Artist}{/block:Artist}
  1060. </div>
  1061. </div>
  1062. {/block:PermalinkPage}
  1063.  
  1064. {/block:ifnotsinglecolumn}
  1065.  
  1066. {block:ifsinglecolumn}
  1067. <div class="audio-perma">
  1068. {block:AudioPlayer}{AudioPlayer}{/block:AudioPlayer}
  1069. {block:AlbumArt}
  1070. <img src="{AlbumArtURL}" class="album-art-perma">
  1071. {/block:AlbumArt}
  1072. <div class="track-info-perma">{block:TrackName}<b>{TrackName}</b>{/block:TrackName}{block:Artist}<br>by {Artist}{/block:Artist}
  1073. </div>
  1074. </div>
  1075. {/block:ifsinglecolumn}
  1076.  
  1077. {block:Caption}
  1078. <div class="caption">
  1079.     {block:NotReblog}<figcaption>{Caption}</figcaption>{/block:NotReblog}
  1080.     {block:RebloggedFrom}
  1081.         <div class="reblog-list">
  1082.             {block:Reblogs}
  1083.             <div class="reblog-header">
  1084.                 <div class="reblog-users">
  1085.                     <img src="{PortraitURL-64}"><a href="{Permalink}" target="_blank">{Username}</a>
  1086.                 </div>
  1087.                 <div class="reblog-content">{Body}</div>
  1088.             </div>
  1089.             {/block:Reblogs}
  1090.         </div>
  1091.     {/block:RebloggedFrom}
  1092. </div>
  1093. {/block:Caption}    
  1094. {/block:Audio}
  1095.    
  1096. {block:Answer}
  1097. <div class="text">
  1098. <div id="asker">{Asker} asked</div>
  1099. <div id="question">{Question}</div>
  1100. {Answer}
  1101. {block:Caption}
  1102. <div class="caption">
  1103.     {block:NotReblog}<figcaption>{Body}</figcaption>{/block:NotReblog}
  1104.     {block:RebloggedFrom}
  1105.         <div class="reblog-list">
  1106.             {block:Reblogs}
  1107.             <div class="reblog-header">
  1108.                 <div class="reblog-users">
  1109.                     <img src="{PortraitURL-64}"><a href="{Permalink}" target="_blank">{Username}</a>
  1110.                 </div>
  1111.                 <div class="reblog-content">{Replies}</div>
  1112.             </div>
  1113.             {/block:Reblogs}
  1114.         </div>
  1115.     {/block:RebloggedFrom}
  1116. </div>
  1117. {/block:Caption}    
  1118. </div>
  1119. {/block:Answer}        
  1120.  
  1121.  
  1122. {block:Date}
  1123. <div class="post-info">
  1124.     <div class="post-section">
  1125.         <span><i class="fa fa-clock-o" aria-hidden="true"></i> <a href="{Permalink}" title="posted on {Month} {DayOfMonth}{DayOfMonthSuffix}">{TimeAgo}</a></span>
  1126.  
  1127.         {block:NoteCount}
  1128.         <span>
  1129.             <i class="fa fa-bookmark" aria-hidde="true"></i> <a href="{Permalink}">{NoteCountWithLabel}</a>    
  1130.         </span>
  1131.         {/block:NoteCount}
  1132.        
  1133.         {block:RebloggedFrom}
  1134.         <span><i class="fa fa-user" aria-hidden="true"></i> <a href="{ReblogParentURL}" title="reblogged via {ReblogParentName}">{ReblogParentName}</a></span>
  1135.         {/block:RebloggedFrom} 
  1136.        
  1137.         <span><i class="fa fa-refresh" aria-hidden="true"></i> <a href="{ReblogURL}" title="reblog this post?" target="_blank">reblog</a></span>
  1138.        
  1139.         {block:Answer}<span><i class="fa fa-comment" aria-hidden="true"></i> ask post</span>{/block:Answer}
  1140.         {block:Text}<span><i class="fa fa-font" aria-hidden="true"></i> text post</span>{/block:Text}
  1141.         {block:Photo}<span><i class="fa fa-camera" aria-hidden="true"></i>photo post</span>{/block:Photo}
  1142.         {block:Photoset}<span><i class="fa fa-camera" aria-hidden="true"></i>photoset post</span>{/block:Photoset}
  1143.         {block:Quote}<span><i class="fa fa-quote-left" aria-hidden="true"></i> <i class="fa fa-quote-right" aria-hidden="true"></i> quote post</span>{/block:Quote}
  1144.         {block:Link}<span><i class="fa fa-link" aria-hidden="true"></i>link post</span>{/block:Link}
  1145.         {block:Chat}<span><i class="fa fa-comments" aria-hidden="true"></i></i>chat post</span>{/block:Chat}
  1146.         {block:Video}<span><i class="fa fa-video-camera" aria-hidden="true"></i>video post</span>{/block:Video}
  1147.         {block:Audio}<span><i class="fa fa-music" aria-hidden="true"></i>audio post</span>{/block:Audio}
  1148.         </div>
  1149.        
  1150.     </div>
  1151. {/block:Date}    
  1152.  
  1153.     <div class="post-section">
  1154.         {block:HasTags}
  1155.         <div id="tags">
  1156.         <i class="fa fa-tags" aria-hidden="true"></i>
  1157.         {block:Tags}
  1158.         <a href="{TagURL}">#{Tag}</a>
  1159.         {/block:Tags}    
  1160.         </div>
  1161.         {/block:HasTags}
  1162.     </div>
  1163. </div>
  1164.  
  1165. </article>
  1166.  
  1167. {block:PostNotes}
  1168. <div id="postnotes">{PostNotes}</div>
  1169. {/block:PostNotes}
  1170.    
  1171. {/block:Posts}  
  1172.  
  1173. </article>    
  1174.  
  1175. {block:Pagination}
  1176. <div id="pag">
  1177.     {block:PreviousPage}
  1178.     <a href="{PreviousPage}" title="previous page" class="jump_page"><i class="fa fa-chevron-left"></i></a>
  1179.     {/block:PreviousPage}
  1180.    
  1181.     <span>{CurrentPage} of {TotalPages}</span>
  1182.    
  1183.     {block:NextPage}
  1184.     <a href="{NextPage}" title="next page" class="jump_page"><i class="fa fa-chevron-right"></i></a>
  1185.     {/block:NextPage}
  1186. </div>
  1187. {/block:Pagination}
  1188.  
  1189. </section>
  1190.    
  1191. <a href="#top" id="btt" title="scroll to top" onclick="scrollToTop();return false"><i class="fa fa-chevron-up" aria-hidden="true"></i></a>
  1192.  
  1193. <div class="credit"><a href="http://peachthms.tumblr.com"><span>theme by peachthms</span></a></div>
  1194.  
  1195. <script>
  1196.     var timeOut;
  1197. function scrollToTop() {
  1198.     if (document.body.scrollTop!=0 || document.documentElement.scrollTop!=0){
  1199.         window.scrollBy(0,-50);
  1200.         timeOut=setTimeout('scrollToTop()',10);
  1201.     }
  1202.     else clearTimeout(timeOut);
  1203. }
  1204. </script>
  1205.  
  1206. {block:ifnotsinglecolumn}
  1207. <script src="http://static.tumblr.com/cqvi50o/vo6ow5klv/masonry.js"></script>
  1208.  
  1209. <script>
  1210. $(function(){
  1211. var $container = $('.posts-wrapper');
  1212. $container.imagesLoaded(function(){
  1213. $container.masonry({
  1214. itemSelector: '.post-entry',
  1215. });
  1216. });
  1217. });
  1218. </script>
  1219. {/block:ifnotsinglecolumn}
  1220.  
  1221. </body>
  1222.  
  1223. </html>
Advertisement
Add Comment
Please, Sign In to add comment