API tools faq
paste
Laighlin

#30: Papercrush

Laighlin
Aug 17th, 2020 (edited)
154
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 22.54 KB | None | 0 0
raw download clone embed print report
  1. <!--
  2.  
  3. [THEME 30] Papercrush by @Laighlin
  4.  
  5. Message me at linthm.tumblr with any questions or comments! :>
  6.  
  7. -->
  8.  
  9. <!DOCTYPE html>
  10. <html xmlns="https://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  11. <head>
  12. <!--start of head-->
  13.  
  14. <title>{Title}{block:PostSummary} &mdash; {PostSummary}{/block:PostSummary}</title>
  15. {block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}
  16. <link rel="shortcut icon" href="{Favicon}">
  17. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  18.  
  19. <script src="https://static.tumblr.com/xwoxjom/p4bqfbatk/fontawesome.js" crossorigin="anonymous"></script>
  20.  
  21. <meta name="viewport" content="width=device-width, initial-scale=1.0">
  22.  
  23. <!-- blog options start here -->
  24.  
  25. <meta name="select:Post width" content="700" title="700px"/>
  26. <meta name="select:Post width" content="500" title="500px"/>
  27.  
  28. <meta name="color:Background" content="#b1e2d8"/>
  29. <meta name="color:Text" content="#3a3a3a"/>
  30. <meta name="color:Highlight" content="#c8f6ed"/>
  31. <meta name="color:Shadow" content="#6db4ad"/>
  32. <meta name="color:Links" content="#526e6b"/>
  33. <meta name="color:Accent" content="#2e8077"/>
  34.  
  35. <meta name="font:Body" content="Gibson"/>
  36.  
  37. <meta name="text:Font size" content="16"/>
  38. <meta name="text:Title font" content="Handlee"/>
  39. <meta name="text:Body font" content="Inconsolata"/>
  40.  
  41. <meta name="if:Sticky navigation" content="1"/>
  42. <meta name="if:Google fonts" content="0"/>
  43. <meta name="if:Grid background" content="1"/>
  44. <meta name="if:Cutout title" content="1"/>
  45. <meta name="if:Flatten everything" content="0"/>
  46.  
  47. <style type="text/css">
  48. /* start of CSS styling */
  49.  
  50. :root {
  51.     --text-reg:{text:font size}px;
  52.     --text-small:calc({text:font size} - 4)px;
  53. }
  54.  
  55. body {
  56.     margin:0;
  57.     {block:ifNotGoogleFonts}
  58.     font:var(--text-reg) {font:Body};
  59.     {/block:ifNotGoogleFonts}
  60.     color:{color:text};
  61.     background:{color:Background};
  62. }
  63.  
  64. body:before {
  65.     content:'';
  66.     position:fixed;
  67.     top:0;
  68.     left:0;
  69.     bottom:0;
  70.     right:0;
  71.     opacity:.3;
  72.     {block:ifGridBackground}
  73.     background:{color:background} url('https://64.media.tumblr.com/47c11461747f33ae414095d2591b4c17/d3ea8fd4657f898c-d0/s2048x3072/a0033e739d5f0a8b24c2f254c996ce0b73cc9002.png') repeat;
  74.     background-blend-mode:multiply;
  75.     {/block:ifGridBackground}
  76. }
  77.  
  78. ::selection {
  79.     background:{color:shadow};
  80.     color:{color:highlight};
  81. }
  82.  
  83. p { margin:.7em 0; }
  84. p:first-child, .quest p { margin-top:0; }
  85. p:last-child, { margin-bottom:0; }
  86.  
  87. a, .info-btn, .nav-link, .pagi-link {
  88.     text-decoration:none;
  89.     transition:.15s color ease, .15s border ease;
  90.     color:{color:links};
  91. }
  92.  
  93. a:hover, a:focus { color:{color:text}; }
  94.  
  95. h1, h2, h3, h4, h5, .post-title {
  96.     font-weight:{TitleFontWeight};
  97.     margin:.2em 0;
  98. }
  99.  
  100. h1, h2, h3, h4, h5,
  101. .nav-link, .pagi-link,
  102. .reblog-info, .details {
  103.     text-transform:uppercase;
  104. }
  105.  
  106. h1, h2, h3, h4, h5, .quote, .post-title {
  107.     {block:ifNotGoogleFonts}
  108.     font-family:{TitleFont};
  109.     {/block:ifNotGoogleFonts}
  110. }
  111.  
  112. h1.post-title {
  113.     font-size:2em;
  114. }
  115.  
  116. hr {
  117.     border:none;
  118.     height:0;
  119.     border-top:1px solid rgba({RGBcolor:accent},.7);
  120. }
  121.  
  122. .caption hr {
  123.     width:4em;
  124.     margin:1em auto;
  125. }
  126.  
  127. #everything-wrapper {
  128.     overflow:hidden;
  129.     position:relative;
  130. }
  131.  
  132. #column {
  133.     position:relative;
  134.     box-shadow:-6px -6px 12px {color:highlight},
  135.                6px 6px 12px {color:shadow};
  136.     padding:30px;
  137.     border-radius:0 0 10px 10px;
  138.     background-color:{color:background};
  139.     background-image:linear-gradient(145deg,
  140.         rgba({RGBcolor:highlight},.2),
  141.         rgba({RGBcolor:shadow},.2));
  142. }
  143.  
  144. #column.width-500 { max-width:500px; }
  145. #column.width-700 { max-width:700px; }
  146.  
  147. #blog-title {
  148.     margin:16px 0 0;
  149.     font-size:2.5em;
  150.     line-height:1.1em;
  151.     text-align:center;
  152.     {block:ifCutoutTitle}
  153.     -webkit-text-fill-color:transparent;
  154.     -moz-text-fill-color:transparent;
  155.     text-fill-color:transparent;
  156.     background-color:{color:shadow};
  157.     text-shadow:2px 2px 3px rgba({RGBcolor:highlight},.7);
  158.     -webkit-background-clip:text;
  159.     -moz-background-clip:text;
  160.     background-clip:text;
  161.     {/block:ifCutoutTitle}
  162.     {block:ifNotCutoutTitle}
  163.     color:{color:accent};
  164.     {/block:ifNotCutoutTitle}
  165. }
  166.  
  167. {block:HomePage}
  168. #blog-title.p-1 { font-size:3.5em; }
  169. {/block:HomePage}
  170.  
  171. blockquote, blockquote blockquote {
  172.     border-left:1px solid {color:accent};
  173.     padding-left:8px;
  174.     margin-left:16px;
  175.     margin-right:0;
  176. }
  177.  
  178. #description {
  179.     margin:1em 0;
  180.     font-size:.9em;
  181.     line-height:1.3em;
  182. }
  183.  
  184. #description, #navigation, #pagination {
  185.     text-align:center;
  186.     position:relative;
  187. }
  188.  
  189. #description, .caption, .quest { line-height:1.5em; }
  190. .quest p { text-align:right; }
  191. #description a, .caption a {
  192.     border-bottom:1px solid rgba({RGBcolor:text},.5);
  193. }
  194.  
  195. #description a:hover, .caption a:hover, .quest a:hover, #cred.streamlined a:hover {
  196.     border-bottom:2px solid {color:accent};
  197. }
  198.  
  199. #content {
  200.     margin-top:4em;
  201. }
  202.  
  203. .post-wrapper, .post { position:relative; }
  204. .post-wrapper { margin:32px 0; }
  205.  
  206. .post {
  207.     padding:24px;
  208.     border-radius:10px;
  209.     background-image:linear-gradient(145deg,
  210.         rgba({RGBcolor:shadow},.2),
  211.         rgba({RGBcolor:highlight},.2));
  212.     box-shadow:-2px -2px 4px {color:highlight} inset,
  213.                2px 2px 4px {color:shadow} inset;
  214.     min-height:54px;
  215. }
  216.  
  217. .post.is-post { margin-left:12px; margin-right:12px; }
  218. .post-wrapper.nudge { margin-top:48px; }
  219.  
  220. .post ol { list-style-type:decimal-leading-zero; }
  221. .post ul { list-style-type:square; }
  222.  
  223. .post i.fa, .post i.far, .reblog-info i.fa, #cred .fa { color:rgba({RGBcolor:text},.7); }
  224.  
  225. a.user, .user a, a.answerer, .quest a, .link-host {
  226.     font-weight:bold;
  227.     border:none;
  228. }
  229.  
  230. a.user, a.answerer, .quest a { margin-left:.1em; }
  231.  
  232. .chat { font-family:monospace; margin:0; }
  233. .chat b { color:{color:accent}; }
  234.  
  235. .link-host { color:{color:link}; }
  236.  
  237. .excerpt {
  238.     margin:.5em 0 1em;
  239.     font-size:.9em;
  240.     padding:0;
  241.     border:none;
  242.     font-style:italic;
  243. }
  244.  
  245. .media-wrap {
  246.     line-height:0;
  247.     width:100%;
  248. }
  249.  
  250. .media-wrap * {
  251.     width:100%;
  252. }
  253.  
  254. .type-Audio .media-wrap { height:85px; }
  255.  
  256. .tmblr-full * {
  257.     width:100%;
  258.     height:auto;
  259. }
  260.  
  261. .quote.post-title {
  262.     font-size:1.3em;
  263.     text-indent:.5em;
  264.     margin:0 0 1em 0;
  265.     font-weight:normal;
  266.     border:none;
  267. }
  268.  
  269. .quote .fa-quote-left {
  270.     position:absolute;
  271.     opacity:.3;
  272.     font-size:1.5em;
  273.     left:8px;
  274.     top:16px;
  275. }
  276.  
  277. .quote-source { text-align:right; margin-bottom:1em; }
  278.  
  279. .media-post.caption {
  280.     margin-top:1em;
  281. }
  282.  
  283. .post-title {
  284.     color:{color:accent};
  285.     font-size:2em;
  286.     margin-top:0;
  287.     margin-bottom:.5em;
  288. }
  289.  
  290. .post-title i.fa { color:inherit; }
  291.  
  292. /*Like and reblog buttons*/
  293.  
  294. .like-wrap {
  295.     position:relative;
  296.     width:2em;
  297.     height:2em;
  298.     cursor:pointer;
  299. }
  300.  
  301. .like_button {
  302.     position:absolute;
  303.     z-index:6;
  304.     top:-8px;
  305.     left:10px;
  306.     opacity:0.0001;
  307.     width:32px;
  308.     height:32px;
  309. }
  310.  
  311. .like_button iframe {
  312.     width:100% !important;
  313.     height:100% !important;
  314. }
  315.  
  316. .like-btn { z-index:1; }
  317.  
  318. .like-btn:before { font-weight:400; }
  319. .like_button.liked + .like-btn:before { font-weight:bold; }
  320. .like_button.liked + .like-btn { color:{color:accent}; }
  321.  
  322. /*Nav buttons and misc*/
  323.  
  324. #navigation {
  325.     margin-top:2em;
  326. }
  327.  
  328. #navigation.sticky {
  329.     margin-top:0;
  330.     padding:8px;
  331.     position:fixed;
  332.     text-align:left;
  333.     z-index:6;
  334.     left:0;
  335.     right:0;
  336.     top:0;
  337.     background-color:{color:background};
  338.     background-image:linear-gradient(145deg,
  339.         rgba({RGBcolor:shadow},.2),
  340.         rgba({RGBcolor:highlight},.2));
  341.     box-shadow:0 8px 16px {color:shadow};
  342. }
  343.  
  344. #navigation:not(.sticky) .quick-jump { display:none; }
  345.  
  346. .post-info { line-height:1.5em; }
  347. .details { font-size:.9em; }
  348. .note-count { float:right; }
  349.  
  350. #pagination { margin-bottom:1em; }
  351.  
  352. .nav-link, .pagi-link, .info-btn {
  353.     margin:4px;
  354. }
  355.  
  356. .nav-link, .pagi-link, #cred.button {
  357.     padding:12px;
  358. }
  359.  
  360. .nav-link, .info-btn, .pagi-link, #cred.button {
  361.     position:relative;
  362.     display:inline-block;
  363.     box-shadow:-2px -2px 4px {color:highlight},
  364.                2px 2px 4px {color:shadow};
  365.     background-color:{color:background};
  366.     background-image:linear-gradient(145deg,
  367.         rgba({RGBcolor:highlight},.4),
  368.         rgba({RGBcolor:shadow},.4));
  369.     border-radius:10px;
  370.     font-weight:bold;
  371.     line-height:1em;
  372.     z-index:5;
  373. }
  374.  
  375. .pagi-link { min-width:1em; }
  376.  
  377. #cred.button {
  378.     position:fixed;
  379.     bottom:12px;
  380.     right:12px;
  381. }
  382.  
  383. .reblog-info {
  384.     margin-bottom:8px;
  385.     margin-right:12px;
  386.     text-align:right;
  387. }
  388.  
  389. .extra-info, .post-controls {
  390.     width:40px;
  391.     position:absolute;
  392. }
  393.  
  394. .extra-info {
  395.     left:-56px;
  396.     top:-4px;
  397. }
  398.  
  399. .post-controls {
  400.     bottom:-4px;
  401.     right:-56px;
  402. }
  403.  
  404. #cred {
  405.     text-transform:uppercase;
  406.     font-size:calc(var(--text-reg) - 3px);
  407.     text-align:center;
  408. }
  409.  
  410. .extra-info.nudge { top:calc(var(--text-reg) + 6px); }
  411.  
  412. .extra-info .info-btn { margin-bottom:8px; }
  413. .reblog-btn { margin-bottom:8px; }
  414.  
  415. .info-btn {
  416.     font-size:16px;
  417.     padding:14px 12px;
  418. }
  419.  
  420. {block:ifNotFlattenEverything}
  421. .nav-link:active, .nav-link:focus,
  422. .info-btn:active, .info-btn:focus,
  423. .pagi-link:active, .pagi-link:focus, .pagi-link.active,
  424. #cred.button:active, #cred.button:focus {
  425.     background-image:linear-gradient(145deg,
  426.         rgba({RGBcolor:shadow},.6),
  427.         rgba({RGBcolor:highlight},.6));
  428.         box-shadow:none;
  429. }
  430. {/block:ifNotFlattenEverything}
  431.  
  432. .pinned .timestamp, .hidden { display:none; }
  433.  
  434. /*Post notes*/
  435. .post ol.notes {
  436.     list-style-type:none;
  437.     padding:0;
  438.     text-transform:uppercase;
  439. }
  440.  
  441. .notes li {
  442.     margin:0 0 .5em 2em;
  443.     position:relative;
  444. }
  445.  
  446. .note .avatar_frame { display:none; }
  447. .note:before {
  448.     text-align:center;
  449.     position:absolute;
  450.     left:-1.5em;
  451.     width:1em;
  452.     color:rgba({RGBcolor:text},.7);
  453.     opacity:.7;
  454.     font-family:'Font Awesome 5 Free';
  455.     font-weight:900;
  456. }
  457.  
  458. .note.reblog.without_commentary:before {
  459.     content:'\f079';
  460. }
  461.  
  462. .note.reblog.with_commentary:before, .note.reply:before {
  463.     content:'\f27a';
  464.     font-weight:400;
  465. }
  466.  
  467. .note.like:before {
  468.     content:'\f004';
  469.     font-weight:400;
  470. }
  471.  
  472. /*media rules*/
  473. @media screen and (max-width:619px) {
  474.     #column { margin:0 48px 32px; }
  475.     #cred.streamlined { display:block; }
  476.     #cred.button { display:none; }
  477. }
  478.  
  479. @media screen and (min-width:620px) and (max-width:819px) {
  480.     #column.width-500 { margin:0 auto 48px; }
  481.     #column.width-700 { margin:0 48px 32px; }
  482.     #cred.streamlined { display:block; }
  483.     #cred.button { display:none; }
  484. }
  485.  
  486. @media screen and (min-width:820px) {
  487.     #column { margin:0 auto 48px; }
  488.     #cred.streamlined { display:none; }
  489.     #cred.button { display:block; }
  490. }
  491.  
  492. {block:ifFlattenEverything}
  493.  
  494. #column, .post, .nav-link, .info-btn, .pagi-link, #navigation.sticky, #cred.button {
  495.     box-shadow:none;
  496.     background-image:none;
  497.     border:2px solid rgba({RGBcolor:shadow},.8);
  498. }
  499.  
  500. #navigation.sticky {
  501.     border-width:0 0 2px 0;
  502. }
  503.  
  504. #column { border-top:none; }
  505.  
  506. .post-controls { bottom:-6px; }
  507.  
  508. {/block:ifFlattenEverything}
  509.  
  510. .footer-spacer:not(.show) { display:none; }
  511.  
  512. {CustomCss}
  513.  
  514. </style>
  515. <!-- end of CSS -->
  516. </head>
  517.  
  518. <body>
  519.  
  520. <div id="everything-wrapper">
  521. <!-- container to keep everything together -->
  522. <div id="column" class="width-{select:Post width}">
  523.  
  524. <header id="head">
  525. {block:ShowTitle}<h1 class="title p-{CurrentPage}" id="blog-title">{Title}</h1>{/block:ShowTitle} <!-- title-->
  526.  
  527. {block:ShowDescription}<aside id="description">{Description}</aside>{/block:ShowDescription} <!-- description -->
  528.  
  529. <!-- topbar -->
  530. <nav id="navigation" class="scrolling">
  531.     <a class="nav-link" href="/">{lang:Home}</a>
  532.     {block:AskEnabled}<a class="nav-link" href="/ask">{lang:Mail}</a>{/block:AskEnabled}
  533.     <!-- only renders if asks are enabled -->
  534.     {block:SubmissionsEnabled}<a class="nav-link" href="/submit">Submit</a>{/block:SubmissionsEnabled}
  535.     <!-- only renders if submissions are enabled -->
  536.     {block:HasPages}
  537.     <!-- only renders if the blog has custom links enabled. CHECK THE FAQ -->
  538.     {block:Pages}
  539.     <a class="nav-link" href="{URL}">{Label}</a>
  540.     {/block:Pages}
  541.     {/block:HasPages}
  542.     {block:Pagination}
  543.     <span class="quick-jump">
  544.         {block:PreviousPage}
  545.         <a class="pagi-link fa fa-fw fa-chevron-left" href="{PreviousPage}" title="{lang:Previous}"></a>
  546.         {/block:PreviousPage}
  547.         {block:NextPage}
  548.         <a class="pagi-link fa fa-fw fa-chevron-right" href="{NextPage}" title="{lang:Next}"></a>
  549.         {/block:NextPage}
  550.     </span>
  551.     {/block:Pagination}
  552. </nav>
  553. </header>
  554.  
  555. <main id="content"> <!-- start of posts block -->
  556. {block:Posts}
  557.  
  558. <!-- for pinned posts -->
  559. <div class="post-wrapper {block:NotReblog}nudge{/block:NotReblog} {block:PinnedPostLabel}pinned{/block:PinnedPostLabel}">
  560.  
  561. {block:Date}
  562. <header class="extra-info {block:RebloggedFrom}nudge{/block:RebloggedFrom}">
  563.     <!-- icon showing post type -->
  564.     <a class="post-icon info-btn fa fa-calendar fa-fw timestamp" href="{Permalink}" aria-label="{lang:Posted on DayOfWeek DayOfMonth Month Year}" title="{lang:Posted on DayOfWeek DayOfMonth Month Year}"></a>
  565.     {block:PinnedPostLabel}
  566.     <a class="post-icon info-btn fa fa-thumbtack fa-fw" aria-label="{PinnedPostLabel}" title="{PinnedPostLabel}" href="{Permalink}"></a>
  567.     {/block:PinnedPostLabel}
  568.     <a class="post-icon info-btn fa fa-fw
  569.        {block:Text}fa-align-left{/block:Text}
  570.        {block:Photo}fa-image{/block:Photo}
  571.        {block:Photoset}fa-images{/block:Photoset}
  572.        {block:Video}fa-video{/block:Video}
  573.        {block:Audio}fa-music{/block:Audio}
  574.        {block:Chat}fa-comments{/block:Chat}
  575.        {block:Answer}fa-question{/block:Answer}
  576.        {block:Link}fa-link{/block:Link}
  577.        {block:Quote}fa-quote-left{/block:Quote}
  578.        " aria-label="{PostTypeNoun}" {block:Text}title="See all text posts"{/block:Text} title="See all {PostType}s"
  579.        {block:Answer}href="/archive/filter-by/ask"{/block:Answer}
  580.        href="/archive/filter-by/{PostType}"></a>
  581. </header>
  582. {/block:Date}
  583.  
  584. <!-- reblog info -->
  585. {block:RebloggedFrom}
  586. <header class="reblog-info">
  587.     <i class="fa fa-retweet" aria-label="reblogged from"></i> <a href="{ReblogParentURL}">{ReblogParentName}</a>
  588. </header>
  589. {/block:RebloggedFrom}
  590.  
  591. <article class="post type-{PostTypeNoun} {block:Date}is-post{/block:Date}">
  592.  
  593.     {block:Title}<h2 class="post-title">{Title}</h2>{/block:Title}
  594.     <!-- if not enclosed in those blocks, the title variable will display the title of the blog instead of the post title -->
  595.     {block:Text}
  596.     <!-- the body of a text post is not considered a caption, so it needs its own separate block -->
  597.     {block:NotReblog}<div class="caption single">{Body}</div>{/block:NotReblog}
  598.     <!-- renders on original posts only -->
  599.     {block:RebloggedFrom}
  600.     <div class="caption">
  601.         {block:Reblogs}
  602.         <!-- renders for reblogs only -->
  603.         <div class="reblogged-comment">
  604.             <i class="fa fa-user"></i>
  605.             <a class="user {block:IsDeactivated}inactive{/block:isDeactivated}" href="{Permalink}">{Username}</a>
  606.             <div class="comment-content">{Body}</div>
  607.         </div>
  608.         {/block:Reblogs}
  609.     </div>
  610.     {/block:RebloggedFrom}
  611.     {/block:Text} <!-- end of text post block -->
  612.    
  613.     {block:Link}
  614.     <!-- bro i hate formatting link posts so much -->
  615.     {block:Host}<div class="link-host">{Host}</div>{/block:Host}
  616.     <a class="post-title" href="{URL}">{Name} <i class="fa fa-caret-right"></i></a>
  617.     {block:Excerpt}
  618.     <blockquote class="excerpt">{Excerpt}</blockquote>
  619.     {/block:Excerpt}
  620.     <!-- renders if the link has an excerpt -->
  621.     {block:Description}
  622.     <div class="caption {block:NotReblog}single{/block:NotReblog}">
  623.         {block:NotReblog}{Description}{/block:NotReblog}
  624.         {block:RebloggedFrom}
  625.         {block:Reblogs}
  626.         <!-- renders for reblogs only -->
  627.         <div class="reblogged-comment">
  628.             <i class="fa fa-user"></i>
  629.             <a class="user {block:IsDeactivated}inactive{/block:isDeactivated}" href="{Permalink}">{Username}</a>
  630.             <div class="comment-content">{Body}</div>
  631.         </div>
  632.         {/block:Reblogs}
  633.         {/block:RebloggedFrom}
  634.     </div>
  635.     {/block:Description}
  636.     {/block:Link}
  637.    
  638.     {block:Quote}
  639.     <blockquote class="post-title quote"><i class="fa fa-quote-left" aria-hidden="true"></i>{Quote}</blockquote>
  640.     {block:Source}<div class="quote-source">&mdash; {Source}</div>{/block:Source}
  641.     {/block:Quote}
  642.    
  643.     <!-- other media -->
  644.     {block:Photo}
  645.     <figure class="media-wrap">{LinkOpenTag}<img src="{PhotoURL-HighRes}" alt="{PhotoAlt}">{LinkCloseTag}</figure>
  646.     {/block:Photo}
  647.    
  648.     {block:Photoset}
  649.     <figure class="media-wrap">{Photoset}</figure>
  650.     <!-- this element is responsive - finally! lmao photosets used to be really annoying to style -->
  651.     {/block:Photoset}
  652.    
  653.     {block:Video}
  654.     <figure class="media-wrap">{Video-500}</figure>
  655.     {/block:Video}
  656.    
  657.     {block:Audio}
  658.     <figure class="media-wrap">{AudioEmbed-500}</figure>
  659.     {/block:Audio}
  660.    
  661.     {block:Chat}
  662.     {block:Lines}
  663.     <p class="chat {Alt}">{block:Label}<b>{Label} </b>{/block:Label}{Line}</p>
  664.     {/block:Lines}
  665.     {/block:Chat}
  666.    
  667.     {block:Answer}
  668.     <div class="quest">
  669.         <i class="far fa-comment-alt fa-flip-horizontal"></i> {Asker}
  670.         {Question}
  671.     </div>
  672.     {block:Answerer}
  673.     <div class="caption">
  674.         <i class="fa fa-comment-alt"></i>
  675.         <a class="user {block:IsDeactivated}inactive{/block:isDeactivated}" href="{Permalink}">{Answerer}</a>
  676.         <div class="reblogged-comment">{Answer}</div>
  677.     </div>
  678.     {/block:Answerer}
  679.     <div class="caption {block:NotReblog}single{/block:NotReblog}">
  680.         {block:NotReblog}{Answer}{/block:NotReblog}
  681.         {block:RebloggedFrom}
  682.             {block:Reblogs}
  683.             <div class="reblogged-comment">
  684.                 <i class="fa fa-user"></i>
  685.                 <a class="user {block:IsDeactivated}inactive{/block:isDeactivated}" href="{Permalink}">{Username}</a>
  686.                 <div class="comment-content">{Body}</div>
  687.             </div>
  688.             {/block:Reblogs}
  689.         {/block:RebloggedFrom}
  690.     </div>
  691.     {/block:Answer}
  692.    
  693.     {block:Caption}
  694.     <!-- this will render for any media post that has a caption! hax -->
  695.     <div class="media-post caption {block:NotReblog}single{/block:NotReblog}">
  696.         {block:NotReblog}{Caption}{/block:NotReblog}
  697.         {block:RebloggedFrom}
  698.         {block:Reblogs}
  699.         <!-- renders for reblogs only -->
  700.         <div class="reblogged-comment">
  701.             <i class="fa fa-user"></i>
  702.             <a class="user {block:IsDeactivated}inactive{/block:isDeactivated}" href="{Permalink}">{Username}</a>
  703.             <div class="comment-content">{Body}</div>
  704.         </div>
  705.         {/block:Reblogs}
  706.         {/block:RebloggedFrom}
  707.     </div>
  708.     {/block:Caption}
  709.    
  710.     {block:Date}
  711.     <!-- only renders on actual posts, not custom/ask/submit pages-->
  712.     <hr class="footer-spacer {block:HasTags}show{/block:HasTags} {block:NoteCount}show{/block:NoteCount} {block:ContentSource}show{/block:ContentSource}"/>
  713.     <footer class="post-info">
  714.         {block:HasTags}
  715.         <!-- only renders if the post has tags -->
  716.         <div class="tags">
  717.             {block:Tags}<a href="{TagURL}" class="tag">#{Tag}</a>&nbsp;{/block:Tags}
  718.         </div>
  719.         {/block:HasTags}
  720.         <div class="details">
  721.             {block:NotReblog}{block:NoteCount}<span>&nbsp;</span>{/block:NoteCount}{/block:NotReblog}
  722.             <!-- prevents the note count label from breaking since it floats to the right -->
  723.             {block:ContentSource}
  724.             Source: <a href="{ContentSourceURL}" class="source-label">{SourceTitle}</a>
  725.             {/block:ContentSource}
  726.             {block:RebloggedFrom}
  727.             <span class="{block:ContentSource}hidden{/block:ContentSource}">
  728.             OP: <a href="{ReblogRootURL}" class="source-label">{ReblogRootName}</a>
  729.             </span>
  730.             {/block:RebloggedFrom}
  731.             {block:NoteCount}
  732.             <a href="{Permalink}#notes" class="note-count">{NoteCountWithLabel}</a>
  733.             {/block:NoteCount}
  734.             <!-- you should use the "with label" variant of the note count variable wherever possible. it adds commas into the note count and accommodates localization -->
  735.         </div>
  736.     </footer>
  737.     <footer class="post-controls">
  738.         <a class="info-btn fa-fw fa fa-retweet reblog-btn" href="{ReblogURL}"></a>
  739.         <span class="like-wrap">{LikeButton}<a class="like-btn fa-fw info-btn fa fa-heart"></a></span>
  740.     </footer>
  741.     {/block:Date}
  742. </article>
  743. </div> <!-- end of posts wrapper -->
  744.     {block:PostNotes}
  745.     <!-- only renders on permalink pages if the post has notes -->
  746.     <footer id="notes" class="post is-post">
  747.         {PostNotes}
  748.         <!-- this variant won't show the avatars -->
  749.     </footer>
  750.     {/block:PostNotes}
  751. {/block:Posts}
  752. </main> <!-- end of posts block -->
  753.  
  754. {block:Pagination}
  755. <nav id="pagination">
  756.     {block:PreviousPage}
  757.     <a class="pagi-link fa fa-fw fa-chevron-left" href="{PreviousPage}" title="{lang:Previous}"></a>
  758.     {/block:PreviousPage}
  759.     {block:JumpPagination length="7"}
  760.     {block:CurrentPage}<a class="pagi-link active">{PageNumber}</a>{/block:CurrentPage}
  761.     {block:JumpPage}<a class="pagi-link" href="{URL}">{PageNumber}</a>{/block:JumpPage}
  762.     {/block:JumpPagination}
  763.     {block:NextPage}
  764.     <a class="pagi-link fa fa-fw fa-chevron-right" href="{NextPage}" title="{lang:Next}"></a>
  765.     {/block:NextPage}
  766. </nav>
  767. {/block:Pagination}
  768.  
  769. <!-- don't touch pl0x -->
  770. <div id="cred" class="streamlined">
  771.     <i class="fa fa-code" aria-hidden="true"></i> <a href="https://linthm.tumblr.com/thm"><i>Papercrush</i> theme</a>
  772. </div>
  773.  
  774. </div>
  775.  
  776. <!-- don't touch pl0x -->
  777. <a id="cred" class="button" href="https://linthm.tumblr.com/thm" title="Papercrush Theme &copy; Laighlin">@L</a>
  778.  
  779. </div> <!-- wrapper finishes just before the end of the body -->
  780.  
  781. {block:ifStickyNavigation}
  782. <script type="text/javascript">
  783.     window.onscroll = function() { toggleStick() };
  784.     var topbar = document.getElementById("navigation");
  785.     var sticky = topbar.offsetTop;
  786.     function toggleStick() {
  787.       if (window.pageYOffset > sticky) {
  788.         topbar.classList.add("sticky").remove("scrolling");
  789.       } else {
  790.         topbar.classList.remove("sticky").add("scrolling");
  791.       }
  792.     }
  793. </script>
  794. {/block:ifStickyNavigation}
  795.  
  796. </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!