API tools faq
paste
southcodes

[theme #6] i want a president

southcodes
Jul 6th, 2019 (edited)
1,629
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
CSS 25.67 KB | None | 0 0
raw download clone embed print report
  1. <!--
  2.     - theme #6 'I Want a President' by sur southcodes.tumblr.com
  3.     - modify as you please but please do not touch the credit
  4.     - any errors? need help? have questions? let me know!
  5.     southcodes.tumblr.com/ask
  6.    
  7.     - fade in fade out links by @espoirthemes
  8.    
  9.     - like button by @shythemes
  10.    
  11.     - honeybee icons by @suiomi
  12.    
  13.     - captions documentation by @bychloethemes
  14.    
  15.     - normalize css by https://github.com/necolas
  16.    
  17.     - tooltips by https://jqueryui.com/
  18.    
  19.     - embed audio css and hide empty answers script by @gukthemes
  20.    
  21.     - pxu photosets by pixel union https://github.com/PixelUnion/Extended-Tumblr-Photoset
  22.         tutorial by @shythemes https://shythemes.tumblr.com/post/113728114758/tutorial-pixel-union-photosets
  23.         modified pxu script by @bychloethemes https://bychloethemes.tumblr.com/post/155956945114/modified-pxu-photoset-script-modified-by
  24.    
  25. -->
  26.  
  27. <!DOCTYPE html>
  28. <html id="top">
  29. <head>
  30.  
  31.     <title>{Title}</title>
  32.  
  33.     <link rel="shortcut icon" href="{favicon}">
  34.     <meta name="viewport" content="width=device-width">
  35.     <link rel="alternate" type="application/rss+xml" href="{RSS}">
  36.     {block:Description}<meta name="description" content="{MetaDescription}"/>{/block:Description}
  37.    
  38.     <link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/[email protected]/normalize.css">
  39.    
  40.     <link href="https://fonts.googleapis.com/css?family=Crimson+Text:400,600|Open+Sans:400,400i,600&display=swap" rel="stylesheet">
  41.    
  42.     <!-- honeybee --> <link rel="stylesheet" href="https://solrainha.github.io/honeybee/honeybee.css" >
  43.     <!--  PXU Photoset CSS -->
  44.     <link href="https://static.tumblr.com/qudkd6d/OcDnl99gb/style.css" rel="stylesheet" type="text/css"/>
  45.  
  46. <meta name="image:header" content=""/>
  47.  
  48. <meta name="color:background" content="#f8f8f8"/>
  49. <meta name="color:posts" content="#ffffff"/>
  50. <meta name="color:text" content="#333333"/>
  51. <meta name="color:links" content="#c199c3"/>
  52. <meta name="color:links hover" content="#685079"/>
  53. <meta name="color:accents" content="#b08dce"/>
  54. <meta name="color:ask" content="#e7dbf3"/>
  55.  
  56. <meta name="select:post size" content="500px"/>
  57. <meta name="select:post size" content="450px"/>
  58. <meta name="select:post size" content="400px"/>
  59. <meta name="select:post size" content="350px"/>
  60.  
  61. <meta name="if: updates bar" content="1" />
  62. <meta name="if: header" content="1" />
  63. <meta name="if: dropdown links" content="1" />
  64.  
  65. <meta name="text:box title" content="title" />
  66. <meta name="text:box content" content="content" />
  67.  
  68. <meta name="text:Link 1" content="index" />
  69. <meta name="text:Link 1 URL" content="/" />
  70. <meta name="text:Link 2" content="mail" />
  71. <meta name="text:Link 2 URL" content="/ask" />
  72. <meta name="text:Link 3" content="" />
  73. <meta name="text:Link 3 URL" content="" />
  74. <meta name="text:Link 4" content="" />
  75. <meta name="text:Link 4 URL" content="" />
  76. <meta name="text:Link 5" content="" />
  77. <meta name="text:Link 5 URL" content="" />
  78.  
  79.  
  80.  
  81.  
  82. <style type="text/css">
  83.  
  84. .tmblr-iframe {margin:.7rem;opacity:.6;-ms-transform: scale(0.85); /* IE 9 */-webkit-transform: scale(0.85); /* Safari */transform: scale(0.85);}
  85. .tmblr-iframe:hover {opacity:.8;}
  86.  
  87. ::-webkit-scrollbar-thumb:vertical {border-left:2px solid {color:links};}
  88. ::-webkit-scrollbar {width:6px}
  89. ::-webkit-scrollbar-track-piece{margin:5px 0;}
  90.  
  91. pre {font-family:consolas;
  92.     white-space: pre-wrap;       /* css-3 */
  93.     white-space: -moz-pre-wrap;  /* Mozilla, since 1999 */
  94.     white-space: -pre-wrap;      /* Opera 4- */
  95.     white-space: -o-pre-wrap;    /* Opera 7 */
  96.     word-wrap: break-word;}      /* Internet Explorer 5.5+ */
  97.  
  98. body, figure{margin:0;padding:0}
  99. html{font: 14px 'Open Sans', sans-serif;}
  100. body {font-size:14px;line-height:160%;color:{color:text};background:{color:background};}
  101. a {text-decoration: none;color:{color:links};word-break:break-word;
  102.     transition-duration:1s;}
  103. blockquote {margin:0;padding-left:.5rem;border-left:1px solid #aaa;}
  104. blockquote blockquote {margin-left:.5rem}
  105. img {max-width:100%;height: auto;display: block;margin: .7rem 0}
  106. hr {border:0;border-top:1px solid #aaa;margin:0;}
  107. b{font-weight: 600}
  108. video { max-width:100%;}
  109. small {font-size:.9rem}
  110. a:hover {
  111.     color:{color:links hover};
  112. }
  113.  
  114. pre {
  115.     background:#f9f9f9;
  116.     border:1px solid #ebebeb;
  117.     padding:.7rem;
  118. }
  119.  
  120. .th {
  121.     color:{color:accents};
  122. }
  123.  
  124. .th-cross-3-o {
  125.     /*float:right;*/
  126.     right:2rem;
  127.     position:absolute;
  128.     cursor:pointer;
  129.     margin:1rem 0 0 0 ;
  130.     transition-duration:.2s;
  131.     font-size:1.3rem;
  132.     transform:rotate(45deg);}
  133.  
  134. .th-pencil-o {
  135.     font-size:1.1rem;}
  136.  
  137. .th-link {
  138.     font-size:1.4rem;
  139.     transition-duration:.1s;
  140. }
  141.  
  142. .link:hover .th-link {
  143.     transform:rotate(0deg);
  144. }
  145.  
  146. .th-cross-3-o:hover {
  147.     transform:rotate(0deg);}
  148.  
  149. .th-right-arrow {
  150.     vertical-align:middle;
  151.     padding-left:.7rem;
  152.     color:white;
  153. }
  154.  
  155.  
  156. #container {
  157.     width:calc({select:post size} + 3rem);
  158.     margin:0 auto 0;
  159.     position:relative;
  160.     top:0;
  161.    
  162. }
  163.  
  164. h1.posttitle{
  165.     font-size:2rem;
  166.     line-height:160%;
  167.     margin:0;
  168. }
  169.  
  170. /*  header  */
  171.  
  172. #header {
  173.     width:calc({select:post size} + 3rem);
  174.     margin:7rem auto 10rem;
  175.     background:{color:posts};
  176.     border-radius:10px;
  177.     padding:1.5rem;
  178.     position:relative;
  179.     box-sizing:border-box;
  180. }
  181. .simg {
  182.     margin:0 0 1rem;
  183. }
  184.  
  185. #btitle,h1 {
  186.     margin:0;
  187.     font: 600 2rem 'Open Sans', sans-serif;
  188.     line-height:170%;
  189. }
  190. #btitle {
  191.     float:left;
  192.     font-size:1.8rem;
  193. }
  194.  
  195.  
  196. #desc {
  197.     margin:.5rem 0 0;
  198.     font-size:1.1rem;
  199. }
  200.  
  201. #navi {
  202.    
  203.     {block:ifdropdownlinks}
  204.     display:none;
  205.     {/block:ifdropdownlinks}
  206.     background:{color:posts};
  207.     padding:1.5rem 1.5rem;
  208.     width:100%;
  209.     position:absolute;left:0;right:0;
  210.     border-radius:10px;
  211.     text-transform:uppercase;
  212.     font-size:.9rem;
  213.     letter-spacing:.03rem;
  214.     box-sizing:border-box;}
  215. #navi li a{}
  216. #navi li a:hover{}
  217. #navi ul,nav li {margin:0;padding:0;list-style-type:none;display:inline-block;}
  218.  
  219. #navi li{margin-right:1rem}
  220. #navi li:last-of-type{margin-right:0}
  221.  
  222. /* sidebar */
  223.  
  224. /* main */
  225.  
  226. #main {
  227.     width:calc({select:post size} + 2rem);
  228.     margin: auto;
  229. }
  230.  
  231. .posts {
  232.     margin:7rem auto 10rem;
  233.     background:{color:posts};
  234.     border-radius:10px;
  235.     padding:1.5rem;
  236.     box-shadow:1px 1px 3px {color:accents};
  237. }
  238.  
  239. .posts:only-of-type {
  240.     margin-bottom:2rem
  241. }
  242.  
  243. .photo {display: block;margin: 0;}
  244.  
  245. /*               posts              */
  246.  
  247. /*      photosets      */
  248.  
  249.  
  250. .photo-slideshow {
  251. }
  252.  
  253. .photo-slideshow img,.posts img{
  254.     margin:0;}
  255. /*      asks        */
  256.  
  257. /*    chat    */
  258.  
  259. .cline:nth-of-type(odd) {
  260.     background:#eee;
  261.     padding:.5rem;
  262. }
  263. .cline:nth-of-type(even) {
  264.     padding:.5rem;}
  265. .label_odd {color:#000;font-weight:600;}
  266. .label_even{font-weight:600;padding:.2rem .4rem;margin-right:.2rem;}
  267.  
  268. /*    quotes    */
  269.  
  270.  
  271. /*  audio   */
  272.  
  273. iframe.spotify_audio_player {height:85px;overflow:hidden;}
  274.  
  275. /*  captions    */
  276.  
  277. .capt p{
  278.     margin:.7rem 0;
  279. }
  280. .cimg {margin-top:1rem;width:1.5rem;border-radius:4px;display:inline-block;vertical-align:middle;}
  281. .user {margin-top:.5rem;font-size:.9rem;letter-spacing:.03rem;display:inline-block;margin-left:.4rem;vertical-align:bottom;}
  282.  
  283. /* extras */
  284.  
  285. .posts date {display:block;
  286. margin-bottom:1.5rem;
  287. font-size:1.02rem;
  288. }
  289.  
  290. .rl {float:right};
  291.  
  292.  
  293. .rl {
  294. }
  295. .rbg {
  296.     text-transform:uppercase;
  297.     font-size:.8rem;
  298.     letter-spacing:.02rem;
  299. }
  300.  
  301. svg {width:12px;height:auto;opacity:.5;display:block;overflow:visible;}
  302. .controls {display:inline-block;margin:.2rem .2rem 0 .5rem;}
  303. .controls .like .liked + svg {opacity:1;}
  304. .controls .like .liked + svg path {fill:#ec5a5a;}
  305. .controls .like .like_button {position:relative;}
  306. .controls .like .like_button iframe {position:absolute;top:0;left:0;bottom:0;right:0;z-index:2;opacity:0;}
  307.  
  308. .tags {
  309.     padding-top:1rem;
  310.     font-size:.95rem;
  311. }
  312. .tags a{
  313.     border-bottom:1px solid {color:links};
  314.     margin-right:1rem;
  315. }
  316. .src {}
  317.  
  318. .via,.src {padding:.3rem .7rem ;
  319. background:{color:links};
  320. text-transform:uppercase;
  321. font-weight:600;
  322. font-size:.9rem;
  323. color:{color:posts};
  324. border-radius:3px;
  325. line-height:270%;
  326. margin-right:.4rem;
  327. }
  328.  
  329.  
  330. .via a,.src a {
  331. }
  332.  
  333. .notes li {
  334.     line-height:260%;}
  335. ol.notes {    
  336.     border-radius:10px;
  337.     box-shadow:1px 1px 3px {color:accents};
  338.     background:white;
  339.     padding:1rem;
  340.     font-size:.9rem;
  341.     line-height:2rem;
  342.     margin:4rem auto;}
  343. .notes ol{max-height:30rem;overflow:auto;}
  344. .notes a{font-weight:600;}
  345. .notes img{display:none;}
  346. .notes li, .notes ol {list-style-type:none;}
  347.  
  348. .ui-tooltip {
  349. display: inline-block;
  350. color:#333333;
  351. z-index:99999999!important;
  352. max-width:150px;
  353. position:absolute;
  354. padding:.3rem .5rem;
  355. line-height:150%;
  356. font-size:.8rem;
  357. background:rgba(255,255,255, 1);
  358. text-transform:lowercase;
  359.     letter-spacing:.02rem;
  360. }
  361.  
  362. .perma {
  363.     font-size:.95rem;
  364.     margin:2rem auto 1rem;
  365.     text-align:right;
  366. }
  367. .perma a {
  368.     color:white;
  369.     font-weight:600;
  370. }
  371.  
  372. .permabg {
  373.     border-radius:4px;
  374.     background:{color:accents};
  375.     margin:auto;
  376.     padding:.3rem .4rem;
  377.     transition-duration:1s;
  378. }
  379.  
  380. .permabg:hover {
  381.     background:{color:links hover};
  382. }
  383.  
  384. .quote {
  385.     font-family: 'Crimson Text', serif;
  386.     font-weight:600;
  387.     line-height:130%;
  388.     font-size:1.3rem;
  389. }
  390. .qsrc {
  391.     font-size:1rem;
  392.     margin-top:1rem;
  393. }
  394.  
  395. .tags {
  396.     margin:0 1rem;
  397. }
  398.  
  399. .link {position:relative;
  400.     font-size:1.7rem;
  401.     font-weight:600;
  402.     margin-bottom:1rem;
  403.     padding-bottom:.3rem;
  404.     line-height:150%;
  405. }
  406.  
  407. .excerpt {
  408.     margin-top:1rem;
  409.     border-left:1px solid #999;
  410.     padding-left:.5rem;
  411.     font-size:.95rem;
  412. }
  413.  
  414. {CustomCSS}
  415.  
  416. #sidebar {
  417.     position: -webkit-sticky;
  418.     position: sticky;
  419.     top:3rem;
  420.     width:15rem;
  421.     box-shadow:1px 1px 3px {color:accents};
  422.     border-radius:5px;
  423.     background:{color:posts};
  424.     overflow:auto;
  425. }
  426.  
  427.  
  428. #sidebar h4 {
  429.     margin:0;
  430.     font-size:1.1rem;
  431.     text-transform:uppercase;
  432. }
  433.  
  434. #sidebar p {
  435.     margin:1rem 0 0;
  436. }
  437.  
  438. .side {padding:.7rem;
  439.     word-break:break-word;
  440.     overflow:auto;
  441.     font-size:.95rem;
  442.    
  443. }
  444.  
  445. .sidetit {
  446.     border-bottom:1px solid #ddd;
  447.     padding-bottom:.5rem;
  448.     text-align:center;
  449. }
  450.  
  451. .answer {
  452.     margin:0rem;
  453.     font-size:.95rem;
  454.     display:block;
  455. }
  456.  
  457. .asker a{
  458.     color:{color:links};
  459.     font-size:1rem;
  460. }
  461.  
  462. .side hr {
  463.     border:0;
  464.     bottom:1px solid #aaa;
  465. }
  466.  
  467. .ttop {
  468.     opacity:0;
  469.     position:fixed;
  470.     bottom:2rem;
  471.     right:3rem;
  472.     visibility:hidden;
  473.     z-index:99999;
  474.     font-size:.9rem;
  475.     font-weight:300;
  476.     letter-spacing:.07rem;
  477.     animation:fadingout 1s 1 forwards;
  478. }
  479.  
  480. .ttop.fadein {
  481.     visibility:visible;
  482.     animation:fading 1s 1 forwards!important;
  483. }
  484.  
  485. @keyframes fading {
  486.     0% {
  487.         opacity:0;
  488.     }
  489.    
  490.     100% {
  491.         opacity:1;
  492.     }
  493. }
  494.  
  495.  
  496. @keyframes fadingout {
  497.     0% {
  498.         opacity:1;
  499.     }
  500.    
  501.     100% {
  502.         opacity:0;
  503.     }
  504. }
  505.  
  506. .jump_page {
  507.     float:left;
  508.  
  509. padding:.3rem .5rem ;
  510. background:{color:links};
  511. text-transform:uppercase;
  512. font-weight:600;
  513. font-size:.9rem;
  514. color:{color:posts};
  515. border-radius:3px;
  516. }
  517. .jump_page2 {   float:right;
  518. padding:.3rem .5rem ;
  519. background:{color:links};
  520. color:{color:posts};
  521. text-transform:uppercase;
  522. font-weight:600;
  523. font-size:.9rem;
  524. border-radius:3px;
  525. }
  526.  
  527.  
  528. .th-push-pin {
  529.     position:absolute;
  530.     font-size:1.5rem;
  531.     top:2px;
  532.     left:2px;
  533.     color:{color:accents};
  534.     z-index:99999999999!important;
  535. }
  536.  
  537. .th-question {
  538.     font-size:1.8rem;
  539.     vertical-align:middle;
  540.     margin-right:.5rem;
  541.     display:inline-block;
  542. }
  543.  
  544. .asker {
  545.     display:inline-block;
  546. }
  547. .q {
  548.     margin:1rem 0;
  549. }
  550.  
  551.  
  552. .th-chat-bubbles {
  553.    
  554.     vertical-align:middle;
  555.     font-size:1.8rem;
  556.     margin-right:.5rem;
  557. }
  558.  
  559. .ask {
  560.     background:{color:ask};
  561.     padding:1rem 1rem 1px;
  562. }
  563.  
  564. @media only screen and (min-width:0px) and (max-width:1228px) {
  565.     #ressidebar {
  566.         display:none;
  567.     }
  568. }
  569.  
  570. </style>
  571. </head>
  572.  
  573. <body id="top">
  574.  
  575.  
  576. <section id="container" style="position:relative">
  577.  
  578.  
  579. {block:Ifupdatesbar}  
  580.     <div id="ressidebar" style="position:absolute;height:100%;left:-25rem;margin-top:6rem">
  581.     <section id="sidebar"> <span class="th th-push-pin"></span>
  582.        
  583.         <article class="side">
  584.             <h4 class="sidetit">{text:box title}</h4>
  585.             <p>{text:box content}</p>
  586.             <hr style="margin:0">
  587.         </article>
  588.        
  589.     </section>
  590.     </div>
  591. {/block:Ifupdatesbar}  
  592.  
  593.  
  594.  
  595.     <!-- template for more boxes-->
  596.    
  597.    
  598.     <!--
  599.    
  600.         <article class="side">
  601.        
  602.             <h4 class="sidetit">TITLE</h4>
  603.            
  604.             <p>CONTENT</p>
  605.            
  606.             <hr style="margin:0">
  607.         </article>
  608.    
  609.     -->
  610.    
  611.    
  612. <header id="header">
  613.  
  614.  
  615.     {block:ifheader}
  616.     <a href="/"><figure class="simg">
  617.         <img class="simg" src="{image:header}"/>
  618.     </figure></a>
  619.     {/block:ifheader}
  620.  
  621.  
  622.     <h1 id="btitle"><a href="/" style="color:{color:text}">{title}</a></h1>
  623.    
  624.     {block:ifdropdownlinks}
  625.     <div class="th th-cross-3-o" title="navigation"></div>
  626.     {/block:ifdropdownlinks}
  627.     <div style="clear:both"></div>
  628.    
  629.  
  630.     <p id="desc">{description}</p>
  631.  
  632.         <nav id="navi">
  633.     {block:iflink1}<li><a href="{text:Link 1 URL}">{text:Link 1}</a></li>{/block:iflink1}
  634.     {block:iflink2}<li><a href="{text:Link 2 URL}">{text:Link 2}</a></li>{/block:iflink2}
  635.     {block:iflink3}<li><a href="{text:Link 3 URL}">{text:Link 3}</a></li>{/block:iflink3}
  636.     {block:iflink4}<li><a href="{text:Link 4 URL}">{text:Link 4}</a></li>{/block:iflink4}
  637.     {block:iflink5}<li><a href="{text:Link 5 URL}">{text:Link 5}</a></li>{/block:iflink5}
  638.     </nav>
  639. </header>
  640.  
  641.  
  642. <main id="main">
  643.  
  644.  
  645. {block:Posts}
  646. <article class="posts" id="{PostID}">
  647.  
  648. {block:Date}<date>
  649.  
  650.  
  651. <span style="padding-left:.5rem;font-size:.9rem;letter-spacing:.03rem;border-left:2px solid {color:accents}" title="{ShortMonth} {DayOfMonthWithSuffix}">{24HourWithZero}:{Minutes}hs {block:NoteCount} &nbsp; → &nbsp; {NoteCount}N{/block:NoteCount}</span>
  652.  
  653.  
  654. <div class="rl">
  655. <span class="rbg"><a href="{ReblogURL}" title="reblog" target="_blank"><span class="th th-reblog"></span></a></span>
  656.  
  657. <div class="controls"><a class="like">{LikeButton}<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></a></div>
  658. </div>
  659. </date>{/block:Date}
  660.  
  661.     <div style="clear:both"></div>
  662.    
  663. {block:Text}
  664. {block:Title}<h1 class="h1itle">{Title}</h1>{/block:Title}
  665. {block:Body}<div class="capt">
  666. {block:NotReblog}{Body}{/block:NotReblog}
  667. {block:RebloggedFrom}{block:Reblogs}
  668. {block:HasAvatar}
  669.     {block:HasPermalink}<a href="{Permalink}" target="_blank"><img class="cimg" src="{PortraitURL-64}"></a>{/block:HasPermalink}
  670.     {block:HasNoPermalink}<img class="cimg" src="{PortraitURL-64}">{/block:HasNoPermalink}
  671.     {/block:HasAvatar}
  672.     {block:HasPermalink}<a target="_blank" class="user" href="{Permalink}">{Username}</a>{/block:HasPermalink}
  673.     {block:HasNoPermalink}<div cflass="user">{Username}</div>{/block:HasNoPermalink}
  674.         {Body}
  675. {/block:Reblogs}{/block:RebloggedFrom}
  676. </div>{/block:Body}
  677. {/block:Text}
  678.  
  679.  
  680. {block:Answer}
  681. <div class="answer">
  682. <div class="ask">
  683.     <!--<img src="{AskerPortraitURL-96}" class="askimg">-->
  684.     <div class="th th-question"></div>
  685.     <div class="asker"><span style="font-weight:600">{Asker}</span> sent:</div>
  686.     <div class="q">{Question}</div>
  687. </div>
  688.  
  689.     {block:Answerer}
  690.     <div class="ans" style="margin-top:1rem">
  691.     <!--<img class="ansimg" src="{AnswererPortraitURL-96}" alt="">-->
  692.     <span class="th th-chat-bubbles"></span><span style="font-size:.9rem"><span style="text-transform:capitalize;font-weight:600">{Answerer}</span> answered:</span><br>
  693.     <span class="reply">{Answer}</span></div>
  694.     {/block:Answerer}
  695.  
  696.     {block:NotReblog}
  697.         {Replies}
  698.     {/block:NotReblog}
  699. </div><!-- answer -->
  700.  
  701. {block:RebloggedFrom}{block:Reblogs}
  702. <div class="usercont">
  703. {block:HasAvatar}
  704. {block:HasPermalink}<a href="{Permalink}" target="_blank" class="cimg"><img class="cimg" src="{PortraitURL-64}"></a>{/block:HasPermalink}
  705. {block:HasNoPermalink}<img class="cimg" src="{PortraitURL-64}">{/block:HasNoPermalink}
  706. {/block:HasAvatar}
  707. {block:HasPermalink}<a target="_blank" class="user {block:IsDeactivated}userd{/block:IsDeactivated}" href="{Permalink}">{Username}</a>{/block:HasPermalink}
  708. {block:HasNoPermalink}<div class="user {block:IsDeactivated}userd{/block:IsDeactivated}">{Username}</div>{/block:HasNoPermalink}
  709. </div>
  710. {Body}
  711. {/block:Reblogs}{/block:RebloggedFrom}
  712. {/block:Answer}
  713.  
  714.  
  715. {block:Quote}
  716. <div class="quote">{Quote}</div>
  717. {block:Source}<div class="qsrc"><span class="th th-pencil-o"></span>&nbsp;&nbsp;{Source}</div>{/block:Source}
  718. {/block:Quote}
  719.  
  720. {block:Link}
  721. <a class="link" href="{URL}"><span class="th th-link"></span> {Name}</a>
  722. {block:Excerpt}<div class="excerpt">{Excerpt}</div>{/block:Excerpt}
  723. {block:Description}<div class="capt">
  724. {block:NotReblog}{Description}{/block:NotReblog}
  725. {block:RebloggedFrom}{block:Reblogs}
  726. {block:HasAvatar}
  727.     {block:HasPermalink}<a href="{Permalink}" target="_blank"><img class="cimg" src="{PortraitURL-64}"></a>{/block:HasPermalink}
  728.     {block:HasNoPermalink}<img class="cimg" src="{PortraitURL-64}">{/block:HasNoPermalink}
  729.     {/block:HasAvatar}
  730.     {block:HasPermalink}<a target="_blank" class="user" href="{Permalink}">{Username}</a>{/block:HasPermalink}
  731.     {block:HasNoPermalink}<div class="user">{Username}</div>{/block:HasNoPermalink}
  732.         {Body}
  733. {/block:Reblogs}{/block:RebloggedFrom}
  734. </div>{/block:Description}
  735. {/block:Link}
  736.  
  737. {block:Chat}<div class="chat">
  738. {block:Title}<h1 class="posttitle">{Title}</h1>{/block:Title}
  739. {block:Lines}{block:Label}<div class="cline">
  740. <span class="label_{alt}">{Label}</span>{/block:Label} {Line}</div>
  741. {/block:Lines}</div>
  742. {/block:Chat}
  743.  
  744. {block:Photo}
  745. <img src="{PhotoURL-500}" class="photo" alt="{PhotoAlt}"/>
  746. {block:Caption}<div class="capt">
  747. {block:NotReblog}{Caption}{/block:NotReblog}
  748. {block:RebloggedFrom}{block:Reblogs}
  749. {block:HasAvatar}
  750.     {block:HasPermalink}<a href="{Permalink}" target="_blank"><img class="cimg" src="{PortraitURL-64}"></a>{/block:HasPermalink}
  751.     {block:HasNoPermalink}<img class="cimg" src="{PortraitURL-64}">{/block:HasNoPermalink}
  752.     {/block:HasAvatar}
  753.     {block:HasPermalink}<a target="_blank" class="user" href="{Permalink}">{Username}</a>{/block:HasPermalink}
  754.     {block:HasNoPermalink}<div class="user">{Username}</div>{/block:HasNoPermalink}
  755.         {Body}
  756. {/block:Reblogs}{/block:RebloggedFrom}
  757. </div>{/block:Caption}
  758. {/block:Photo}
  759.  
  760. {block:Photoset}
  761. <div class="photo-slideshow" id="photoset_{PostID}" data-layout="{PhotosetLayout}">{block:Photos}<div class="photo-data"><div class="pxu-photo"><img src="{PhotoURL-500}" width="{PhotoWidth-500}" height="{PhotoHeight-500}" data-highres="{PhotoURL-HighRes}" data-width="{PhotoWidth-HighRes}" data-height="{PhotoHeight-HighRes}"></div><a class="tumblr-box" rel="post-{PostID}" href="{PhotoURL-HighRes}"></a></div>{/block:Photos}</div>
  762. {block:Caption}<div class="capt">
  763. {block:NotReblog}{Caption}{/block:NotReblog}
  764. {block:RebloggedFrom}{block:Reblogs}
  765. {block:HasAvatar}
  766.     {block:HasPermalink}<a href="{Permalink}" target="_blank"><img class="cimg" src="{PortraitURL-64}"></a>{/block:HasPermalink}
  767.     {block:HasNoPermalink}<img class="cimg" src="{PortraitURL-64}">{/block:HasNoPermalink}
  768.     {/block:HasAvatar}
  769.     {block:HasPermalink}<a target="_blank" class="user" href="{Permalink}">{Username}</a>{/block:HasPermalink}
  770.     {block:HasNoPermalink}<div class="user">{Username}</div>{/block:HasNoPermalink}
  771.         {Body}
  772. {/block:Reblogs}{/block:RebloggedFrom}
  773. </div>{/block:Caption}
  774. {/block:Photoset}
  775.  
  776. {block:Audio}
  777. {block:AudioEmbed}<div style="height:85px;overflow:hidden;" class="audio">{AudioEmbed}</div>{/block:AudioEmbed}
  778. {block:Caption}<div class="capt">
  779. {block:NotReblog}{Caption}{/block:NotReblog}
  780. {block:RebloggedFrom}{block:Reblogs}
  781. {block:HasAvatar}
  782.     {block:HasPermalink}<a href="{Permalink}" target="_blank"><img class="cimg" src="{PortraitURL-64}"></a>{/block:HasPermalink}
  783.     {block:HasNoPermalink}<img class="cimg" src="{PortraitURL-64}">{/block:HasNoPermalink}
  784.     {/block:HasAvatar}
  785.     {block:HasPermalink}<a target="_blank" class="user" href="{Permalink}">{Username}</a>{/block:HasPermalink}
  786.     {block:HasNoPermalink}<div class="user">{Username}</div>{/block:HasNoPermalink}
  787.         {Body}
  788. {/block:Reblogs}{/block:RebloggedFrom}
  789. </div>{/block:Caption}
  790. {/block:Audio}
  791.  
  792. {block:Video}
  793. <div class="video">{Video-500}</div>
  794. {block:Caption}<div class="capt">
  795. {block:NotReblog}{Caption}{/block:NotReblog}
  796. {block:RebloggedFrom}{block:Reblogs}
  797. {block:HasAvatar}
  798.     {block:HasPermalink}<a href="{Permalink}" target="_blank"><img class="cimg" src="{PortraitURL-64}"></a>{/block:HasPermalink}
  799.     {block:HasNoPermalink}<img class="cimg" src="{PortraitURL-64}">{/block:HasNoPermalink}
  800.     {/block:HasAvatar}
  801.     {block:HasPermalink}<a target="_blank" class="user" href="{Permalink}">{Username}</a>{/block:HasPermalink}
  802.     {block:HasNoPermalink}<div class="user">{Username}</div>{/block:HasNoPermalink}
  803.         {Body}
  804. {/block:Reblogs}{/block:RebloggedFrom}
  805. </div>{/block:Caption}
  806. {/block:Video}
  807.  
  808. {block:IndexPage}
  809. <div class="perma"><span class="permabg"><a href="{Permalink}" target="_blank">Go to post<span class="th th-right-arrow"></span></a></span></div>
  810. {/block:IndexPage}
  811.  
  812. {block:HasTags}<div class="tags"><span style="vertical-align:bottom;margin-right:1rem;font-size:1.1rem" class="th th-bookmark-1-o"></span>{block:Tags}
  813. <a href="{TagURL}">{Tag} </a>
  814. {/block:Tags}</div>{/block:HasTags}
  815.  
  816. <!-- {block:ContentSource}{SourceURL}{block:SourceLogo}<img src="{BlackLogoURL}"width="{LogoWidth}"height="{LogoHeight}" alt="{SourceTitle}" />{/block:SourceLogo}{block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo} -->{/block:ContentSource}<!--{block:NoRebloggedFrom}{block:RebloggedFrom}{ReblogParentName}{/block:RebloggedFrom}{/block:NoRebloggedFrom} -->
  817.  
  818. </article> <!--posts-->
  819.  
  820. {block:PermalinkPage}
  821. {block:RebloggedFrom}<span class="via">
  822. via</span> <span style="font-style:italic;letter-spacing:.03rem"><a href="{ReblogParentURL}">{ReblogParentName}</a></span><br>
  823. <span class="src">src</span> <span style="font-style:italic;letter-spacing:.03rem"><a href="{ReblogRootURL}">{ReblogRootName}</a></span>
  824. {/block:RebloggedFrom}
  825. {/block:PermalinkPage}
  826.  
  827. {block:PostNotes}
  828. <div class="notes">{PostNotes}</div>
  829. {/block:PostNotes}
  830. {/block:Posts}
  831.  
  832. {block:Pagination}<div class="pagi">
  833. {block:PreviousPage}<a href="{PreviousPage}" class="jump_page">back</a>{/block:PreviousPage}
  834. {block:NextPage}<a href="{NextPage}" class="jump_page2">next</a>{/block:NextPage}</div>
  835. {/block:Pagination}
  836. <div style="clear:both"></div>
  837.  
  838. </main>
  839.  
  840. </section> <!--container-->
  841. <a href="#top" class="achl ttop">go to top</a>
  842.  
  843. <a style="position:fixed;bottom:1.3rem;right:1.3rem;font-size:15px;line-height:14px;height:14px;padding:3px;color:#555;text-align:center;letter-spacing:.7px" href="https://southcodes.tumblr.com" target="_blank" title="southcodes">sc</a>
  844.  
  845. <!-- scripts -->
  846. <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
  847. <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
  848. <script src="https://static.tumblr.com/yxfeliq/hHwojmt8m/bctphotoset.min.js"></script>
  849. <script src ="https://static.tumblr.com/fwgzvyf/Oj1o08f6h/shythemes.vr.js"></script>
  850. <script type="text/javascript">
  851.  
  852. $(document).ready(function(){
  853.      
  854.      
  855.     $('.achl').click(function(){
  856.     $('html, body').animate({
  857.     scrollTop: $( $(this).attr('href') ).offset().top
  858.     }, 450); return false;});
  859.  
  860.  $(document).scroll(function(){
  861.     if ($(this).scrollTop() > 700) {
  862.         $('.ttop').addClass('fadein');
  863.     } else {
  864.         $('.ttop').removeClass('fadein');
  865.     }
  866. });
  867.    
  868.     $(document).tooltip({track:true,position: {my: 'left+20 top+15'}})
  869.    
  870.    
  871.     $( ".th-cross-3-o" ).click(function() {
  872.       $( "#navi" ).slideToggle(400)
  873.     });
  874.    
  875.    
  876.     $('.photo-slideshow').pxuPhotoset({
  877.     lightbox: true,
  878.     rounded: false,
  879.     gutter: '2px',
  880.     borderRadius: '0px',
  881.     photoset: '.photo-slideshow',
  882.     photoWrap: '.photo-data',
  883.     photo: '.pxu-photo'});
  884.    
  885.  
  886.  
  887.     $(".audio iframe").each(function(index, elem) {elem.setAttribute("width","100%");});
  888.  
  889.  
  890.     $( ".answer span.reply:empty" ).parent().hide();
  891.    
  892.         $(".reply").each(function(){if($(this).is(":empty"))$(this).text("no answer");});
  893.  
  894.  
  895. });
  896. </script>
  897. </body>
  898. </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!