Advertisement
Laighlin

#23: RGBA(3) (Mobile colors)

Dec 15th, 2017
2,791
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 19.56 KB | None | 0 0
  1. <!DOCTYPE html>
  2. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  3.  
  4. <meta name="image:Favicon" content=""/>
  5. <meta name="if:Custom favicon" content="0"/>
  6. <meta name="if:Custom title" content="0"/>
  7. <meta name="if:Search bar" content="1"/>
  8. <meta name="if:400px posts" content="1"/>
  9. <meta name="if:Gradient borders" content="0"/>
  10. <meta name="if:Hide captions" content="0"/>
  11. <meta name="if:Hide tags" content="0"/>
  12. <meta name="text:Title" content=""/>
  13. <meta name="text:Body font" content="Roboto"/>
  14. <meta name="text:Font size" content="13px"/>
  15.  
  16. {block:Description}<meta name="description" content="{MetaDescription}"/>{/block:Description}
  17.  
  18. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  19. <head><title>{Title}{block:PostSummary} &mdash; {PostSummary}{/block:PostSummary}{block:SearchPage} &mdash; {lang:Search results for SearchQuery}{/block:SearchPage}</title>
  20.  
  21. {block:ifCustomFavicon}
  22. <link rel="shortcut icon" href="{image:favicon}"/>
  23. {/block:ifCustomFavicon}
  24. {block:ifNotCustomFavicon}
  25. <link rel="shortcut icon" href="{Favicon}"/>
  26. {/block:ifNotCustomFavicon}
  27.  
  28. <link href="https://fonts.googleapis.com/css?family={text:Body font}:400,400i,700,700i" rel="stylesheet">
  29. <link rel="stylesheet" href="https://cdn.linearicons.com/free/1.0.0/icon-font.min.css">
  30.  
  31. <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
  32. <script src="https://cdnjs.cloudflare.com/ajax/libs/smoothscroll/1.4.6/SmoothScroll.min.js"></script>
  33. <script src="https://static.tumblr.com/7qjmkr5/IUmmdsy41/jquery.style-my-tooltips.js"></script>
  34.  
  35. <style>
  36.  
  37. body, html {
  38.     background:{BackgroundColor};
  39.     margin:0;
  40.     padding:0;
  41.     font:{text:Font size} '{text:Body font}';
  42.     color:rgba({RGBTitleColor},.75);
  43.     line-height:1.5em;
  44. }
  45.  
  46. *:not(#s-m-t-tooltip) {
  47.     transition:.3s all ease;
  48. }
  49.  
  50. ::-webkit-scrollbar {
  51.     width:10px;
  52.     height:10px;
  53. }
  54.  
  55. ::-webkit-scrollbar-track {
  56.     border:4px solid {BackgroundColor};
  57.     {block:ifGradientBorders}
  58.     background:linear-gradient(to top,{AccentColor} -20%,{BackgroundColor} 120%);
  59.     {/block:ifGradientBorders}
  60.     {block:ifNotGradientBorders}
  61.     background:{AccentColor};
  62.     {/block:ifNotGradientBorders}
  63. }
  64.  
  65. ::-webkit-scrollbar-thumb, ::-webkit-scrollbar-corner {
  66.     border:2px solid {AccentColor};
  67.     background:{BackgroundColor};
  68. }
  69.  
  70. ::selection {
  71.     background:rgba({RGBAccentColor},.6);
  72.     color:{BackgroundColor};
  73. }
  74.  
  75. ::moz-selection {
  76.     background:rgba({RGBAccentColor},.6);
  77.     color:{BackgroundColor};
  78. }
  79.  
  80. h1, h2, h3, h4, h5 {
  81.     margin:10px;
  82.     font-family:{TitleFont};
  83.     font-weight:{TitleFontWeight};
  84. }
  85.  
  86. p:first-child { margin-top:0; }
  87. p:last-child { margin-bottom:0; }
  88.  
  89. a {
  90.     text-decoration:none;
  91.     outline:none;
  92.     color:inherit;
  93. }
  94.  
  95. #s-m-t-tooltip {
  96.     margin:14px;
  97.     background:{BackgroundColor};
  98.     border:2px solid rgba({RGBAccentColor},.6);
  99.     color:inherit;
  100.     font-style:italic;
  101.     padding:6px 8px;
  102.     z-index:9999;
  103.     pointer-events:none;
  104. }
  105.  
  106. #sidebar {
  107.     border-width:0 2px;
  108.     {block:ifGradientBorders}
  109.     border-image:linear-gradient(to bottom,{AccentColor} 0%,rgba({RGBAccentColor},.2) 80%);
  110.     {/block:ifGradientBorders}
  111.     {block:ifNotGradientBorders}
  112.     border-color:{AccentColor};
  113.     {/block:ifNotGradientBorders}
  114.     top:0;
  115.     bottom:0;
  116.     width:220px;
  117.     padding:10px;
  118.     left:100px;
  119.     flex-flow:column nowrap;
  120.     align-items:center;
  121. }
  122.  
  123. #pagination {
  124.     line-height:1em;
  125.     border-width:2px 0;
  126.     {block:ifGradientBorders}
  127.     border-image:linear-gradient(to left,{AccentColor} 0%,rgba({RGBAccentColor},.2) 80%);
  128.     {/block:ifGradientBorders}
  129.     {block:ifNotGradientBorders}
  130.     border-color:{AccentColor};
  131.     {/block:ifNotGradientBorders}
  132.     left:0;
  133.     right:0;
  134.     height:30px;
  135.     bottom:100px;
  136.     align-items:center;
  137.     justify-content:flex-end;
  138.     padding:0 40px;
  139. }
  140.  
  141. .pag { flex-grow:0; line-height:1em; }
  142.  
  143. .pag.lnr {
  144.     font-size:27px;
  145.     margin:0 2px;
  146.     background:{BackgroundColor};
  147.     padding:10px;
  148. }
  149.  
  150. .pag.lnr:hover, .linke:hover {
  151.     color:{TitleColor};
  152.     border-color:{AccentColor};
  153. }
  154.  
  155. .pag.cur {
  156.     padding:0 7px;
  157.     font:13px {TitleFont};
  158.     pointer-events:none;
  159. }
  160.  
  161. #sidebar, #pagination {
  162.     position:fixed;
  163.     display:flex;
  164.     border-image-slice:9;
  165.     border-style:solid;
  166. }
  167.  
  168. #title {
  169.     margin:30px 10px -15px;
  170.     text-align:center;
  171.     text-transform:uppercase;
  172.     color:{TitleColor};
  173.     font:{TitleFontWeight} 1.4em {TitleFont};
  174. }
  175.  
  176. img#side {
  177.     margin-top:35px;
  178.     padding:13px;
  179. }
  180.  
  181. img#side, .linke, #search input, .pag.lnr, .post, .info {
  182.     border:2px solid rgba({RGBAccentColor},.3);
  183. }
  184.  
  185. #desc {
  186.     text-align:center;
  187.     margin:35px 30px;
  188. }
  189.  
  190. #search {
  191.     position:absolute;
  192.     bottom:169px;
  193. }
  194.  
  195. #search input {
  196.     color:rgba({RGBTitleColor},.5);
  197.     background:{BackgroundColor};
  198.     line-height:1em;
  199.     width:139px;
  200.     padding:7px;
  201.     font-family:{TitleFont};
  202.     font-weight:{TitleFontWeight};
  203.     outline:none;
  204.     text-align:center;
  205.     text-transform:uppercase;
  206. }
  207.  
  208. #search input:focus {
  209.     border-color:{AccentColor};
  210.     color:{TitleColor};
  211.     text-transform:initial;
  212. }
  213.  
  214. #links {
  215.     position:fixed;
  216.     width:40px;
  217.     top:30px;
  218.     bottom:164px;
  219.     left:30px;
  220.     counter-reset:linx;
  221. }
  222.  
  223. .linke {
  224.     display:block;
  225.     margin-bottom:30px;
  226.     text-align:center;
  227.     line-height:1em;
  228.     font:{TitleFontWeight} 14px {TitleFont};
  229.     padding:10px 4px;
  230. }
  231.  
  232. .linke:not(#cred):before {
  233.     counter-increment:linx;
  234.     content:counter(linx,lower-roman);
  235. }
  236.  
  237. #cred {
  238.     position:fixed;
  239.     box-sizing:border-box;
  240.     bottom:0px;
  241.     left:30px;
  242.     padding:9px 3px;
  243.     width:40px;
  244. }
  245.  
  246. #content {
  247.     left:344px;
  248.     right:181px;
  249.     height:100%;
  250.     position:absolute;
  251.     z-index:9;
  252. }
  253.  
  254. .post {
  255.     margin:50px auto 0;
  256.     padding:0 13px 13px;
  257. }
  258.  
  259. .post, .info {
  260.     background:{BackgroundColor};
  261.     {block:if400pxposts}
  262.     width:400px;
  263.     {/block:if400pxposts}
  264.     {block:ifnot400pxposts}
  265.     width:500px;
  266.     {/block:ifnot400pxposts}
  267. }
  268.  
  269. #sidebar, #pagination {
  270.     /*display:none;*/
  271.     z-index:3;
  272. }
  273.  
  274. .post-title, .ques {
  275.     margin:0;
  276.     background:rgba({RGBAccentColor},.15);
  277.     color:{TitleColor};
  278.     padding:7px 9px;
  279.     margin-top:13px;
  280.     text-align:center;
  281. }
  282.  
  283. @font-face {
  284.     font-family: Calluna;
  285.     src: url("https://assets.tumblr.com/fonts/calluna/Calluna-BoldIt-webfont.eot?3=&v=f685dc881c60c298ea22a73fe505b88a");
  286.     src: url("https://assets.tumblr.com/fonts/calluna/Calluna-BoldIt-webfont.eot?3%3F=&v=f685dc881c60c298ea22a73fe505b88a#iefix") format("embedded-opentype"),url("https://assets.tumblr.com/fonts/calluna/Calluna-BoldIt-webfont.woff?3=&v=760a50f4d098e59aebaf0f0e58ae2cc8") format("woff"),url("https://assets.tumblr.com/fonts/calluna/Calluna-BoldIt-webfont.ttf?3=&v=5ace789439bff3b27f8d4112725531da") format("truetype"),url("https://assets.tumblr.com/fonts/calluna/Calluna-BoldIt-webfont.svg?3=&v=5b95c481dd7411c6e112143d6646bd9b#_.regular") format("svg");
  287.     font-weight: 700;
  288.     font-style: italic;
  289. }
  290.  
  291. @font-face {
  292.     font-family: Fairwater;
  293.     src: url("https://assets.tumblr.com/fonts/fairwater/fairwater_script_regular-webfont.woff2?v=b7ab7a58cded3365889a447bfd9e9c45") format("woff2"),url("https://assets.tumblr.com/fonts/fairwater/fairwater_script_regular-webfont.woff?v=96e975b7468359e6f67086305577e43e") format("woff");
  294.     font-weight: 400;
  295.     font-style: normal;
  296. }
  297. p.npf_quirky { font:1.7em Fairwater; }
  298. p.npf_chat { font:1.7em Courier; }
  299. p.npf_quote { font:1.7em Calluna; }
  300.  
  301. .caption, .media-wrap, .more {
  302.     {block:if400pxposts}
  303.     width:400px;
  304.     {/block:if400pxposts}
  305.     {block:ifnot400pxposts}
  306.     width:500px;
  307.     {/block:ifnot400pxposts}
  308.     box-sizing:border-box;
  309. }
  310.  
  311. .caption {
  312.     line-height:1.5em;
  313. }
  314.  
  315. .caption img {
  316.     margin:5px 0;
  317. }
  318.  
  319. .caption, .tag-wrap {
  320.     padding:10px;
  321.     background:rgba({RGBTitleColor},.03);
  322. }
  323.  
  324. .caption a, #desc a {
  325.     border-bottom:1px solid rgba({RGBAccentColor},.6);
  326. }
  327.  
  328. .caption a:hover, #desc a:hover {
  329.     color:{TitleColor};
  330.     border-bottom-color:transparent;
  331. }
  332.  
  333. .tumblr_blog {
  334.     font-weight:bold;
  335. }
  336.  
  337. blockquote, blockquote blockquote {
  338.     margin:auto 0;
  339.     padding-left:10px;
  340.     border-left:2px solid rgba({RGBAccentColor},.5);
  341. }
  342.  
  343. hr {
  344.     border:none;
  345.     border-top:2px solid rgba({RGBAccentColor},.3);
  346.     margin:1em 20%;
  347. }
  348.  
  349. .media-wrap, .caption, .tag-wrap, .more {
  350.     margin:13px 0 0;
  351. }
  352.  
  353. .media-wrap.no-text {
  354.     line-height:0;
  355. }
  356.  
  357. .media-wrap img {
  358.     max-width:100%;
  359.     margin:auto;
  360. }
  361.  
  362. .quote {
  363.     font-weight:normal;
  364.     padding:10px;
  365.     line-height:1.4em;
  366. }
  367.  
  368. .chat {
  369.     padding:7px;
  370.     border-top:1px solid rgba({RGBAccentColor},.2);
  371. }
  372.  
  373. .chat:first-child { margin-top:6px; border-top:none; }
  374. .chat.odd { text-indent:20px; }
  375.  
  376. .link-host {
  377.     font:bold {text:Font size} '{text:Body font}';
  378.     margin-bottom:5px;
  379. }
  380.  
  381. .askr {
  382.     position:relative;
  383.     z-index:2;
  384.     text-align:center;
  385.     text-transform:uppercase;
  386.     display:block;
  387.     font:{TitleFontWeight} 1.2em {TitleFont};
  388.     margin:4px auto -11px;
  389. }
  390.  
  391. .a-url {
  392.     background:{BackgroundColor};
  393.     padding:3px 8px;
  394. }
  395.  
  396. .askr a { color:{AccentColor}; }
  397. .askr a:hover { color:{TitleColor}; }
  398.  
  399. .ques {
  400.     background:transparent;
  401.     border:2px solid rgba({RGBAccentColor},.2);
  402.     margin:0;
  403.     padding:15px 12px 12px;
  404.     color:inherit;
  405.     font-style:italic;
  406. }
  407.  
  408. .tumblr_audio_player {
  409.     height:85px !important;
  410. }
  411.  
  412. .tag-wrap {
  413.     font-size:.92em;
  414. }
  415.  
  416. .tag {
  417.     color:rgba({RGBAccentColor},.7);
  418.     margin-right:5px;
  419. }
  420.  
  421. .tag:hover, #notes .tumblelog:hover { color:{AccentColor}; }
  422.  
  423. .more {
  424.     padding:10px;
  425.     display:block;
  426.     text-align:center;
  427.     background:rgba({RGBAccentColor},.15);
  428.     text-transform:uppercase;
  429.     font-family:{TitleFont};
  430.     font-weight:{TitleFontWeight};
  431. }
  432.  
  433. .more:hover {
  434.     color:{TitleColor};
  435. }
  436.  
  437. /*Fade in content*/
  438.  
  439. @-webkit-keyframes fade { from { opacity:0; } to { opacity:1; } }
  440. @-moz-keyframes fade { from { opacity:0; } to { opacity:1; } }
  441. @keyframes fade { from { opacity:0; } to { opacity:1; } }
  442.  
  443. #sidebar, #pagination {
  444.     opacity:0;
  445.     -webkit-animation:.5s ease-in 1.1s 1 forwards fade;
  446.     -moz-animation:.5s ease-in 1.1s 1 forwards fade;
  447.     animation:.5s ease-in 1.1s 1 forwards fade;
  448. }
  449.  
  450. #content {
  451.     opacity:0;
  452.     -webkit-animation:1.3s ease-in 1.4s 1 forwards fade;
  453.     -moz-animation:1.3s ease-in 1.4s 1 forwards fade;
  454.     animation:1.3s ease-in 1.4s 1 forwards fade;
  455. }
  456.  
  457. .info {
  458.     padding:13px;
  459.     margin:13px auto 50px;
  460.     font-family:{TitleFont};
  461.     position:relative;
  462.     text-transform:uppercase;
  463. }
  464.  
  465. .info a, #notes .tumblelog { color:rgba({RGBAccentColor},.7); }
  466. .info a:hover { color:rgba({RGBAccentColor},.9); }
  467.  
  468. .controls {
  469.     font-size:16px;
  470.     float:right;
  471.     margin-top:1px;
  472. }
  473.  
  474. .controls a {
  475.     color:rgba({RGBTitleColor},.4);
  476. }
  477.  
  478. .lnr-redo {
  479.     margin-right:10px;
  480. }
  481.  
  482. .like-wrap {
  483.     position:relative;
  484.     width:30px;
  485.     height:30px;
  486. }
  487.  
  488. .like_button {
  489.     position:absolute;
  490.     z-index:5;
  491.     top:-2px;
  492.     left:0;
  493.     opacity:0;
  494.     width:16px;
  495.     height:16px;
  496. }
  497.  
  498. .like_button iframe {
  499.     width:100% !important;
  500.     height:100% !important;
  501. }
  502.  
  503. .like-btn { z-index:1; }
  504.  
  505. .like_button.liked + .like-btn { color:{TitleColor}; }
  506.  
  507. #notes {
  508.     margin-bottom:50px;
  509.     padding:10px;
  510. }
  511.  
  512. #notes blockquote { margin-left:9px; }
  513.  
  514. #notes ol.notes {
  515.     list-style-type:none;
  516.     padding:0;
  517.     margin:0;
  518. }
  519.  
  520. li.note {
  521.     border-bottom:1px solid rgba({RGBcolor:borders},.5);
  522.     padding:5px;
  523. }
  524.  
  525. #notes ol.notes li:last-child { border-bottom:none; }
  526.  
  527. #notes ol.notes img.avatar {
  528.     margin-right:7px;
  529.     margin-top:calc(1em - 15px);
  530.     width:20px;
  531.     height:20px;
  532.     float:left;
  533.     border-radius:2px;
  534. }
  535.  
  536. #notes .tumblelog, #notes .source_tumblelog, .note.like a {
  537.     font-family:{TitleFont};
  538.     text-transform:uppercase;
  539. }
  540.  
  541. .caption:empty, #title:empty, .post-title:empty, #desc:empty {
  542.     display:none;
  543. }
  544.  
  545. {block:IndexPage}
  546. {block:ifHideCaptions}
  547. .caption:not(.text-body) { display:none; }
  548. /*keeps the captions on text posts for obvious reasons*/
  549. {/block:ifHideCaptions}
  550.  
  551. {block:ifHideTags}
  552. .tag-wrap { display:none; }
  553. {/block:ifHideTags}
  554. {/block:IndexPage}
  555.    
  556. {CustomCSS}
  557.  
  558. </style>
  559. </head>
  560.  
  561. <body>
  562.    
  563. <aside id="sidebar">
  564.     {block:ifNotCustomTitle}
  565.     <h1 id="title">{Title}</h1>
  566.     {/block:ifNotCustomTitle}
  567.     {block:ifCustomTitle}
  568.     <h1 id="title">{text:Title}</h1>
  569.     {/block:ifCustomTitle}
  570.     {block:ShowAvatar}
  571.     <img id="side" src="{PortraitURL-128}">
  572.     {/block:ShowAvatar}
  573.     <section id="desc">
  574.         {Description}  
  575.     </section>
  576.     {block:ifSearchBar}
  577.     <form id="search" action="/search" method="get">
  578.         <input type="text" name="q" value="{lang:Search}" onfocus="if (this.value == '{lang:Search}') {this.value=''}" onblur="if (this.value == '') {this.value='{lang:Search}'}"/>
  579.     </form>
  580.     {/block:ifSearchBar}
  581.     <nav id="links">
  582.     <a class="linke" href="/" title="Index"></a>
  583.     {block:AskEnabled}<a class="linke" href="/ask" title="Ask"></a>{/block:AskEnabled}
  584.     {block:SubmissionsEnabled}<a class="linke" href="/submit" title="Submit"></a>{/block:SubmissionsEnabled}
  585.     {block:HasPages}
  586.         {block:Pages}
  587.             <a class="linke" href="{URL}" title="{Label}"></a>
  588.         {/block:Pages}
  589.     {/block:HasPages}
  590.     </nav>
  591.     <a class="linke" id="cred" href="http://linthm.tumblr.com/thm" title="Theme by Laighlin">@L</a>
  592. </aside>
  593.  
  594. <main id="content">
  595.     {block:SearchPage}
  596.     <article class="post">
  597.         <h2 class="post-title">
  598.             {block:SearchResults}
  599.                 {lang:SearchResultCount results for SearchQuery 2}
  600.             {/block:SearchResults}
  601.             {block:NoSearchResults}
  602.                 {lang:No search results for SearchQuery 2}
  603.             {/block:NoSearchResults}
  604.         </h2>
  605.         {block:NoSearchResults}
  606.         <div class="caption">This blog might have search indexing disabled. Tough luck.</div>
  607.         {/block:NoSearchResults}
  608.     </article>
  609.     {/block:SearchPage}
  610.     {block:TagPage}
  611.     <article class="post">
  612.         <h2 class="title">
  613.             {lang:Posts tagged Tag 3}
  614.         </h2>
  615.     </article>
  616.     {/block:TagPage}
  617.     {block:Posts inlineMediaWidth="400" nestedMediaWidth="380"}
  618.     <article class="post">
  619.         {block:Title}
  620.         <h2 class="post-title">{Title}</h2>
  621.         {/block:Title}
  622.        
  623.         {block:Text}
  624.         <div class="text-body caption">{Body}</div>
  625.         {/block:Text}
  626.        
  627.         {block:Answer}
  628.         <div class="askr">
  629.         <span class="a-url"><i class="lnr lnr-bubble"></i> {Asker}</span>
  630.         </div>
  631.         <div class="ques">{Question}</div>
  632.         <div class="caption">{Answer}</div>
  633.         {/block:Answer}
  634.        
  635.         {block:Chat}
  636.         {block:Lines}
  637.         <div class="chat {Alt}">{block:Label}<b>{Label} </b>{/block:Label}{Line}</div>
  638.         {/block:Lines}
  639.         {/block:Chat}
  640.        
  641.         {block:Link}
  642.         <a href="{URL}">
  643.         <h2 class="post-title">
  644.             {block:Host}<div class="link-host">{Host}</div>{/block:Host}
  645.             {Name}&nbsp;&raquo;
  646.         </h2></a>
  647.         <div class="caption">
  648.             {block:Excerpt}<blockquote>{Excerpt}</blockquote>{/block:Excerpt}
  649.             {block:Description}{Description}{/block:Description}
  650.         </div>
  651.         {/block:Link}
  652.        
  653.         {block:Quote}
  654.         <h2 class="post-title quote">&raquo; {Quote}</h2>
  655.         {block:Source}<div class="caption" style="text-align:right">— {Source}</div>{/block:Source}
  656.         {/block:Quote}
  657.        
  658.         {block:Photo}
  659.         <figure class="media-wrap no-text">
  660.             {LinkOpenTag}<img src="{PhotoURL-500}" width="100%">{LinkCloseTag}
  661.             {block:Caption}
  662.             <figcaption class="caption">{Caption}</figcaption>
  663.             {/block:Caption}
  664.         </figure>
  665.         {/block:Photo}
  666.        
  667.         {block:Photoset}
  668.         <figure class="media-wrap no-text">
  669.         {block:if400pxposts}
  670.             {Photoset-400}
  671.         {/block:if400pxposts}
  672.         {block:ifnot400pxposts}
  673.             {Photoset-500}
  674.         {/block:ifnot400pxposts}
  675.             {block:Caption}
  676.             <figcaption class="caption">{Caption}</figcaption>
  677.             {/block:Caption}
  678.         </figure>
  679.         {/block:Photoset}
  680.        
  681.         {block:Audio}
  682.         <figure class="media-wrap no-text">
  683.         {block:if400pxposts}
  684.             {AudioEmbed-400}
  685.         {/block:if400pxposts}
  686.         {block:ifnot400pxposts}
  687.             {AudioEmbed-500}
  688.         {/block:ifnot400pxposts}
  689.             {block:Caption}
  690.             <figcaption class="caption">{Caption}</figcaption>
  691.             {/block:Caption}
  692.         </figure>
  693.         {/block:Audio}
  694.        
  695.         {block:Video}
  696.         <figure class="media-wrap no-text">
  697.         {block:if400pxposts}
  698.             {Video-400}
  699.         {/block:if400pxposts}
  700.         {block:ifnot400pxposts}
  701.             {Video-500}
  702.         {/block:ifnot400pxposts}
  703.             {block:Caption}
  704.             <figcaption class="caption">{Caption}</figcaption>
  705.             {/block:Caption}
  706.         </figure>
  707.         {/block:Video}
  708.        
  709.         {block:More}
  710.         <a class="more" href="{Permalink}">{lang:Keep reading}</a>
  711.         {/block:More}
  712.        
  713.         {block:HasTags}
  714.         <footer class="tag-wrap">
  715.             {block:Tags}<a class="tag" href="{TagURL}">#{Tag}</a>{/block:Tags}
  716.         </footer>
  717.         {/block:HasTags}
  718.     </article>
  719.     {block:Date}
  720.     <footer class="info">
  721.         <a href="{Permalink}" title="{TimeAgo}">{DayofMonth}.{MonthNumber}.{Year}</a>
  722.         {block:NoteCount}
  723.          &bull; <a href="{Permalink}#notes">{NoteCountWithLabel}</a>
  724.         {/block:NoteCount}
  725.         {block:RebloggedFrom}
  726.         <br/>
  727.         <a href="{ReblogParentURL}" title="{ReblogParentName}">via</a> &bull; <a href="{ReblogRootURL}" title="{ReblogRootName}">op</a>
  728.         {/block:RebloggedFrom}
  729.         {block:ContentSource}
  730.         {block:RebloggedFrom} &bull; {/block:RebloggedFrom}
  731.         <a href="{SourceURL}" title="{SourceTitle}">src</a>
  732.         {/block:ContentSource}
  733.        
  734.         <div class="controls">
  735.             <a href="{ReblogURL}"><span class="lnr lnr-redo"></span></a>
  736.             <span class="like-wrap">{LikeButton}<a class="like-btn lnr lnr-heart"></a></span>
  737.         </div>
  738.     </footer>
  739.     {/block:Date}
  740.     {block:PostNotes}
  741.     <footer id="notes" class="post" name="notes">
  742.         {PostNotes-64}
  743.     </footer>
  744.     {/block:PostNotes}
  745.     {/block:Posts}
  746. </main>
  747.  
  748. <nav id="pagination">
  749.     {block:Pagination}
  750.     {block:PreviousPage}
  751.     <a class="pag prev lnr lnr-arrow-left" href="{PreviousPage}"></a>
  752.     {/block:PreviousPage}
  753.     <span class="pag cur">{CurrentPage} / {TotalPages}</span>
  754.     {block:NextPage}
  755.     <a class="pag next lnr lnr-arrow-right" href="{NextPage}"></a>
  756.     {/block:NextPage}
  757.     {/block:Pagination}
  758. </nav>
  759.  
  760. </body>
  761.  
  762. <script>
  763. $(document).ready(function() {
  764.     $("[title]").style_my_tooltips({
  765.         tip_follows_cursor:true,
  766.         tip_delay_time:200,
  767.         tip_fade_speed:200
  768.     });
  769.     $('iframe.tumblr_audio_player').load( function() {
  770.         $('iframe.tumblr_audio_player').contents().find("head")
  771.            .append($("<style type='text/css'> .audio-player { background:rgba({RGBAccentColor},.4) !important; width:calc({text:post width} - 6px) !important } .audio-player * { color:{TitleColor} !important } </style>"));
  772.     });
  773. });
  774. </script>
  775.  
  776. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement