API tools faq
paste
Laighlin

#26: Tourmaline

Laighlin
Aug 1st, 2018
1,654
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 21.82 KB | None | 0 0
raw download clone embed print report
  1. <!--
  2.  
  3. Tourmaline by @Laighlin
  4.  
  5.    1. leave the credit intact
  6.    2. don't redistribute or lift large chunks of code
  7.    3. send me a message if you need any help, with an example
  8.    of your problem if possible
  9.    4. check my faq on @linthm if you have questions about adding custom links!
  10.  
  11. Update [16/08/2018] Fixed a bug that was preventing Tumblr's lightbox from kicking in on photoset posts.
  12.  
  13. -->
  14.  
  15. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  16. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  17.  
  18. <meta name="image:Favicon" content=""/>
  19. <meta name="image:Background banner" content=""/>
  20.  
  21. <meta name="if:Custom favicon" content="0"/>
  22. <meta name="if:500px posts" content="1"/>
  23. <meta name="if:Centered banner" content="0"/>
  24. <meta name="if:Shadow effects" content="0"/>
  25.  
  26. <meta name="color:Blog title" content="#d4efec"/>
  27. <meta name="color:Background" content="#bbbbbb"/>
  28. <meta name="color:Banner background" content="#00aa99"/>
  29. <meta name="color:Gradient left" content="#15706b"/>
  30. <meta name="color:Gradient center" content="#578683"/>
  31. <meta name="color:Gradient right" content="#17a695"/>
  32. <meta name="color:Navigation text" content="#fff"/>
  33. <meta name="color:Post background" content="#fff"/>
  34. <meta name="color:Text highlight" content="#fff"/>
  35. <meta name="color:Text highlight bg" content="#333"/>
  36. <meta name="color:Text" content="#555"/>
  37. <meta name="color:Text accent" content="#42b1a0"/>
  38. <meta name="color:Link" content="#737879"/>
  39. <meta name="color:Link hover" content="#48a295"/>
  40. <meta name="color:Shadows" content="#2e3635"/>
  41.  
  42. <meta name="select:Corner rounding" title="Soft" content="10px"/>
  43. <meta name="select:Corner rounding" title="Subtle" content="5px"/>
  44. <meta name="select:Corner rounding" title="Sharp" content="0"/>
  45.  
  46. <meta name="select:Background size" title="Cover" content="no-repeat;background-size:cover"/>
  47. <meta name="select:Background size" title="Tiled" content="repeat"/>
  48.  
  49. <!-- text fields -->
  50. <meta name="text:Accent font" content="Roboto Slab"/>
  51. <meta name="text:Body font" content="Roboto"/>
  52. <meta name="text:Body font size" content="14px"/>
  53.  
  54.  
  55. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  56.  
  57. <head><title>{Title}{block:PostSummary} &bull; {PostSummary}{/block:PostSummary}{block:SearchPage} &bull; {lang:Search results for SearchQuery}{/block:SearchPage}</title>
  58.  
  59. {block:ifCustomFavicon}
  60. <link rel="shortcut icon" href="{image:favicon}"/>
  61. {/block:ifCustomFavicon}
  62. {block:ifNotCustomFavicon}
  63. <link rel="shortcut icon" href="{Favicon}"/>
  64. {/block:ifNotCustomFavicon}
  65.  
  66. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  67. {block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}
  68.  
  69. <!--Custom Google font import-->
  70. <link href="https://fonts.googleapis.com/css?family={text:Body font}:400,400i,700,700i|{text:Accent font}:400,400i,700,700i" rel="stylesheet">
  71.  
  72. <!--FontAwesome import-->
  73. <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.2.0/css/solid.css" integrity="sha384-wnAC7ln+XN0UKdcPvJvtqIH3jOjs9pnKnq9qX68ImXvOGz2JuFoEiCjT8jyZQX2z" crossorigin="anonymous">
  74. <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.2.0/css/regular.css" integrity="sha384-zkhEzh7td0PG30vxQk1D9liRKeizzot4eqkJ8gB3/I+mZ1rjgQk+BSt2F6rT2c+I" crossorigin="anonymous">
  75. <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.2.0/css/fontawesome.css" integrity="sha384-HbmWTHay9psM8qyzEKPc8odH4DsOuzdejtnr+OFtDmOcIVnhgReQ4GZBH7uwcjf6" crossorigin="anonymous">
  76.  
  77. <style type="text/css">
  78.  
  79. * { transition:.2s all ease-out; }
  80. .fas, #main-wrapper, #s-m-t-tooltip { transition:none; }
  81.  
  82. /*To do: improve and compact transition attributes, this is just lazy*/
  83.  
  84. body, html {
  85.     margin:0;
  86.     padding:0;
  87. }
  88.  
  89. body {
  90.     color:{color:text};
  91.     font-family:'{text:body font}',sans-serif;
  92.     font-size:{text:body font size};
  93.     background:{color:background};
  94.     word-wrap:break-word;
  95.     overflow-y:scroll;
  96.     overflow-x:hidden;
  97.     line-height:1.6em;
  98. }
  99.  
  100. .background:before {
  101.     content:'';
  102.     position:fixed;
  103.     {block:ifcenteredbanner}
  104.     height:40vh;
  105.     top:30vh;
  106.     {/block:ifcenteredbanner}
  107.     right:0;
  108.     left:0;
  109.     z-index:-1;
  110. }
  111.  
  112. {block:ifnotcenteredbanner}
  113. .p1.background:before {
  114.     height:230px;
  115.     top:0;
  116. }
  117.  
  118. .background:not(.p1):before {
  119.     height:55px;
  120.     top:0;
  121. }
  122. {/block:ifnotcenteredbanner}
  123.  
  124. ::selection {
  125.     background:rgba({RGBcolor:text highlight bg},.7);
  126.     color:{color:text highlight};
  127. }
  128.  
  129. ::moz-selection {
  130.     background:rgba({RGBcolor:text highlight bg},.7);
  131.     color:{color:text highlight};
  132. }
  133.  
  134. #s-m-t-tooltip {
  135.     margin:0 16px;
  136.     z-index:999999999;
  137.     padding:5px 7px;
  138.     border:2px solid rgba({RGBcolor:content borders},.5);
  139.     pointer-events:none;
  140.     white-space:pre;
  141.     font:italic .9em '{text:accent font}';
  142. }
  143.  
  144. .background:before {
  145.     background:{color:banner background} url('{image:background banner}') fixed {select:background size};
  146. }
  147.  
  148. a {
  149.     color:{color:link};
  150.     text-decoration:none;
  151. }
  152.  
  153. .post ol {
  154.     list-style-type:decimal-leading-zero;
  155.     padding-left:40px;
  156. }
  157.  
  158. .post ul {
  159.     list-style-type:none;
  160.     padding-left:35px;
  161. }
  162.  
  163. .post ul li { position:relative; }
  164. .post ul li:before {
  165.     font-family:'Font Awesome 5 Free';
  166.     font-weight:900;
  167.     content:'\F0DA';
  168.     color:{color:text accent};
  169.     position:absolute;
  170.     left:-1.2em;
  171.     top:0;
  172. }
  173.  
  174. code {
  175.     font-family:monospace;
  176.     border:1px solid {color:borders};
  177.     padding:5px;
  178.     display:inline-block;
  179. }
  180.  
  181. h1, h2 {
  182.     margin:0;
  183.     font-weight:inherit;
  184.     font-family:{text:accent font};
  185. }
  186.  
  187. #content i, #content em, #desc i, #desc em { color:{color:text accent}; }
  188. #desc b, #desc strong, #content b, #content strong { color:rgba({RGBcolor:text accent},.7); }
  189. #desc p { margin:.7em 0; }
  190.  
  191. p:first-child, blockquote:first-child { margin-top:0; }
  192. p:last-child, blockquote:last-child { margin-bottom:0; }
  193.  
  194. blockquote, blockquote blockquote {
  195.     margin:1em 0 1em 10px;
  196.     padding-left:10px;
  197.     border-left:1px solid rgba({RGBcolor:text accent},.6);
  198. }
  199.  
  200. #main-wrapper {
  201.     position:absolute;
  202.     min-height:100vh;
  203.     {block:if500pxposts}
  204.     width:500px;
  205.     left:calc(50vw - 355px);
  206.     {/block:if500pxposts}
  207.     {block:ifnot500pxposts}
  208.     width:700px;
  209.     left:calc(50vw - 455px);
  210.     {/block:ifnot500pxposts}
  211. }
  212.  
  213. @media screen and (max-width:801px) {
  214.     #main-wrapper {
  215.         margin-left:100px;
  216.     }
  217. }
  218.  
  219. #head-wrap, .post-wrap, #bomtom { background:{color:post background}; }
  220.  
  221. #head-wrap, .post-wrap, #bomtom, .linky, .more {
  222.     border-radius:{select:corner rounding};
  223. }
  224.  
  225. {block:ifShadowEffects}
  226. #head-wrap, .post-wrap, .linky, #bomtom, .pag {
  227.     box-shadow:1px 2px 5px rgba({RGBcolor:shadows},.5);
  228. }
  229. {/block:ifShadowEffects}
  230.  
  231. #head.p-1 {
  232.     margin-top:calc(30vh - 100px);
  233. }
  234.  
  235. #head.p-1 #title {
  236.     text-align:right;
  237.     font-weight:bold;
  238.     margin-bottom:15px;
  239.     color:{color:blog title};
  240. }
  241.  
  242. #head:not(.p-1) #title { display:none; }
  243.  
  244. #head-wrap {
  245.     position:relative;
  246.     margin-bottom:25px;
  247.     overflow:hidden;
  248. }
  249.  
  250. #user-icon {
  251.     float:left;
  252.     pointer-events:none;
  253. }
  254.  
  255. #head:not(.p-1) #user-icon { border-radius:0 0 0 10px; }
  256. #head:not(.p-1) #head-wrap { border-radius:0 0 10px 10px; }
  257.  
  258. #desc {
  259.     padding:15px;
  260.     height:98px;
  261.     overflow:hidden;
  262. }
  263.  
  264. #linx {
  265.     position:relative;
  266.     margin:-5px -5px 50px;
  267.     display:flex;
  268.     flex-flow:row wrap;
  269.     /*me? using flexbox to solve annoying but extremely minor issues that could be fixed in a dozen other ways? it's more likely than you think*/
  270. }
  271.  
  272. .linky {
  273.     display:inline-block;
  274.     font-size:.9em;
  275.     margin:5px;
  276.     padding:6px 9px;
  277.     color:{color:navigation text};
  278. }
  279.  
  280. .linky:hover, .pag:hover { background:{color:navigation text}!important; }
  281. .linky:active, .pag:active { box-shadow:none; }
  282.  
  283. .linky:nth-child(3n+1), .pag.prev { background:{color:gradient left}; }
  284. .linky:nth-child(3n+1):hover, .pag.prev:hover {
  285.     color:{color:gradient left};
  286. }
  287.  
  288. .linky:nth-child(3n+2) { background:{color:gradient center}; }
  289. .linky:nth-child(3n+2):hover {
  290.     color:{color:gradient center};
  291. }
  292.  
  293. .linky:nth-child(3n), .pag.next { background:{color:gradient right}; }
  294. .linky:nth-child(3n):hover, .pag.next:hover {
  295.     color:{color:gradient right};
  296. }
  297.  
  298. .post-wrap {
  299.     position:relative;
  300.     margin-bottom:70px;
  301.     overflow:hidden;
  302. }
  303.  
  304. /*.post-wrap:last-of-type {*/
  305. /*    margin-bottom:120px;*/
  306. /*}*/
  307.  
  308. .caption, .title, .info, .quote, .tag-wrap, #bomtom {
  309.     padding:15px;
  310. }
  311.  
  312. .title { font-size:1.3em; }
  313. .caption h1 { font-size:1.3em; }
  314. .caption h2 { font-size:1.1em; }
  315.  
  316. .title, .info, hr, .more {
  317.     background-image:linear-gradient(to right,
  318.     {color:gradient left} 5%,
  319.     {color:gradient center},
  320.     {color:gradient right} 95%);
  321.     color:{color:navigation text};
  322. }
  323.  
  324. .info, .linky, #bomtom, .more, .tag-wrap .lbl {
  325.     text-transform:uppercase;
  326. }
  327.  
  328. hr {
  329.     border:none;
  330.     margin:1em 20%;
  331.     height:3px;
  332.     border-radius:2px;
  333. }
  334.  
  335. #content {
  336.     /*display:none;*/
  337. }
  338.  
  339. {block:AskPage} .caption { padding:0; } {/block:AskPage}
  340. {block:SubmitPage} .caption { padding:0; } {/block:SubmitPage}
  341.  
  342. .caption:empty {
  343.     padding:0;
  344.     height:3px;
  345. }
  346. /*the fact that i didn't know this existed for over a year still fucks me up. like i had No Idea how to make text posts not look awful if they only had a title and no body. dicks out for the :empty selector*/
  347.  
  348. .caption a, #desc a, #bomtom a { border-bottom:1px solid rgba({RGBcolor:text},.5); }
  349. .caption a:hover, #desc a:hover, .tag:hover, #bomtom a:hover {
  350.     border-color:transparent;
  351.     color:{color:link hover};
  352. }
  353.  
  354. .chat {
  355.     padding:3px 15px;
  356.     font-family:monospace;
  357. }
  358. .chat:first-child { padding-top:10px; }
  359. .chat:last-child { padding-bottom:10px; }
  360. .chat.odd { background:rgba({RGBcolor:text},.18); }
  361. .chat.even { background:rgba({RGBcolor:text},.08); }
  362.  
  363. .chat b {
  364.     font-family:'{text:accent font}';
  365.     text-transform:uppercase;
  366. }
  367.  
  368. .quote {
  369.     border:none;
  370.     margin:0;
  371.     font:1.25em '{text:accent font}';
  372.     z-index:1;
  373.     position:relative;
  374. }
  375.  
  376. .quote-text { position:relative; z-index:1; }
  377. .quote .fa-quote-left, .a-url .fa-question {
  378.     color:rgba({RGBcolor:text accent},.5);
  379.     position:absolute;
  380.     font-size:2em;
  381.     z-index:0;
  382.     margin-top:-5px;
  383.     margin-left:-5px;
  384. }
  385.  
  386. .link-post .fa-caret-right, .more .fa-caret-right { transition:.2s margin ease-out; }
  387. .link-post:hover .fa-caret-right { margin-left:5px; }
  388.  
  389. .info a { color:{color:navigation text}; }
  390. .info a:hover, .link-post:hover, .more:hover { color:rgba({RGBcolor:navigation text},.7); }
  391. .info {
  392.     font-size:.9em;
  393.     line-height:.9em;
  394. }
  395.  
  396. .spacer {
  397.     height:50px;
  398.     pointer-events:none;
  399. }
  400.  
  401. .media-wrap { margin:0; }
  402. .media-wrap.no-text { line-height:0; }
  403.  
  404. {block:ifnot500pxposts}
  405. iframe.tumblr_audio_player { width:700px!important; }
  406. {/block:ifnot500pxposts}
  407.  
  408. .quest-wrap { padding:15px 15px 10px; }
  409. .a-url {
  410.     position:relative;
  411.     text-transform:uppercase;
  412.     font:1.1em '{text:accent font}';
  413. }
  414.  
  415. .asker:hover { color:{color:text accent}; }
  416. .askr {
  417.     position:relative;
  418.     padding-left:10px;
  419.     z-index:1;
  420.     letter-spacing:1px;
  421. }
  422.  
  423. .quest {
  424.     font-style:italic;
  425.     text-align:right;
  426. }
  427.  
  428. .more a { color:{color:navigation text}; }
  429. .more {
  430.     letter-spacing:1px;
  431.     text-align:center;
  432.     font:.9em '{text:accent font}';
  433.     padding:6px 8px;
  434.     line-height:1em;
  435. }
  436.  
  437. .controls .fa-retweet, .controls .fa-heart {
  438.     transition:.2s all ease-out;
  439. }
  440.  
  441. .more:hover .fas.fa-caret-right {
  442.     margin-left:4px;
  443. }
  444.  
  445. /*Tags*/
  446.  
  447. .tag-wrap { font-size:.95em; padding:10px 15px; }
  448. .tag-wrap .lbl {
  449.     letter-spacing:1px;
  450.     font-family:{text:accent font};
  451.     color:{color:text accent};
  452. }
  453.  
  454. .tag { margin-right:7px; }
  455. .hash:nth-of-type(3n+1) { color:{color:gradient left}; }
  456. .hash:nth-of-type(3n+2) { color:{color:gradient center}; }
  457. .hash:nth-of-type(3n) { color:{color:gradient right}; }
  458.  
  459. /*Like and reblog buttons*/
  460.  
  461. .controls {
  462.     font-size:16px;
  463.     line-height:16px;
  464.     text-align:center;
  465.     color:{color:navigation text};
  466. }
  467.  
  468. .controls {
  469.     float:right;
  470. }
  471.  
  472. .controls a {
  473.     color:{color:navigation text};
  474. }
  475.  
  476. .fa-retweet {
  477.     margin-right:2px;
  478. }
  479.  
  480. .like-wrap {
  481.     position:relative;
  482.     width:30px;
  483.     height:30px;
  484. }
  485.  
  486. .like_button {
  487.     position:absolute;
  488.     z-index:5;
  489.     top:0;
  490.     left:0;
  491.     opacity:0.0001;
  492.     width:16px;
  493.     height:16px;
  494. }
  495.  
  496. .like_button iframe {
  497.     width:100% !important;
  498.     height:100% !important;
  499. }
  500.  
  501. .like-btn { z-index:1; }
  502.  
  503. .like_button.liked + .like-btn { color:#f55; }
  504.  
  505. /*Post notes*/
  506.  
  507. #notes {
  508.     padding:0;
  509.     font-size:.9em;
  510. }
  511.  
  512. ol.notes {
  513.     list-style-type:none;
  514.     margin:0;
  515.     padding-left:30px;
  516. }
  517.  
  518. ol.notes li.note {
  519.     position:relative;
  520.     margin:5px 0;
  521. }
  522.  
  523. li.note:before {
  524.     position:absolute;
  525.     left:-25px;
  526.     font-family:'Font Awesome 5 Free';
  527.     color:{color:text accent};
  528.     font-size:1em;
  529.     top:2px;
  530. }
  531.  
  532. a.avatar_frame { display:none !important; }
  533.  
  534. li.note.reblog.without_commentary:before { content:'\f079'; font-weight:900; }
  535. li.note.like:before { content:'\f004'; }
  536. li.note.reblog.with_commentary:before, li.note.reply:before { content:'\f075'; }
  537. li.note.original_post { content:'\f304'; }
  538.  
  539. /*Pagination*/
  540.  
  541. #pagination {
  542.     position:fixed;
  543.     font-size:1.6em;
  544.     bottom:0;
  545.     right:15px;
  546. }
  547.  
  548. .pag {
  549.     line-height:1em;
  550.     transition:.2s all ease;
  551.     color:{color:navigation text};
  552.     border-radius:calc(.5em + 10px);
  553.     text-align:center;
  554.     display:block;
  555.     margin-bottom:15px;
  556. }
  557.  
  558. .prev { padding:10px 12px 10px 8px; }
  559. .next { padding:10px 8px 10px 12px; }
  560.  
  561. .prev, .next {
  562.     height:1em;
  563.     width:1em;
  564. }
  565.  
  566. /*Footer*/
  567.  
  568. #bomtom {
  569.     font-size:.9em;
  570.     letter-spacing:1px;
  571.     text-align:center;
  572.     border-bottom-left-radius:0;
  573.     border-bottom-right-radius:0;
  574.     width:calc(100% - 30px);
  575.     position:absolute;
  576.     bottom:0;
  577. }
  578.  
  579. {CustomCSS}
  580.  
  581. </style>
  582. </head>
  583.  
  584. <body class="background {block:HomePage}p{CurrentPage}{/block:HomePage}">
  585.  
  586. <div id="main-wrapper">
  587.  
  588. <header id="head" {block:HomePage}class="p-{CurrentPage}"{/block:HomePage}>
  589.     <a href="/"><h1 id="title">{Title}</h1></a>
  590.     {block:Description}<div id="head-wrap">
  591.         <img id="user-icon" src="{PortraitURL-128}">
  592.         <aside id="desc">{Description}</aside>
  593.     </div>
  594.     {/block:Description}
  595.     <nav id="linx">
  596.         <a class="linky" href="/"><span class="fas fa-home" aria-hidden="true"></span> Home</a>
  597.         {block:AskEnabled}
  598.         <a class="linky" href="/ask"><span class="fas fa-pen" aria-hidden="true"></span> Ask</a>
  599.         {/block:AskEnabled}
  600.         {block:SubmissionsEnabled}
  601.         <a class="linky" href="/submit"><span class="fas fa-envelope" aria-hidden="true"></span> Submit</a>
  602.         {/block:SubmissionsEnabled}
  603.         <a class="linky" href="/archive"><span class="fas fa-clock" aria-hidden="true"></span> Archive</a>
  604.         {block:HasPages}
  605.         {block:Pages}
  606.         <a class="linky" href="{URL}"><span class="fas fa-link"></span> {Label}</a>
  607.         {/block:Pages}
  608.         {/block:HasPages}
  609.     </nav>
  610. </header>
  611.  
  612. <main id="content">
  613.     {block:SearchPage}
  614.     <div class="post-wrap">
  615.     <h2 class="title">
  616.         {block:SearchResults}
  617.             {lang:SearchResultCount results for SearchQuery 2}
  618.         {/block:SearchResults}
  619.         {block:NoSearchResults}
  620.             {lang:No search results for SearchQuery 2}
  621.         {/block:NoSearchResults}
  622.     </h2>
  623.     </div>
  624.     {/block:SearchPage}
  625.     {block:TagPage}
  626.     <div class="post-wrap">
  627.     <h2 class="title">
  628.         {lang:Posts tagged Tag 3}
  629.     </h2>
  630.     </div>
  631.     {/block:TagPage}
  632.     {block:Posts inlineMediaWidth="470" nestedMediaWidth="450"}
  633.     <div class="post-wrap">
  634.     <article class="post {block:Date}not-page{/block:Date}">
  635.         {block:Title}
  636.         <h2 class="title">{Title}</h2>
  637.         {/block:Title}
  638.        
  639.         {block:Text}
  640.         <div class="text-body caption">{Body}</div>
  641.         {/block:Text}
  642.        
  643.         {block:Answer}
  644.         <div class="quest-wrap">
  645.         <div class="a-url"><div class="fas fa-question" aria-hidden="true"></div><span class="askr">{Asker}</span> <span class="fas fa-caret-right"></span></div>
  646.             <div class="quest">&ldquo;{Question}&rdquo;</div>
  647.         </div>
  648.         <div class="caption">{Answer}</div>
  649.         {/block:Answer}
  650.        
  651.         {block:Chat}
  652.         {block:Lines}
  653.         <div class="chat {Alt}">{block:Label}<b>{Label} </b>{/block:Label}{Line}</div>
  654.         {/block:Lines}
  655.         {/block:Chat}
  656.        
  657.         {block:Link}
  658.         <a href="{URL}">
  659.         <h2 class="title link-post">
  660.             <span class="fas fa-link"></span>&nbsp;{Name}&nbsp;&nbsp;<span class="fas fa-caret-right" aria-hidden="true"></span>
  661.         </h2></a>
  662.         <div class="caption">
  663.             {block:Excerpt}<blockquote>{Excerpt}</blockquote>{/block:Excerpt}
  664.             {block:Description}{Description}{/block:Description}
  665.         </div>
  666.         {/block:Link}
  667.        
  668.         {block:Quote}
  669.         <blockquote class="quote"><div class="fas fa-quote-left" aria-hidden="true"></div><div class="quote-text">{Quote}</div></blockquote>
  670.         {block:Source}<div class="caption" style="text-align:right">&mdash; {Source}</div>{/block:Source}
  671.         {/block:Quote}
  672.        
  673.         {block:Photo}
  674.         <figure class="media-wrap no-text">
  675.             {LinkOpenTag}<img src="{PhotoURL-500}" width="100%">{LinkCloseTag}
  676.         </figure>
  677.         {block:Caption}
  678.         <div class="caption">{Caption}</div>
  679.         {/block:Caption}
  680.         {/block:Photo}
  681.        
  682.         {block:Photoset}
  683.         <figure class="media-wrap no-text">
  684.         {block:if500pxposts}
  685.             {Photoset-500}
  686.         {/block:if500pxposts}
  687.         {block:ifnot500pxposts}
  688.             {Photoset-700}
  689.         {/block:ifnot500pxposts}
  690.         </figure>
  691.         {block:Caption}
  692.         <div class="caption">{Caption}</div>
  693.         {/block:Caption}
  694.         {/block:Photoset}
  695.        
  696.         {block:Audio}
  697.         <figure class="media-wrap no-text">
  698.             {AudioEmbed}
  699.         </figure>
  700.         {block:Caption}
  701.         <div class="caption">{Caption}</div>
  702.         {/block:Caption}
  703.         {/block:Audio}
  704.        
  705.         {block:Video}
  706.         <figure class="media-wrap no-text">
  707.         {block:if500pxposts}
  708.             {Video-500}
  709.         {/block:if500pxposts}
  710.         {block:ifnot500pxposts}
  711.             {Video-700}
  712.         {/block:ifnot500pxposts}
  713.         </figure>
  714.         {block:Caption}
  715.         <div class="caption">{Caption}</div>
  716.         {/block:Caption}
  717.         {/block:Video}
  718.        
  719.         {block:More}
  720.         <div style="text-align:center; margin:10px auto">
  721.             <a class="more" href="{Permalink}">{lang:Keep reading} <span class="fas fa-caret-right" aria-hidden="true"></span></a>
  722.         </div>
  723.         {/block:More}
  724.        
  725.         {block:HasTags}
  726.         <footer class="tag-wrap">
  727.         <span class="lbl">Tagged&nbsp;<span class="fas fa-caret-right" aria-hidden="true"></span></span>
  728.             {block:Tags}<span class="hash">#</span><a class="tag" href="{TagURL}">{Tag}</a>{/block:Tags}
  729.         </footer>
  730.         {/block:HasTags}
  731.        
  732.     </article>
  733.    
  734.     {block:Date}
  735.     <footer class="info">
  736.         <span class="fas fa-calendar" aria-label="posted on"></span>&nbsp;<a href="{Permalink}" title="{TimeAgo}">{DayofMonth}.{MonthNumber}.{Year}</a>&nbsp;
  737.         {block:NoteCount}
  738.         <span class="fas fa-bookmark" aria-hidden="true"></span>&nbsp;<a href="{Permalink}#notes">{NoteCountWithLabel}</a>&nbsp;
  739.         {/block:NoteCount}
  740.         {block:RebloggedFrom}
  741.         {block:ifnot500pxposts}
  742.         <span class="fas fa-reply" aria-label="reblogged from"></span>&nbsp;<a href="{ReblogParentURL}">{ReblogParentName}</a>&nbsp;
  743.         <span class="src" {block:ContentSource}style="display:none;"{/block:ContentSource}><span class="fas fa-reply-all" aria-label="originally posted by"></span>&nbsp;<a href="{ReblogRootURL}">{ReblogRootName}</a></span>
  744.         {/block:ifnot500pxposts}
  745.         {block:if500pxposts}
  746.         <span class="fas fa-reply" aria-hidden="true"></span>&nbsp;<a href="{ReblogParentURL}" title="{ReblogParentName}">Via</a>&nbsp;
  747.         <span class="src" {block:ContentSource}style="display:none;"{/block:ContentSource}><span class="fas fa-reply-all" aria-hidden="true"></span>&nbsp;<a href="{ReblogRootURL}" title="{ReblogRootName}">OP</a></span>
  748.         {/block:if500pxposts}
  749.         {/block:RebloggedFrom}
  750.         {block:ContentSource}
  751.         <span class="fas fa-reply-all" aria-label="source"></span>&nbsp;<a href="{SourceURL}">Source</a>
  752.         {/block:ContentSource}
  753.        
  754.         <div class="controls">
  755.             <a href="{ReblogURL}" class="fas fa-retweet"></a>
  756.             <span class="like-wrap">{LikeButton}<a class="like-btn fas fa-heart"></a></span>
  757.         </div>
  758.     </footer>
  759.     {/block:Date}
  760.     </div>
  761.    
  762.     {block:PostNotes}
  763.     <footer id="notes" class="post-wrap" name="notes">
  764.         <h2 class="title">Notes</h2>
  765.         <div class="caption">{PostNotes}</div>
  766.     </footer>
  767.     {/block:PostNotes}
  768.     {/block:Posts}
  769.    
  770.     <div class="spacer"></div>
  771. </main>
  772.  
  773. <footer id="bomtom">
  774.     &copy; {CopyrightYears} <b>{Name}</b> &bull; Theme by <a href="http://linthm.tumblr.com/thm"><b>Laighlin</b></a>
  775. </footer>
  776.  
  777. </div>
  778.  
  779. {block:Pagination}
  780. <nav id="pagination">
  781.     {block:PreviousPage}
  782.     <a class="pag prev fas fa-caret-left" title="Previous" aria-label="Previous page" href="{PreviousPage}"></a>
  783.     {/block:PreviousPage}
  784.     {block:NextPage}
  785.     <a class="pag next fas fa-caret-right" title="Next" aria-label="Next page" href="{NextPage}"></a>
  786.     {/block:NextPage}
  787. </nav>
  788. {/block:Pagination}
  789.  
  790. </body>
  791. </html>
Add Comment
Please, Sign In to add comment
Public Pastes
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!