chaisthemes

theme 03: highest clouds from heaven

Jan 14th, 2019
1,135
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 30.41 KB | None | 0 0
  1. <!DOCTYPE html>
  2. <!--
  3. infinite scroll by paul irish (bless @magnusthemes and @sorrism);
  4. photosets.css by @annasthms and @espoirthemes;
  5. style my tooltips by malihu;
  6. customizable audio by @roxiestheme;
  7. tumblr controls by @cyantists;
  8. icon font by @suiomi;
  9. unnest captions base by @annasthms;
  10. -->
  11. <html>
  12.     <head>
  13.         <title>{Title}</title>
  14.         <meta name="viewport" content="width=device-width, initial-scale=1">
  15.         <link rel="shortcut icon" href="{Favicon}">
  16.         <link rel="alternate" type="application/rss+xml" href="{RSS}">
  17.         {block:Description}
  18.             <meta name="description" content="{MetaDescription}" />
  19.         {/block:Description}
  20.         <!--meta tags-->
  21.     <meta name="color:background" content="#f6f6f6" />
  22.     <meta name="color:text" content="#666666" />
  23.     <meta name="color:accent" content="#444444" />
  24.     <meta name="color:darker accent" content="#a77dc2" />
  25.     <meta name="color:borders" content="#eeeeee" />
  26.     <meta name="color:posts" content="#ffffff" />
  27.     <meta name="color:sidebar" content="#ffffff" />
  28.     <meta name="color:scrollbar" content="#f5f5f5"
  29.    <meta name="color:audio" content="#f5f5f5" />
  30.     <meta name="color:overlays" content="#ffffff"/>
  31.     <meta name="select:font" content="'poppins', sans-serif" title="poppins"/>
  32.     <meta name="select:font" content="'Karla', sans-serif" title="karla"/>
  33.     <meta name="select:font" content="'Muli', sans-serif" title="muli"/>
  34.     <meta name="select:heading font" content="'Lora', serif" title="lora"/>
  35.     <meta name="select:heading font" content="'Playfair Display', serif" title="playfair display"/>
  36.     <meta name="image:sidebar" content="">
  37.     <meta name="if:infinite scroll" content="1"/>
  38.     <meta name="text:link 1 url" content="" />
  39.     <meta name="text:link 1 title" content="" />
  40.     <meta name="text:link 2 url" content="" />
  41.     <meta name="text:link 2 title" content="" />
  42.     <meta name="text:link 3 url" content="" />
  43.     <meta name="text:link 3 title" content="" />
  44.     <!--links and scripts-->
  45.     <link href="https://static.tumblr.com/qudkd6d/OcDnl99gb/style.css" rel="stylesheet" type="text/css"/>
  46.     <link href="https://static.tumblr.com/0podkko/bwepdyarh/photosets.css" rel="stylesheet">
  47.     <script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
  48.     <script src="https://static.tumblr.com/puqxgda/0i2paplaq/infinite-scroll.pkgd.min.js"></script>
  49.     <link href="https://fonts.googleapis.com/css?family=Poppins|Karla|Muli" rel="stylesheet">
  50.     <link href="https://fonts.googleapis.com/css?family=Lora:400,400i|Playfair+Display:400,400i" rel="stylesheet">
  51.     <script src="https://static.tumblr.com/uopakca/GVcnvdwbq/jquery.style-my-tooltips.js"></script>
  52.     <link href="//dl.dropbox.com/s/vpi3f9s7nhpe7v7/honeybee.css" rel="stylesheet">
  53.  
  54.     <script>
  55. (function($){
  56. $(document).ready(function(){
  57. $("a[title]").style_my_tooltips({
  58. tip_follows_cursor:true,
  59. tip_delay_time:90,
  60. tip_fade_speed:700,
  61. attribute:"title"
  62. });
  63. });
  64. })(jQuery);
  65. </script>
  66.  
  67.     <style type="text/css">
  68.     /* TOOLTIPS AND SCROLLBAR */
  69.         #s-m-t-tooltip {
  70.    max-width:300px;
  71.    border-radius: 0px;
  72.    padding:4px;
  73.    margin:5px 10px 5px 0px;
  74.    color:{color:text};
  75.    border:1px solid {color:borders};
  76.    font-family: {select:font}, sans-serif;
  77.    font-size:11px;
  78.    background:{color:background};
  79.    z-index:99999;
  80. }
  81. ::-webkit-scrollbar {
  82.   width: 0.5vw;
  83.   height: 0.5vw;
  84. }
  85. ::-webkit-scrollbar-button {
  86.   width: 0px;
  87.   height: 0px;
  88. }
  89. ::-webkit-scrollbar-thumb {
  90.   background: {color:scrollbar};
  91.   border: 0px none {color:borders};
  92.   border-radius: 2px;
  93. }
  94. ::-webkit-scrollbar-thumb:active {
  95.   background: {color:scrollbar};
  96. }
  97. ::-webkit-scrollbar-track {
  98.   background: {color:posts};
  99.   border: 0px none {color:borders};
  100.   border-radius: 21px;
  101. }
  102. ::-webkit-scrollbar-track:active {
  103.   background: {color:scrollbar};
  104. }
  105. ::-webkit-scrollbar-corner {
  106.   background: transparent;
  107. }
  108.  
  109.     /* GENERAL STYLING */
  110. body {
  111.     background-color: {color:background};
  112.     color: {color:text};
  113.     font-family: {select:font};
  114.     margin: 0;
  115.     padding: 0 !important;
  116.     font-size: 0.75em;
  117.     word-break: break-word;
  118.     overflow-x: hidden;
  119. }
  120. a {
  121.   font-family:inherit;
  122.   font-weight: normal;
  123.   color: {color:accent};
  124.   text-decoration:none;
  125.   moz-transition-duration: 0.5s;
  126.     -o-transition-duration: 0.5s;
  127.     -webkit-transition-duration: 0.5s;
  128.     transition-duration: 0.5s;
  129. }
  130. a:hover {
  131.   color: {color:darker accent};
  132.   moz-transition-duration: 0.5s;
  133.     -o-transition-duration: 0.5s;
  134.     -webkit-transition-duration: 0.5s;
  135.     transition-duration: 0.5s;
  136. }
  137. blockquote {
  138.  border-left: 1px solid {color:borders};
  139.  padding-left: 5px;
  140.  margin-left: 12px;
  141. }
  142.  
  143. blockquote blockquote {
  144.  padding: 0 0 0 5px;
  145.  margin: 0 0 0 12px;
  146. }
  147. h1 {
  148.   font-size: 1.5em;
  149.   top: 30px;
  150.   text-align: center;
  151.   position: relative;
  152.   font-family: {select:heading font};
  153.   color: {color:overlays};
  154.   font-style: italic;
  155.   padding: 3px;
  156. }
  157. h2, h3, h4, h5, h6 {
  158.     text-align: center;
  159.     color: {color:accent};
  160.     font-style: italic;
  161.     font-family: {select:heading font};
  162.     font-size: 1.35em;
  163.     margin-top: 3px;
  164.     font-weight: normal;
  165. }
  166. .head {
  167.     color: {color:text};
  168.     font-weight: bold;
  169.     box-shadow: 0px -5px rgb({RGBcolor:accent}, 0.6) inset;
  170.     moz-transition-duration: 0.5s;
  171.     -o-transition-duration: 0.5s;
  172.     -webkit-transition-duration: 0.5s;
  173.     transition-duration: 0.5s;
  174. }
  175. .head:hover {
  176.     box-shadow: 0px -27px rgb({RGBcolor:accent}, 0.6) inset;
  177.     moz-transition-duration: 0.5s;
  178.     -o-transition-duration: 0.5s;
  179.     -webkit-transition-duration: 0.5s;
  180.     transition-duration: 0.5s;
  181. }
  182. b, strong {
  183. font-weight: bold;
  184. }
  185. i, em {
  186. font-style: italic;
  187. }
  188. /* CONTROLS */
  189. iframe.tmblr-iframe {
  190.     z-index:99999999999999!important;
  191.     top:-2px!important;
  192.     right:0!important;
  193.     opacity:0;
  194.     padding-right:38px;
  195.     /* delete invert(1) from here */
  196.         filter:invert(1) contrast(150%);
  197.         -webkit-filter:invert(1) contrast(150%);
  198.         -o-filter:invert(1) contrast(150%);
  199.         -moz-filter:invert(1) contrast(150%);
  200.         -ms-filter:invert(1) contrast(150%);
  201.     /* to here if your blog has a dark background */
  202.     transform:scale(0.65);
  203.     transform-origin:100% 0;
  204.     -webkit-transform:scale(0.65);
  205.     -webkit-transform-origin:100% 0;
  206.     -o-transform:scale(0.65);
  207.     -o-transform-origin:100% 0;
  208.     -moz-transform:scale(0.65);
  209.     -moz-transform-origin:100% 0;
  210.     -ms-transform:scale(0.65);
  211.     -ms-transform-origin:100% 0;}
  212.  
  213. iframe.tmblr-iframe:hover {
  214.     opacity:0.6!important;}
  215.  
  216. .hcontrols {
  217.     position:fixed;
  218.     top:0;
  219.     right:0;
  220.     z-index:999999999;}
  221.  
  222. .hcontrols svg {
  223.     width:14px;
  224.     height:14px;
  225.     padding:9px;}
  226.  
  227. .hcontrols svg path {
  228.     fill:#000000;/* change this to change the color of the icon */}
  229.  
  230. /* GENERAL POST STYLING, CONTROLS, AND PERMALINKS */
  231. #posts {
  232.     position: relative;
  233.     width: 400px;
  234.     top: 10vh;
  235.     left: 55vw;
  236.     margin-left: -200px;
  237.     margin-bottom: 60px;
  238. }
  239. .wrapper {
  240.     margin-top: 60px;
  241. }
  242. .post {
  243.     width: 400px;
  244.     background-color: {color:posts};
  245.     padding: 10px;
  246.     border: 1px solid {color:borders};
  247. }
  248. .post img, blockquote, li {
  249.   max-width: 100%;
  250. }
  251. .tagwrap {
  252.     margin-bottom: 50px;
  253.     background-color: {color:posts};
  254.     width: 410px;
  255.     padding: 5px;
  256.     border: 1px solid {color:borders};
  257.     border-top: 1px solid transparent;
  258.     word-break: break-all;
  259. }
  260. .tags  {
  261.     color: {color:text};
  262.     display: inline-block;
  263.     margin-left: 5px;
  264.     box-shadow: 0px -5px rgb({RGBcolor:accent}, 0.6) inset;
  265.     moz-transition-duration: 0.5s;
  266.     -o-transition-duration: 0.5s;
  267.     -webkit-transition-duration: 0.5s;
  268.     transition-duration: 0.5s;
  269. }
  270. .tags:hover {
  271.     color: {color:text};
  272.     box-shadow: 0px -16px rgb({RGBcolor:accent}, 0.6) inset;
  273.     moz-transition-duration: 0.5s;
  274.     -o-transition-duration: 0.5s;
  275.     -webkit-transition-duration: 0.5s;
  276.     transition-duration: 0.5s;
  277. }
  278. svg {
  279.    width:10px;
  280.    height:auto;
  281.    opacity:.5;
  282.    padding:1px;
  283.    display:block;
  284.    overflow:visible;
  285.    fill: {color:darker accent};
  286. }
  287. .controls a {
  288.    position:relative;
  289.    display:inline-block;
  290.    overflow:hidden;
  291.    padding:5px;
  292.    width:12px;
  293.    height:12px;
  294.    color: {color:darker accent};
  295. }
  296. .controls .reblog {
  297.    opacity:.93;
  298. }
  299. .controls .reblog svg {
  300.    width:9px;
  301.    margin-top:1px;
  302. }
  303. .controls .like .liked + svg {
  304.    opacity:1;
  305. }
  306. .controls .like .liked + svg path {
  307.    fill: {color:accent};
  308. }
  309. .controls .like .like_button {
  310.    position:relative;
  311. }
  312. .controls .like .like_button iframe {
  313.    position:absolute;
  314.    top:0;
  315.    left:0;
  316.    bottom:0;
  317.    right:0;
  318.    z-index:2;
  319.    opacity:0;
  320. }
  321. .permalink {
  322.     position: relative;
  323.     display: inline-block;
  324.     color: {color:text};
  325.     font-weight: normal;
  326.     margin-left: 5px;
  327.     margin-top: 3px;
  328. }
  329. /* SIDEBAR */
  330. .sidebar {
  331.     position: fixed;
  332.     width: 200px;
  333.     top: 20vh;
  334.     left: 15vw;
  335.     padding: 10px;
  336. }
  337. @media only screen and (max-width: 1030px) {
  338.     .sidebar {
  339.         left: 10vw;
  340.     }
  341.     #posts {
  342.         left: 60vw;
  343.     }
  344. }
  345. @media only screen and (max-width: 900px) {
  346.     .sidebar {
  347.         left: 7vw;
  348.     }
  349.     #posts {
  350.         left: 65vw;
  351.     }
  352.     }
  353. @media only screen and (max-width: 700px) {
  354.     .sidebar {
  355.         left: 3vw;
  356.         width: 150px;
  357. }
  358.     .side1 {
  359.         width: 150px !important;
  360.         margin: 0 !important;
  361.     }
  362.     .side2 {
  363.         width: 140px !important;
  364.         margin-top: 0px !important;
  365.         padding: 0px 5px;
  366.     }
  367.     .post {
  368.         width: 350px;
  369.     }
  370.     ol.notes {
  371.     width: 350px !important;
  372.     }
  373.     .link {
  374.         margin-left: 90px !important;
  375.     }
  376.     .caption, .tagwrap {
  377.         width: 360px;
  378.     }
  379.     .audio iframe {
  380.         width: 350px;
  381.     }
  382.     .video iframe {
  383.         width: 350px;
  384.     }
  385.     #posts {
  386.         left: 67vw;
  387.     }
  388. }
  389. @media only screen and (max-width: 600px) {
  390.     .header1 {
  391.         margin: 0;
  392.         position: relative;
  393.         display: block !important;
  394.     }
  395.     .header {
  396.         position: sticky !important;
  397.     }
  398.     #posts {
  399.         margin-top: 0;
  400.         left: 50vw;
  401.         top: 10vh;
  402.         margin-left: -135px;
  403.     }
  404.     ol.notes {
  405.         width: 250px !important;
  406.     }
  407.     #footer {
  408.         display: none;
  409.     }
  410.     {block:IfInfiniteScroll}
  411.     #footer2 {
  412.         display: none;
  413.     }
  414.     {/block:IfInfiniteScroll}
  415.     #footer2 {
  416.         font-size: 1.2em;
  417.         display: inline-block !important;
  418.         position: relative !important;
  419.         left: 50vw !important;
  420.         bottom: 20px !important;
  421.         text-align: center !important;
  422.         width: 200px;
  423.         margin-left: -150px;
  424.     }
  425.     .head {
  426.         display: none !important;
  427.     }
  428.     .links {
  429.         font-size: 1em;
  430.     }
  431.     #sidebar {
  432.         display: none !important;
  433.     }
  434.     .side1 {
  435.         display: none!important;
  436.     }
  437.     .side2 {
  438.         display: none!important;
  439.     }
  440.     .post {
  441.         width: 250px;
  442.     }
  443.     .link {
  444.         margin-left: 50px !important;
  445.     }
  446.     .caption {
  447.         width: 250px !important;
  448.     }
  449.    
  450.     .tagwrap {
  451.         width: 260px !important;
  452.     }
  453.     .audio iframe {
  454.         width: 250px !important;
  455.     }
  456.     .video iframe {
  457.         width: 250px !important;
  458.     }
  459. }
  460. @media only screen and (min-width: 1300px) and (max-width: 2000px) {
  461.     #posts {
  462.         left: 50vw;
  463.     }
  464. }
  465. .header1 {
  466.     top: 0;
  467.     left: 0;
  468.     width: 100vw;
  469.     height: 50vw;
  470.     display: none;
  471. }
  472. .side3 {
  473.     float: left;
  474.     width: 50%;
  475.     height: 100%;
  476.     display: inline-block;
  477. }
  478. .side4 {
  479.     width: 50%;
  480.     height: 100%;
  481.     overflow: scroll;
  482.     display: inline-block;
  483.     background-color: {color:accent};
  484.     color: {color:overlays};
  485. }
  486. .side1 {
  487.     width: 200px;
  488.     height: auto;
  489.     display: block;
  490.     margin-bottom: 0px;
  491.     position: relative;
  492. }
  493. .side2 {
  494.     width: inherit;
  495.     height: auto;
  496.     background-color:{color:accent};
  497.     display:inline-block;
  498.     position: relative;
  499.     }
  500. #description {
  501.     position: relative;
  502.     text-align: center;
  503.     margin-top: 40px;
  504.     padding: 5px;
  505.     padding-bottom: 20px;
  506.     color: {color:overlays};
  507. }
  508. #footer2 {
  509.     display: none;
  510. }
  511. /* HEADER */
  512. .header {
  513.     background-color: {color:sidebar};
  514.     border: 1px solid {color:borders};
  515.     box-sizing: border-box;
  516.     margin: 0px;
  517.     top: 0px;
  518.     position: sticky;
  519.     width: 100%;
  520.     z-index: 5;
  521.     padding-bottom: 4px;
  522. }
  523. .links {
  524.     position: relative;
  525.     text-align: center;
  526.     padding: 10px;
  527.     display: inline-block;
  528.     font-size: 1.1em;
  529. }
  530. .links a {
  531.     color: {color:text};
  532.     padding: 3px;
  533.     margin-left: 5px;
  534.     box-shadow: 0px -5px rgb({RGBcolor:accent}, 0.6) inset;
  535.     moz-transition-duration: 0.5s;
  536.     -o-transition-duration: 0.5s;
  537.     -webkit-transition-duration: 0.5s;
  538.     transition-duration: 0.5s;
  539. }
  540. .links a:hover {
  541.     box-shadow: 0px -22px rgb({RGBcolor:accent}, 0.6) inset;
  542.   moz-transition-duration: 0.5s;
  543.     -o-transition-duration: 0.5s;
  544.     -webkit-transition-duration: 0.5s;
  545.     transition-duration: 0.5s;
  546. }
  547. /* POST TYPES */
  548. .quote {
  549.     font-size: 14px;
  550.     text-align: center;
  551.     margin-left: 2px;
  552.     font-style: italic;
  553.     font-family: {select:heading font};
  554.     margin-bottom: 5px;
  555. }
  556. .th-quote-up:before {
  557.     content: '\eca8';
  558.     font-family: 'honeybee';
  559.     color: {color:accent};
  560.     font-size: 14px;
  561.     padding:1px;
  562. }
  563. .source {
  564.     font-size: 13px;
  565.     text-align: center;
  566. }
  567. .photoset-grid {
  568.     grid-gap: 1px;
  569. }
  570. .audio iframe {
  571.     height: 85px;
  572. }
  573. .chat {
  574.     list-style-type: none;
  575.     padding-left: 3px;
  576. }
  577. .line {
  578.     margin-bottom: 4px;
  579.     padding-top: 1px;
  580. }
  581. .link {
  582.     position: relative;
  583.     font-size: 1.5em;
  584.     margin-left: 120px;
  585.     font-family: {select:heading font};
  586.     font-style: italic;
  587. }
  588. .label {
  589.     font-variant: small-caps;
  590. }
  591. .asker img {
  592.     width: 30px;
  593.     padding: 4px;
  594.     vertical-align: middle;
  595. }
  596. .question_text {
  597.     padding: 4px 4px 15px 4px;
  598.     font-family: {select:heading font};
  599.     font-style: italic;
  600.     font-size: 1.25em;
  601. }
  602. .question {
  603.     margin-bottom: 10px;
  604.     border-bottom: 1px solid {color:borders};
  605. }
  606. .answerer img {
  607.     width: 30px;
  608.     padding: 4px;
  609.     vertical-align: middle;
  610. }
  611. .answer_text {
  612.     padding:4px;
  613.     font-family: {select:heading font};
  614.     font-style: italic;
  615.     font-size: 1.25em;
  616.     margin-top: -17px;
  617. }
  618. .answer_container {
  619.     margin-bottom: -10px;
  620. }
  621. /* ASK, SUBMIT, AND PERMALINK PAGE */
  622. {block:SubmitPage}
  623. .post {
  624.     margin-bottom: 60px;
  625. }
  626. {/block:SubmitPage}
  627. /* NOTES */
  628.  
  629. ol.notes {
  630.     margin-top: 50px;
  631.     list-style-type: none;
  632.     background-color: {color:posts};
  633.     padding: 10px;
  634.     width: 400px;
  635.     border: 1px solid {color:borders};
  636. }
  637. ol.notes li.note {
  638.     padding: 10px;
  639.     vertical-align: middle;
  640.     border-bottom: 1px solid {color:borders};
  641. }
  642. ol.notes li.note img.avatar {
  643.     vertical-align: middle;
  644.     padding: 5px;
  645.     width: 20px;
  646. }
  647. li.note.more_notes_link_container {
  648.     text-transform: lowercase;
  649. }
  650. /* PAGINATION */
  651. #footer {
  652.     position: relative;
  653.     top: 50px;
  654.     text-align: center;
  655. }
  656. .prev {
  657.     padding: 5px;
  658. }
  659. .next {
  660.     padding: 5px;
  661.     margin: 3px;
  662. }
  663. {block:Ifinfinitescroll}
  664. #footer {
  665.     display: none;
  666. }
  667. {/block:Ifinfinitescroll}
  668.  
  669.  
  670. /* captions */
  671. .commenter img {
  672.     width: 25px;
  673.     vertical-align: middle;
  674.     padding: 3px;
  675. }
  676. .caption {
  677.     background-color: {color:posts};
  678.     width: 400px;
  679.     padding: 10px;
  680.     border-bottom: 1px solid {color:borders};
  681.     border-left: 1px solid {color:borders};
  682.     border-right: 1px solid {color:borders};
  683. }
  684. .comment_container {
  685.     padding-top: 7px;
  686.     border-bottom: 1px solid {color:borders};
  687. }
  688. .comment_container:last-child {
  689.     border-bottom: 1px solid transparent;
  690.     margin-bottom: -4px;
  691. }
  692. /* CREDIT - DO NOT TOUCH! */
  693. .credit img {
  694.     width: 20px;
  695.     position: fixed;
  696.     bottom: 15px;
  697.     right: 17px;
  698.     text-align: center;
  699. }
  700. .th-chevron-up:before{
  701. content:'\ec1e';
  702. font-family:'honeybee';
  703. color: {color:accent};
  704. font-size: 20px;
  705. }
  706. #scrollto {
  707.     position: fixed;
  708.     bottom: 45px;
  709.     right: 17px;
  710. }
  711. #scrollto a {
  712.     color: {color:links};
  713. }
  714. #scrollto a:hover {
  715.     color: {color:links hover};
  716.     moz-transition-duration: 0.5s;
  717.     -o-transition-duration: 0.5s;
  718.     -webkit-transition-duration: 0.5s;
  719.     transition-duration: 0.5s;
  720. }
  721.     </style>
  722.     <!--SCRIPTS-->
  723.     <script>
  724. $(document).ready(function(){
  725.         $('.side2').hide();
  726.         $('.side1').hover(function(){
  727.         $('.side2').slideToggle("slow");
  728.         });
  729. $(window).scroll(function () {
  730.    if ($(this).scrollTop() > 200)
  731.    { $('#scrollto').fadeIn(); }
  732.    else
  733.    { $('#scrollto').fadeOut(); }
  734.    });
  735. $('#scrollto').click(function () {
  736.    $("html, body").animate({scrollTop:0}, 1000); return false;
  737.    });
  738.    $('.caption').each(function(){if($(this).html().trim() == '')$(this).remove();});
  739. });
  740. </script>
  741.    {block:Ifinfinitescroll}
  742.     <script>
  743.         $(document).ready(function() {
  744.             var $container = $('#posts')
  745.             $container.infiniteScroll({
  746.                 // options
  747.                 path: '.next',
  748.                 append: '.wrapper',
  749.                 history: false,
  750.             });
  751.             $container.on( 'append.infiniteScroll', function(e,r,p,newElements){
  752.        var $newElems = $(newElements);
  753.        var $newElemsIDs = $newElems.map(function(){
  754.            return this.id;
  755.        }).get();
  756.        Tumblr.LikeButton.get_status_by_post_ids($newElemsIDs);
  757. $('.caption').each(function(){if($(this).html().trim() == '')$(this).remove();});
  758.             });
  759.     });
  760.     </script>
  761.     {/block:Ifinfinitescroll}
  762.  
  763.     <script>
  764.    $(document).ready(function() {
  765.       $('iframe.tumblr_audio_player').load( function() {
  766.          $('iframe.tumblr_audio_player').contents().find("head")
  767.             .append($("<style type='text/css'> .audio-player{background:{color:audio} !important} </style>"));
  768.       });
  769.    });
  770. </script>
  771. <!--END SCRIPTS-->
  772.  
  773.     </head>
  774.  
  775.     <body>
  776.  
  777.     <!--HEADER-->
  778.     <aside class="sidebar">
  779.     <img class="side1" src="{image:sidebar}">
  780.     <div class="side2">
  781.     <a href="/">
  782.     <h1>{Title}</h1></a>
  783.  
  784.         {block:Description}
  785.             <p id="description">{Description}</p>
  786.         {/block:Description}
  787.         </div>
  788.                 {block:Pagination}
  789.         <p id="footer">
  790.             {block:PreviousPage}
  791.                 <a href="{PreviousPage}" class="prev">&#9668;</a>
  792.             {/block:PreviousPage}{block:NextPage}
  793.                 <a class="next" href="{NextPage}">&#9658;</a>
  794.             {/block:NextPage}
  795.         </p>
  796.         {/block:Pagination}
  797. </aside>
  798.  
  799. <div class="header">
  800. <h2 class="head" style="display: inline-block; padding: 5px; margin-left: 35px; font-style: italic; font-size: 1.35em;">{Title}</h2>
  801. <div class="links">
  802.         <a href="/" style="text-align: center;">index.</a>
  803.         {block:AskEnabled}<a href="/ask">message.</a>{/block:AskEnabled}
  804.         {block:SubmissionsEnabled}<a href="/submit">submit.</a>{/block:SubmissionsEnabled}
  805.         <a href="{text:link 1 url}">{text:link 1 title}</a>
  806.         <a href="{text:link 2 url}">{text:link 2 title}</a>
  807.         <a href="{text:link 3 url}">{text:link 3 title}</a>
  808.         </div>
  809.         </div></div>
  810.  <header class="header1">
  811.     <img class="side3" src="{image:sidebar}"/>
  812.     <div class="side4">
  813.         <a href="/">
  814.     <h1>{Title}</h1></a>
  815.  
  816.         {block:Description}
  817.             <p id="description">{Description}</p>
  818.         {/block:Description}
  819. </header>      
  820.        
  821. <!--END HEADER-->        
  822. <!--POSTS-->
  823.         <div id="posts">
  824.             {block:Posts}
  825.             <!--CONTROLS AND PERMALINK-->
  826.             <div class="wrapper" id="{PostID}">
  827.             <div class="controlw">
  828.             <div class="controls">
  829.             {block:Date}
  830. <a href="{ReblogURL}" target="_blank" class="reblog">
  831. <svg xmlns="https://www.w3.org/2000/svg" xmlns:xlink="https://www.w3.org/1999/xlink" version="1.1" id="Capa_1" x="0px" y="0px" viewBox="0 0 361.095 361.095" style="enable-background:new 0 0 361.095 361.095;" xml:space="preserve"><g><g><path d="M182.595,325.678c-63.183,0-120.133-42.217-138.267-102.567c-2.833-9.067-12.183-14.167-21.25-11.333    c-9.067,2.833-14.167,12.183-11.333,21.25c22.95,75.933,91.517,126.65,170.85,126.65c98.317,0,178.5-80.183,178.5-178.5    s-80.183-178.5-178.5-178.5c-55.817,0-108.233,26.633-141.667,69.7l-7.083-56.1c-1.133-9.35-9.633-15.867-18.983-14.733    C5.511,2.678-1.005,11.178,0.128,20.528l13.317,103.7c1.133,8.5,8.5,14.733,16.717,14.733c0.567,0,1.417,0,1.983,0l102.567-11.617    c9.35-1.133,16.15-9.35,15.017-18.7s-9.35-16.15-18.7-15.017l-68.85,7.65c26.633-39.95,71.683-64.6,120.417-64.6    c79.617,0,144.5,64.883,144.5,144.5S262.211,325.678,182.595,325.678z"/></g></g></svg>
  832. </a>
  833. <a href="#" class="like">{LikeButton}
  834. <svg xmlns="https://www.w3.org/2000/svg" xmlns:xlink="https://www.w3.org/1999/xlink" version="1.1" id="Capa_1" x="0px" y="0px" viewBox="0 0 442.403 442.403" style="enable-background:new 0 0 442.403 442.403;" xml:space="preserve"><g><g><path d="M213.05,422.652c2.833,1.7,5.95,2.833,9.35,2.833c3.117,0,6.517-0.85,9.35-2.833c7.65-5.1,187.283-123.533,207.683-243.95    c10.483-62.333-8.783-100.867-26.633-122.117c-20.967-24.933-52.133-39.667-83.017-39.667c-10.2,0-20.117,1.7-28.9,5.1    c-43.067,16.15-72.25,44.767-88.117,64.317c-15.583-19.267-42.217-47.033-74.517-58.083c-9.917-3.4-20.683-5.1-32.017-5.1    c-28.9,0-56.383,11.9-75.367,32.867c-16.717,18.417-35.7,53.55-29.75,114.75C13.016,291.185,204.833,417.268,213.05,422.652z     M56.083,78.685c17.283-18.983,38.817-21.817,50.15-21.817c7.367,0,14.45,1.133,20.967,3.4    c39.383,13.317,70.833,63.467,71.4,63.75c3.117,5.1,8.783,8.217,14.733,7.933c5.95,0,11.333-3.4,14.45-8.5    c0.283-0.567,28.617-48.733,85.283-69.983c4.817-1.7,10.767-2.833,16.717-2.833c20.967,0,42.217,10.483,56.95,27.767    c19.267,22.667,25.783,55.533,18.983,94.633c-7.367,43.067-42.5,94.633-101.717,149.317c-33.433,30.883-66.3,54.683-81.6,65.45    c-16.15-11.05-51-36.55-86.417-68.85C74.216,262.285,39.366,209.868,35.116,167.368C31.433,128.552,38.516,97.952,56.083,78.685z"/></g></g></svg>
  835. </a>
  836. {/block:Date}
  837. </div>
  838. </div>
  839. <!--END CONTROLS AND PERMALINK-->
  840. <!--POST TYPES-->
  841.  
  842.             {block:Text}
  843.             <div class="post" id="{PostId}">{block:Title}<h2 class="title">{Title}</h2>{/block:Title}<div class="body">
  844.             {block:NotReblog}{Body}{/block:NotReblog}
  845.             {block:RebloggedFrom}
  846.             {block:Reblogs}
  847.             <div class="comment_container">
  848.                 <div class="commenter">
  849.                     <img src="{PortraitURL-64}" />
  850.                     <span>
  851.                         {block:HasPermalink}<a href="{Permalink}">{/block:HasPermalink}{Username}{block:HasPermalink}</a>{/block:HasPermalink}
  852.                     </span>
  853.                 </div>
  854.                 <div class="comment">{Body}</div>
  855.             </div>
  856.             {/block:Reblogs}
  857.             {/block:RebloggedFrom}
  858.         </div>
  859.         </div>
  860.         {/block:Text}
  861.  
  862.         {block:Photo}
  863.         <div class="post" id="{PostID}"><img src="{PhotoURL-HighRes}" alt="{PhotoAlt}"></div>{/block:Photo}
  864.  
  865.  
  866.         {block:Photoset}<div class="post" id="{PostID}"><div class="photoset-grid" photoset-layout="{PhotosetLayout}">{block:Photos}<div><img src="{PhotoURL-HighRes}" /></div>{/block:Photos}</div></div>{/block:Photoset}
  867.  
  868.         {block:Quote}
  869.         <div class="post" id="{PostID}"><div class="quote"><span class="th th-quote-up"></span> {Quote}</div>
  870.         {block:Source}<div class="source">—{Source}</div>{/block:Source}</div>
  871.         {/block:Quote}
  872.  
  873.         {block:Link}
  874.         <div class="post" id="{PostID}">
  875.         <a href="{URL}" class="link path{block:Description} has-desc{/block:Description}" {Target}>{Name}</a>
  876.         {block:Description}
  877.         <div class="link-description">
  878.             {block:NotReblog}{Description}{/block:NotReblog}
  879.             {block:RebloggedFrom}
  880.             {block:Reblogs}
  881.             <div class="comment_container">
  882.                 <div class="commenter">
  883.                     <img src="{PortraitURL-64}" />
  884.                     <span>
  885.                         {block:HasPermalink}<a href="{Permalink}">{/block:HasPermalink}{Username}{block:HasPermalink}</a>{/block:HasPermalink}
  886.                     </span>
  887.                 </div>
  888.                 <div class="comment">{Body}</div>
  889.             </div>
  890.             {/block:Reblogs}
  891.             {/block:RebloggedFrom}
  892.         </div>
  893.         {/block:Description}</div>
  894.         {/block:Link}
  895.  
  896.         {block:Chat}
  897.         <div class="post" id="{PostID}">{block:Title}<h2 class="title">{Title}</h2>{/block:Title}{block:Lines}
  898.             <div class="line"><span class="label">{block:Label}{Label}{/block:Label}</span> {Line}</div>
  899.             {/block:Lines}
  900.         </div></div>
  901.  
  902.         {/block:Chat}
  903.  
  904.         {block:Audio}<div class="post" id="{PostID}"><div class="audio">{block:AudioEmbed}{AudioEmbed-400}{/block:AudioEmbed}</div></div>{/block:Audio}
  905.  
  906.         {block:Video}<div class="post" id="{PostID}">{VideoEmbed-400}</div>{/block:Video}
  907.  
  908.         {block:Answer}
  909.         <div class="post" id="{PostID}">
  910.         <div class="question">
  911.             <div class="asker">
  912.                 <img src="{AskerPortraitURL-48}"/>
  913.                 {Asker}
  914.             </div>
  915.             <div class="question_text">{Question}</div>
  916.         </div>
  917.         {block:Answerer}
  918.         <div class="answer_container">
  919.             <div class="answerer">
  920.                 <img src="{AnswererPortraitURL-48}"/>
  921.                 {Answerer}
  922.             </div>
  923.             <div class="answer_text">{Answer}</div>
  924.         </div>
  925.         {block:Reblogs}
  926.         <div class="reply_container">
  927.             <div class="replier">
  928.                 <img src="{PortraitURL-64}" />
  929.                 {block:HasPermalink}<a href="{Permalink}">{/block:HasPermalink}{Username}{block:HasPermalink}</a> {/block:HasPermalink}
  930.             </div>
  931.             <div class="reply">{Body}</div>
  932.         </div>
  933.         {/block:Reblogs}
  934.         {/block:Answerer}
  935.         {block:NotReblog}
  936.         <div class="answer_container">
  937.             <div class="answerer">
  938.                 <img src="{PortraitURL-48}" />
  939.                 <a href="{Name}">{Name}</a>
  940.             </div>
  941.             <div class="answer_text">{Answer}</div>
  942.         </div>
  943.         {/block:NotReblog}</div>
  944.  
  945.         {/block:Answer}
  946.  
  947.         {block:Caption}
  948.        <div class="caption">
  949.             {block:NotReblog}{Caption}{/block:NotReblog}
  950.             {block:RebloggedFrom}
  951.             {block:Reblogs}
  952.             <div class="comment_container">
  953.                 <div class="commenter">
  954.                     <img src="{PortraitURL-64}" />
  955.                     <span>
  956.                         {block:HasPermalink}<a href="{Permalink}">{/block:HasPermalink}{Username}{block:HasPermalink}</a>{/block:HasPermalink}
  957.                     </span>
  958.                 </div>
  959.                 <div class="comment">{Body}</div>
  960.             </div>
  961.             {/block:Reblogs}
  962.             {/block:RebloggedFrom}
  963.         </div>
  964.         {/block:Caption}
  965.         {block:Date}
  966.         <div class="tagwrap">
  967.         <a href="{Permalink}" class="permalink">{TimeAgo}{block:NoteCount}, {NoteCountWithLabel}{/block:NoteCount}</a>
  968.        
  969.   {block:HasTags}
  970.   {block:Tags}
  971.                 <a href="{TagURL}" class="tags">#{Tag}</a>
  972.                 {/block:Tags}
  973.                
  974.                 {/block:HasTags}
  975.                 </div>
  976.                 {/block:Date}
  977.                 {PostNotes}
  978.                 {/block:Posts}
  979.                 </div>
  980.         </div>
  981.         <!--END POST TYPES-->
  982.         <!--CREDIT AND SCROLL TO TOP - DO NOT TOUCH THE CREDIT-->
  983.        <a id="scrollto" title="scroll to top"><span class="th th-chevron-up"></span></a>
  984.         <a class="credit" href="https://aubadese.tumblr.com" title="theme credit"><img src="https://i.imgur.com/ZLwssBb.png"/></a>
  985.  
  986.         <!--PAGINATION-->
  987.             </div>
  988.                     {block:Pagination}
  989.         <p id="footer2">
  990.             {block:PreviousPage}
  991.                 <a href="{PreviousPage}" class="prev">&#9668;</a>
  992.             {/block:PreviousPage}{block:NextPage}
  993.                 <a class="next" href="{NextPage}">&#9658;</a>
  994.             {/block:NextPage}
  995.         </p>
  996.         {/block:Pagination}
  997.  
  998.         <div class="hcontrols"><svg version="1.1" id="Layer_1" xmlns="https://www.w3.org/2000/svg" xmlns:xlink="https://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 216 216" enable-background="new 0 0 216 216" xml:space="preserve"><path d="M106.6,134c14.3,0,26-11.7,26-26s-11.7-26-26-26s-26,11.7-26,26S92.2,134,106.6,134z M106.6,94c7.7,0,14,6.3,14,14s-6.3,14-14,14s-14-6.3-14-14S98.9,94,106.6,94z M40.4,124.6l7.2,3.3c3,1.4,4.4,4.8,3.3,7.9l-2.8,7.4c-2.1,5.7-1.4,11.8,2.1,16.7c3.4,5,9,7.9,15,7.9c2.2,0,4.4-0.4,6.5-1.2l7.4-2.8c0.7-0.3,1.4-0.4,2.2-0.4c2.4,0,4.7,1.4,5.7,3.7l3.3,7.2c3,6.6,9.4,10.7,16.6,10.7s13.6-4.1,16.6-10.7l3.3-7.2c1-2.2,3.2-3.7,5.7-3.7c0.7,0,1.5,0.1,2.2,0.4l7.4,2.8c2.1,0.8,4.3,1.2,6.5,1.2c0,0,0,0,0,0c5.9,0,11.5-3,15-7.9c3.4-5,4.2-11.1,2.1-16.7l-2.8-7.4c-1.1-3.1,0.3-6.5,3.3-7.9l7.2-3.3c6.6-3,10.7-9.4,10.7-16.6s-4.1-13.6-10.7-16.6l-7.2-3.3c-3-1.4-4.4-4.8-3.3-7.9l2.8-7.4c2.1-5.7,1.4-11.8-2.1-16.7c-3.4-5-9-7.9-15-7.9c-2.2,0-4.4,0.4-6.5,1.2l-7.4,2.8c-0.7,0.3-1.4,0.4-2.2,0.4c-2.4,0-4.7-1.4-5.7-3.7l-3.3-7.2c-3-6.6-9.4-10.7-16.6-10.7S93,35.2,90,41.8l-3.3,7.2c-1,2.2-3.2,3.7-5.7,3.7c-0.7,0-1.5-0.1-2.2-0.4l-7.4-2.8c-2.1-0.8-4.3-1.2-6.5-1.2c-5.9,0-11.5,3-15,7.9c-3.4,5-4.2,11.1-2.1,16.7l2.8,7.4c1.1,3.1-0.3,6.5-3.3,7.9l-7.2,3.3c-6.6,3-10.7,9.4-10.7,16.6S33.8,121.6,40.4,124.6z M45.3,102.3l7.2-3.3c8.7-4,12.9-14.1,9.5-23l-2.8-7.4c-1-2.7,0-4.7,0.7-5.7c1.6-2.4,4.6-3.4,7.4-2.3l7.4,2.8c2.1,0.8,4.2,1.2,6.4,1.2c0,0,0,0,0,0c7.1,0,13.6-4.2,16.6-10.7l3.3-7.2c1.5-3.4,4.7-3.7,5.7-3.7s4.1,0.3,5.7,3.7l3.3,7.2c3,6.5,9.5,10.7,16.6,10.7c2.2,0,4.3-0.4,6.4-1.2l7.4-2.8c2.8-1,5.7,0,7.4,2.3c0.7,1,1.7,3,0.7,5.7l-2.8,7.4c-3.3,8.9,0.8,19,9.5,23l7.2,3.3c3.4,1.5,3.7,4.7,3.7,5.7s-0.3,4.1-3.7,5.7l-7.2,3.3c-8.7,4-12.9,14.1-9.5,23l2.8,7.4c1,2.7,0,4.7-0.7,5.7c-1.6,2.4-4.6,3.4-7.4,2.3l-7.4-2.8c-2.1-0.8-4.2-1.2-6.4-1.2c-7.1,0-13.6,4.2-16.6,10.7l-3.3,7.2c-1.5,3.4-4.7,3.7-5.7,3.7s-4.1-0.3-5.7-3.7l-3.3-7.2c-3-6.5-9.5-10.7-16.6-10.7c-2.2,0-4.3,0.4-6.4,1.2l-7.4,2.8c-2.8,1-5.7,0-7.4-2.3c-0.7-1-1.7-3-0.7-5.7l2.8-7.4c3.3-8.9-0.8-19-9.5-23l-7.2-3.3c-3.4-1.5-3.7-4.7-3.7-5.7S41.9,103.9,45.3,102.3z"/></svg></div>
  999.     </body>
  1000. </html>
Advertisement
Add Comment
Please, Sign In to add comment