themesbyces

(Responsive) Theme — Good Omens

May 22nd, 2019 (edited)
2,298
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
CSS 34.64 KB | None | 0 0
  1. <!DOCTYPE html PUBLIC>
  2.  
  3. <meta name="viewport" content="width=device-width, initial-scale=1.0">
  4.  
  5. <html>
  6.  
  7. <head>
  8.  
  9. <title>{Title}</title>
  10.  
  11. <link rel="shortcut icon" href="{Favicon}">
  12.  
  13. <!--
  14.  
  15. theme: good omens
  16. designed and coded by ghcstfaec
  17. see credits @ https://ghcstfaec.tumblr.com/credits
  18.  
  19. -->
  20.  
  21. <!-- Metadata -->
  22.  
  23. <meta name="color:Asker Background" content="#f0f0f0"/>
  24. <meta name="color:Background" content="#ffffff"/>
  25. <meta name="color:Border" content="#d2d2d2"/>
  26. <meta name="color:Header Background" content="#f5f5f5"/>
  27. <meta name="color:Link" content="#000000"/>
  28. <meta name="color:Link Hover" content="#cfcfcf"/>
  29. <meta name="color:Like" content="#ec6363"/>
  30. <meta name="color:Main Color" content="#be8751"/>
  31. <meta name="color:Pin" content="#31a49d"/>
  32. <meta name="color:Post Background" content="#ffffff"/>
  33. <meta name="color:Question Background" content="#ffffff"/>
  34. <meta name="color:Quote Icon Color" content="#ffffff"/>
  35. <meta name="color:Scrollbar" content="#000000"/>
  36. <meta name="color:Text" content="#555555"/>
  37. <meta name="color:Tooltip Background" content="#000000"/>
  38. <meta name="color:Tooltip Color" content="#ffffff"/>
  39.  
  40. <meta name="select:Body Font" content="Karla" title="Karla"/>
  41. <meta name="select:Body Font" content="Montserrat" title="Montserrat"/>
  42. <meta name="select:Body Font" content="Muli" title="Muli"/>
  43. <meta name="select:Body Font" content="Open Sans" title="Open Sans"/>
  44. <meta name="select:Body Font" content="Poppins" title="Poppins"/>
  45. <meta name="select:Body Font" content="Raleway" title="Raleway"/>
  46. <meta name="select:Body Font" content="Work Sans" title="Work Sans"/>
  47.  
  48. <meta name="select:Body Font Size" content="1rem" title="1rem"/>
  49. <meta name="select:Body Font Size" content="0.9rem" title="0.9rem"/>
  50. <meta name="select:Body Font Size" content="0.8rem" title="0.8rem"/>
  51.  
  52. <meta name="select:Uppercase Font Size" content="0.9rem" title="0.9rem"/>
  53. <meta name="select:Uppercase Font Size" content="0.8rem" title="0.8rem"/>
  54.  
  55. <meta name="image:Background Image" content="https://i.imgur.com/EeQTDw8.png"/>
  56. <meta name="image:Icon Image" content="https://i.imgur.com/tYkfomB.png"/>
  57. <meta name="image:Mobile Header Image" content="https://i.imgur.com/EeQTDw8.png"/>
  58.  
  59. <meta name="text:Title" content="Good Omens"/>
  60.  
  61. <meta name="text:Tab 1 Title" content="Info"/>
  62. <meta name="text:Tab 2 Title" content="Ask"/>
  63. <meta name="text:Tab 3 Title" content="Explore"/>
  64. <meta name="text:Tab 4 Title" content="Updates"/>
  65.  
  66. <meta name="text:Subtitle" content="Your Smile Swallows Me Into A Sleepless Dream"/>
  67.  
  68. <meta name="text:Link 1 URL" content="/"/>
  69. <meta name="text:Link 1 Name" content="Link One"/>
  70. <meta name="text:Link 2 URL" content="/"/>
  71. <meta name="text:Link 2 Name" content="Link Two"/>
  72. <meta name="text:Link 3 URL" content="/"/>
  73. <meta name="text:Link 3 Name" content="Link Three"/>
  74. <meta name="text:Link 4 URL" content="/"/>
  75. <meta name="text:Link 4 Name" content="Link Four"/>
  76. <meta name="text:Link 5 URL" content="/"/>
  77. <meta name="text:Link 5 Name" content="Link Five"/>
  78. <meta name="text:Link 6 URL" content="/"/>
  79. <meta name="text:Link 6 Name" content="Link Six"/>
  80. <meta name="text:Link 7 URL" content="/"/>
  81. <meta name="text:Link 7 Name" content="Link Seven"/>
  82.  
  83. <meta name="text:Update Date 1" content="MM/DD/YYYY"/>
  84. <meta name="text:Update 1" content="Lorem ipsum dolor sit amet, consectetuer adipiscing elit."/>
  85. <meta name="text:Update Date 2" content="MM/DD/YYYY"/>
  86. <meta name="text:Update 2" content="Lorem ipsum dolor sit amet, consectetuer adipiscing elit."/>
  87. <meta name="text:Update Date 3" content="MM/DD/YYYY"/>
  88. <meta name="text:Update 3" content="Lorem ipsum dolor sit amet, consectetuer adipiscing elit."/>
  89.  
  90. <meta name="if:Submit Link" content="1"/>
  91.  
  92. <meta name="if:Hide Tags" content="0"/>
  93. <meta name="if:Show Tags" content="1"/>
  94.  
  95. <!-- Google Fonts Script -->
  96.  
  97. <link href="https://fonts.googleapis.com/css2?family=Karla:ital,wght@0,400;0,700;1,400;1,700&family=Montserrat:ital,wght@0,400;0,700;1,400;1,700&family=Muli:ital,wght@0,400;0,700;1,400;1,700&family=Open+Sans:ital,wght@0,400;0,700;1,400;1,700&family=Poppins:ital,wght@0,400;0,700;1,400;1,700&family=Raleway:ital,wght@0,400;0,700;1,400;1,700&family=Work+Sans:ital,wght@0,400;0,700;1,400;1,700&display=swap" rel="stylesheet">
  98.  
  99. <!-- jQuery Script -->
  100.  
  101. <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.7.1/jquery.min.js"></script>
  102.  
  103. <!-- Styled Tooltips Script -->
  104.  
  105. <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  106.  
  107. <script src="https://static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script>
  108.  
  109. <script>
  110. (function($){
  111. $(document).ready(function(){
  112. $("a[title],div[title],p[title]").style_my_tooltips({
  113. tip_follows_cursor:true,
  114. tip_delay_time:90,
  115. tip_fade_speed:600,
  116. attribute:"title"
  117. });
  118. });
  119. })(jQuery);
  120. </script>
  121.  
  122. <!-- Font Awesome Script -->
  123.  
  124. <link href="//use.fontawesome.com/releases/v6.0.0/css/all.css" rel="stylesheet">
  125.  
  126. <!--✻✻✻✻✻✻  npf audio player by @glenthemes  ✻✻✻✻✻✻-->
  127.  
  128. <script src="//tmblr-npf-audio.gitlab.io/s/init.js"></script>
  129.  
  130. <link href="//tmblr-npf-audio.gitlab.io/s/base.css" rel="stylesheet">
  131.  
  132. <script>
  133. tumblr_npf_audio({
  134. emptyTitleText: "",
  135. emptyArtistText: "",
  136. emptyAlbumText: "",
  137. titleLabel: "",    
  138. artistLabel: "",
  139. albumLabel: "",
  140. });
  141. </script>
  142.  
  143. <!-- Hide & Show Script -->
  144.  
  145. <script src="//ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
  146.  
  147. <script>
  148. $(document).ready(function(){
  149. $('.tags').hide();
  150. $('.tags-title').click(function() {
  151. $(this).closest('.entries').find('.tags').slideToggle(500);
  152. });
  153. });
  154. </script>
  155.  
  156. <script>
  157. $(document).ready(function(){
  158. $('.mobile-updates').hide();
  159. $('.mobile-updates-title').click(function() {
  160. $(this).closest('.muahi-wrapper').find('.mobile-updates').slideToggle(500);
  161. });
  162. });
  163. </script>
  164.  
  165. <!-- Unnest Captions Script -->
  166.  
  167. <script src="//code.jquery.com/jquery-2.2.4.min.js"></script>
  168.  
  169. <script src="https://static.tumblr.com/wgg6svp/OoTofxa0c/unnest.min.js"></script>
  170.  
  171. <script>
  172. $(function(){  $('.entries').unnest({
  173. yourCaption: ".text, .caption",
  174. wrapName: ".tumblr_parent",
  175. newCaptionUsername: false,
  176. originalPostCaptionUsername: false,
  177. tumblrAvatars: true,
  178. tumblrAvatarClass: ".tumblr_avatar",
  179. usernameColon: false
  180. });
  181. });
  182. </script>
  183.  
  184. <!--
  185.         NPF images fix v4.0 by @glenthemes [2023]
  186.         💌 gitlab.com/glen-npf/v4-beta
  187. --->
  188.  
  189. <link href="//glen-npf.gitlab.io/v4-beta/main.css" rel="stylesheet">
  190.  
  191. <script src="//glen-npf.gitlab.io/v4-beta/use.js"></script>
  192. <style>
  193. :root {
  194. --NPF-Images-Spacing:1px;
  195. --NPF-Caption-Spacing:1em;
  196. --NPF-Move-1st-Photoset:"no";
  197. --Text-Container-Selector:".caption";
  198. --Text-Reblogs-Selector:".tumblr_parent";
  199. }
  200. </style>
  201.  
  202. <!-- Inline Images Resizing Script -->
  203.  
  204. <script>
  205. $(".tmblr-full, figure").each(function(){
  206. var imgWidth = $(this).attr("data-orig-width"),
  207. img = $(this).find("img"),
  208. imgSrc = img.attr("src");
  209. $('figure').css({'margin-left':'0','margin-right':'0','display':'inline-block'});
  210. if (imgWidth >= 500){
  211. img.attr("src",imgSrc.replace("_500.","_1280."));
  212. $('.tmblr-full img, figure img').css({'width':'auto','height':'auto','vertical-align':'middle'});
  213. }
  214. });  
  215. </script>
  216.  
  217. <!-- PXU Script -->
  218.  
  219. <link href="https://static.tumblr.com/qudkd6d/OcDnl99gb/style.css" rel="stylesheet" type="text/css"/>
  220.  
  221. <script src="https://static.tumblr.com/qudkd6d/Az6nkemqr/pxuphotoset.min.js"></script>
  222.  
  223. <script>
  224. $(document).ready(function(){
  225. $('.photo-slideshow').pxuPhotoset({
  226. lightbox: true,
  227. rounded: false,
  228. gutter: '1px',
  229. borderRadius: '0px',
  230. photoset: '.photo-slideshow',
  231. photoWrap: '.photo-data',
  232. photo: '.pxu-photo'
  233. });
  234. });
  235. </script>
  236.  
  237. <!-- Responsive Tumblr Videos Script -->
  238.  
  239. <script src="//cdn.jsdelivr.net/gh/robinpx/tumblr@master/scripts/flexibleFrames/flexibleFrames.min.js"></script>
  240.  
  241. <script>
  242. $(document).ready(function() {
  243. flexibleFrames($(".video"));  
  244. });
  245. </script>
  246.  
  247. <style type="text/css">
  248.  
  249. .tmblr-iframe--app-cta-button {
  250. display: none!important;
  251. }
  252.  
  253. ::-webkit-scrollbar-thumb:vertical {
  254. background: {color:Scrollbar};
  255. }
  256.  
  257. ::-webkit-scrollbar {
  258. width: 1px;
  259. }
  260.  
  261. ::selection {
  262. background: {color:Main Color};
  263. color: white;
  264. }
  265.  
  266. ::-moz-selection {
  267. background: {color:Main Color};
  268. color: white;
  269. }
  270.  
  271. #s-m-t-tooltip {
  272. background: {color:Tooltip Background};
  273. border-radius: 5px;
  274. color: {color:Tooltip Color};
  275. font-size: {select:Uppercase Font Size};
  276. margin-top: 30px;
  277. padding: 5px;
  278. text-align: center;
  279. text-transform: uppercase;
  280. z-index: 999999999999999999999999999999999999;
  281. }
  282.  
  283. body {
  284. background: {color:Background};
  285. background-attachment: fixed;
  286. background-image: url('{image:Background Image}');
  287. background-repeat: repeat;
  288. color: {color:Text};
  289. cursor: url(https://i.imgur.com/lhPqll6.png), progress;
  290. font-family: '{select:Body Font}', sans-serif;
  291. font-size: {select:Body Font Size};
  292. font-style: normal;
  293. font-weight: 400;
  294. hyphens: auto;
  295. letter-spacing: 1px;
  296. margin: 0px;
  297. text-align: left;
  298. text-transform: none;
  299. word-wrap: break-word;
  300. }
  301.  
  302. a {
  303. color: {color:Link};
  304. text-decoration: none;
  305. -webkit-transition: all 0.5s ease;
  306. -moz-transition: all 0.5s ease;
  307. -o-transition: all 0.5s ease;
  308. }
  309.  
  310. a:hover {
  311. color: {color:Link Hover};
  312. }
  313.  
  314. b {
  315. font-weight: 700;
  316. }
  317.  
  318. h1 {
  319. font-size: 1.2rem;
  320. font-weight: bold;
  321. margin-block-start: 0em;
  322. text-transform: lowercase;
  323. }
  324.  
  325. h2 {
  326. font-size: 1rem;
  327. font-weight: bold;
  328. margin-block-start: 0em;
  329. }
  330.  
  331. blockquote {
  332. border-left: 1px solid {color:Border};
  333. margin: 5px;
  334. padding-left: 5px;
  335. }
  336.  
  337. blockquote img {
  338. height: auto;
  339. max-width: 100%;
  340. }
  341.  
  342. blockquote blockquote {
  343. border-left: 1px solid {color:Border};
  344. padding-left: 5px;
  345. }
  346.  
  347. pre {
  348. background: #f8f8f8;
  349. border-radius: 5px;
  350. padding: 10px;
  351. word-wrap: break-all;
  352. white-space: pre-wrap;
  353. }
  354.  
  355. #user-information {
  356. background: {color:Asker Background};
  357. border-right: 1px solid {color:Border};
  358. height: 100%;
  359. position: fixed;
  360. top: 0px;
  361. width: 300px;
  362. }
  363.  
  364. .header {
  365. align-items: center;
  366. background: {color:Header Background};
  367. border-bottom: 1px solid {color:Border};
  368. display: flex;
  369. height: 70px;
  370. padding: 20px;
  371. width: 260px;
  372. }
  373.  
  374. .icon-image {
  375. height: 70px;
  376. width: 70px;
  377. }
  378.  
  379. .icon-image img {
  380. border-radius: 100%;
  381. height: 70px;
  382. width: 70px;
  383. }
  384.  
  385. .title-name-wrapper {
  386. margin-left: 20px;
  387. width: 170px;
  388. }
  389.  
  390. .title {
  391. color: {color:Main Color};
  392. font-weight: bold;
  393. }
  394.  
  395. .name {
  396. font-style: italic;
  397. }
  398.  
  399. .tab {
  400. background: {color:Header Background};
  401. border-right: 1px solid {color:Border};
  402. font-size: 1rem;
  403. font-style: normal;
  404. font-weight: 400;
  405. height: 100%;
  406. position: fixed;
  407. text-align: center;
  408. width: 70px;
  409. }
  410.  
  411. .tab a {
  412. background: none;
  413. border: none;
  414. border-left: 3px solid transparent;
  415. color: {color:Link};
  416. display: block;
  417. padding: 15px;
  418. transition: 0.3s;
  419. }
  420.  
  421. .tab a:hover {
  422. background: {color:Asker Background};
  423. border-left: 3px solid {color:Main Color};
  424. color: {color:Main Color};
  425. }
  426.  
  427. .tab a.active {
  428. background: {color:Asker Background};
  429. border-left: 3px solid {color:Main Color};
  430. color: {color:Main Color};
  431. }
  432.  
  433. .tab-content {
  434. background: {color:Asker Background};
  435. animation: fadeEffect 1s;
  436. display: none;
  437. height: 100%;
  438. margin-left: 70px;
  439. padding: 20px;
  440. }
  441.  
  442. @-webkit-keyframes fadeEffect {
  443. from {
  444. opacity: 0;
  445. }
  446.  
  447. to {
  448. opacity: 1;
  449. }
  450. }
  451.  
  452. @keyframes fadeEffect {
  453. from {
  454. opacity: 0;
  455. }
  456.  
  457. to {
  458. opacity: 1;
  459. }
  460. }
  461.  
  462. .subtitle {
  463. color: {color:Main Color};
  464. }
  465.  
  466. .description {
  467. margin-top: 15px;
  468. }
  469.  
  470. .links {
  471. font-size: 0.9em;
  472. text-transform: uppercase;
  473. }
  474.  
  475. .links a {
  476. display: block;
  477. margin-bottom: 10px;
  478. }
  479.  
  480. .updates {
  481. margin-bottom: 20px;
  482. }
  483.  
  484. .updates-date {
  485. color: {color:Main Color};
  486. }
  487.  
  488. .updates-content {
  489. margin-top: 10px;
  490. }
  491.  
  492. #mobile-header {
  493. background: {color:Post Background};
  494. display: none;
  495. margin-bottom: 5px;
  496. position: relative;
  497. width: 100%;
  498. }
  499.  
  500. .muahi-wrapper {
  501. background: {color:Main Color};
  502. height: 200px;
  503. position: absolute;
  504. width: 150px;
  505. }
  506.  
  507. .mobile-icon-image {
  508. height: 70px;
  509. margin-left: auto;
  510. margin-right: auto;
  511. margin-top: 20px;
  512. width: 70px;
  513. }
  514.  
  515. .mobile-icon-image img {
  516. border-radius: 100%;
  517. height: 70px;
  518. width: 70px;
  519. }
  520.  
  521. .mobile-updates-title {
  522. color: {color:Post Background};
  523. margin-top: 20px;
  524. text-align: center;
  525. width: 100%;
  526. -webkit-transition: all 0.5s ease;
  527. -moz-transition: all 0.5s ease;
  528. -o-transition: all 0.5s ease;
  529. }
  530.  
  531. .mobile-updates-title:hover {
  532. color: {color:Link Hover};
  533. }
  534.  
  535. .mobile-updates {
  536. background: {color:Post Background};
  537. padding: 20px;
  538. width: 200px;
  539. }
  540.  
  541. .mobile-header-image {
  542. background-image: url('{image:Mobile Header Image}');
  543. background-repeat: repeat;
  544. height: 200px;
  545. margin-left: 150px;
  546. width: calc(100% - 150px);
  547. }
  548.  
  549. .mobile-header-content {
  550. margin-left: auto;
  551. margin-right: auto;
  552. padding: 40px;
  553. width: 500px;
  554. }
  555.  
  556. .mobile-header-title {
  557. color: {color:Main Color};
  558. display: inline-block;
  559. font-weight: bold;
  560. }
  561.  
  562. .mobile-header-name {
  563. display: inline-block;
  564. }
  565.  
  566. .mobile-header-description {
  567. margin-top: 20px;
  568. }
  569.  
  570. .mobile-header-links {
  571. font-size: 0.9em;
  572. margin: -5px;
  573. margin-top: 15px;
  574. text-transform: uppercase;
  575. }
  576.  
  577. .mobile-header-links a {
  578. display: inline-block;
  579. margin: 5px;
  580. }
  581.  
  582. #container {
  583. margin-bottom: 100px;
  584. margin-left: 301px;
  585. margin-top: 100px;
  586. width: calc(100% - 301px);
  587. }
  588.  
  589. #posts {
  590. margin-left: auto;
  591. margin-right: auto;
  592. width: 682px;
  593. }
  594.  
  595. .entries-wrapper {
  596. width: 100%;
  597. }
  598.  
  599. .entries {
  600. background: {color:Post Background};
  601. border: 1px solid {color:Border};
  602. margin-bottom: 50px;
  603. padding: 20px;
  604. width: 640px;
  605. }
  606.  
  607. .entries-icon {
  608. border-bottom: 1px solid {color:Border};
  609. color: {color:Main Color};
  610. margin-bottom: 20px;
  611. padding-bottom: 20px;
  612. }
  613.  
  614. .entries img {
  615. height: auto;
  616. min-width: auto;
  617. width: 640px;
  618. }
  619.  
  620. .npf_row img {
  621. width: 100%;
  622. }
  623.  
  624. .tmblr-full {
  625. margin-bottom: 10px;
  626. }
  627.  
  628. .npf_inst {
  629. margin-bottom: 20px;
  630. }
  631.  
  632. .npf-wrapper {
  633. margin: 0px;
  634. }
  635.  
  636. .npf-wrapper .tmblr-full {
  637. display: flex;
  638. }
  639.  
  640. .text-wrapper {
  641. margin: 0px;
  642. }
  643.  
  644. .read_more {
  645. background: {color:Main Color};
  646. border: 1px solid {color:Border};
  647. border-radius: 5px;
  648. color: white;
  649. display: inline-block;
  650. font-size: {select:Uppercase Font Size};
  651. padding: 10px;
  652. text-align: center;
  653. text-transform: uppercase;
  654. width: calc(100% - 22px);
  655. }
  656.  
  657. .read_more:hover {
  658. background: white;
  659. color: {color:Main Color};
  660. }
  661.  
  662. .vignette, #vignette {
  663. opacity: 0;
  664. }
  665.  
  666. .lightbox-image, #tumblr_lightbox img {
  667. border-radius: 0!important;
  668. box-shadow: none!important;
  669. max-width: none;
  670. }
  671.  
  672. .tmblr-lightbox, #tumblr_lightbox {
  673. background-attachment: fixed;
  674. background-image: url('https://i.imgur.com/7wF2zbK.png');
  675. background-repeat: repeat;
  676. }
  677.  
  678. .lightbox-caption, #tumblr_lightbox_caption {
  679. visibility: hidden;
  680. }
  681.  
  682. .text p {
  683. margin-top: 0px;
  684. }
  685.  
  686. .caption {
  687. margin-top: 20px;
  688. }
  689.  
  690. .caption p {
  691. margin-top: 0px;
  692. }
  693.  
  694. blockquote.tumblr_parent {
  695. border: none;
  696. border-bottom: 1px solid {color:Border};
  697. margin: 0px;
  698. margin-bottom: 20px;
  699. padding: 0px;
  700. }
  701.  
  702. blockquote.tumblr_parent:last-child {
  703. border-bottom: 0px;
  704. }
  705.  
  706. blockquote.user-reblog {
  707. border: none;
  708. margin: 0px;
  709. padding: 0px;
  710. }
  711.  
  712. .tumblr_avatar {
  713. border-radius: 100px;
  714. height: 30px!important;
  715. margin-bottom: 20px;
  716. width: 30px!important;
  717. }
  718.  
  719. .tumblr_avatar img {
  720. height: 30px;
  721. width: 30px;
  722. }
  723.  
  724. .user-image img {
  725. height: 30px;
  726. width: 30px;
  727. }
  728.  
  729. a.tumblr_blog {
  730. font-size: {select:Body Font Size};
  731. font-weight: bold;
  732. margin-top: calc((30px - {select:Body Font Size}) / 4);
  733. display: inline-block;
  734. position: absolute;
  735. margin-left: 10px;
  736. text-align: center;
  737. text-transform: lowercase;
  738. }
  739.  
  740. .ask-wrapper {
  741. width: 100%;
  742. }
  743.  
  744. .asker {
  745. background: {color:Asker Background};
  746. border: 1px solid {color:Border};
  747. padding: 20px;
  748. }
  749.  
  750. .asker-url {
  751. font-size: {select:Uppercase Font Size};
  752. text-align: center;
  753. text-transform: uppercase;
  754. }
  755.  
  756. .asker-url a {
  757. border: none;
  758. background: none;
  759. padding: 0px;
  760. }
  761.  
  762. .question {
  763. background: {color:Question Background};
  764. border: 1px solid {color:Border};
  765. border-top: none;
  766. padding: 20px;
  767. text-align: center;
  768. }
  769.  
  770. .question p {
  771. margin-block-start: 0em;
  772. }
  773.  
  774. .question p:last-of-type {
  775. margin-block-end: 0em;
  776. }
  777.  
  778. .quote {
  779. background: {color:Asker Background};
  780. font-size: {select:Uppercase Font Size};
  781. padding: 10px;
  782. text-transform: uppercase;
  783. }
  784.  
  785. .quote-icon {
  786. background: {color:Main Color};
  787. display: inline-block;
  788. color: {color:Quote Icon Color};
  789. margin: -10px;
  790. padding: 10px;
  791. }
  792.  
  793. .quote-wrapper {
  794. margin-top: 20px;
  795. width: 100%;
  796. }
  797.  
  798. .quote a.tumblr_blog {
  799. font-size: {select:Uppercase Font Size};
  800. font-weight: normal;
  801. margin-top: 0px;
  802. margin-left: 0px;
  803. display: inline-block;
  804. position: relative;
  805. text-align: center;
  806. text-transform: uppercase;
  807. }
  808.  
  809. .website {
  810. background: {color:Main Color};
  811. color: {color:Quote Icon Color};
  812. font-size: {select:Uppercase Font Size};
  813. padding: 10px;
  814. text-transform: uppercase;
  815. }
  816.  
  817. .website a {
  818. color: {color:Quote Icon Color};
  819. }
  820.  
  821. .website a:hover {
  822. color: {color:Link Hover};
  823. }
  824.  
  825. .chat {
  826. font-size: {select:Uppercase Font Size};
  827. text-transform: uppercase;
  828. }
  829.  
  830. .chat li {
  831. list-style-type: none;
  832. }
  833.  
  834. .chat li:nth-child(odd) {
  835. background: {color:Main Color};
  836. color: {color:Quote Icon Color};
  837. padding: 10px;
  838. }
  839.  
  840. .chat li:nth-child(even) {
  841. background: {color:Asker Background};
  842. color: {color:Main Color};
  843. padding: 10px;
  844. }
  845.  
  846. .audio iframe {
  847. height: 85px;
  848. width: 100%;
  849. }
  850.  
  851. /** spotify fix by glenthemes **/
  852.  
  853. iframe[src*='open.spotify.com'][src*='track'], figure[data-npf*='open.spotify.com'][data-npf*='track']{
  854. height: 85px!important;
  855. margin-bottom: 0px;
  856. }
  857.  
  858. figure {
  859. display: flex;
  860. width: 100%;
  861. }
  862.  
  863. figcaption.npf-audio-wrapper {
  864. width: 100%;
  865. }
  866.  
  867. .npf-audio-wrapper {
  868. --NPF-Audio-Buttons-Size: 1.4rem;
  869. --NPF-Audio-Buttons-Color: #555555;
  870. --NPF-Audio-Buttons-Spacing: 1.3rem;
  871. --NPF-Audio-Image-Size: 85px;
  872. --NPF-Audio-Image-Spacing: 0px;
  873. }
  874.  
  875. span.npf-audio-title {
  876. font-weight: bold;
  877. }
  878.  
  879. .npf-audio-background {
  880. background-color: #f2f2f2;
  881. padding: 1.5rem;
  882. }
  883.  
  884. video {
  885. height: auto;
  886. width: 100%;
  887. }
  888.  
  889. .source {
  890. background: {color:Asker Background};
  891. border-radius: 5px;
  892. display: inline-block;
  893. font-size: {select:Uppercase Font Size};
  894. margin-top: 10px;
  895. padding: 5px;
  896. text-transform: uppercase;
  897. }
  898.  
  899. .entries-information {
  900. border-top: 1px solid {color:Border};
  901. font-size: {select:Uppercase Font Size};
  902. margin-top: 20px;
  903. padding-top: 20px;
  904. text-transform: uppercase;
  905. }
  906.  
  907. .border {
  908. background: {color:Main Color};
  909. height: 3px;
  910. margin-top: -22px;
  911. position: absolute;
  912. width: 30px;
  913. }
  914.  
  915. .like-b {
  916. display: inline-block;
  917. margin-right: 0px;
  918. position: relative;
  919. }
  920.  
  921. .like-b .like_button iframe {
  922. bottom: 0px;
  923. left: 0px;
  924. opacity: 0;
  925. position: absolute;
  926. right: 0px;
  927. top: 0px;
  928. }
  929.  
  930. .like-b .liked + .b {
  931. color: {color:Like};
  932. }
  933.  
  934. .like-b .liked + .b:after {
  935. content: 'd';
  936. }
  937.  
  938. .tags-title a {
  939. color: {color:Link};
  940. margin-top: 20px;
  941. margin-left: auto;
  942. margin-right: auto;
  943. margin-top: 20px;
  944. text-align: center;
  945. width: 70px;
  946. -webkit-transition: all 0.5s ease;
  947. -moz-transition: all 0.5s ease;
  948. -o-transition: all 0.5s ease;
  949. }
  950.  
  951. .tags-title:hover {
  952. color: {color:Link Hover};
  953. }
  954.  
  955. .tags {
  956. margin-top: 5px;
  957. }
  958.  
  959. .tags-alternate {
  960. margin-top: 5px;
  961. }
  962.  
  963. ol.notes {
  964. font-size: {select:Uppercase Font Size};
  965. margin: -10px;
  966. margin-top: 20px;
  967. padding: 0px;
  968. text-align: left;
  969. text-transform: uppercase;
  970. }
  971.  
  972. ol.notes li {
  973. list-style-type: none;
  974. margin: 10px;
  975. }
  976.  
  977. ol.notes li.note img.avatar {
  978. border-radius: 100px;
  979. vertical-align: -4px;
  980. height: 16px;
  981. margin-right: 10px;
  982. width: 16px;
  983. }
  984.  
  985. .more_notes_link {
  986. background: {color:Main Color};
  987. border-radius: 5px;
  988. color: white;
  989. display: inline-block;
  990. padding: 5px 10px 5px 10px;
  991. text-align: center;
  992. }
  993.  
  994. .pagination {
  995. font-size: {select:Uppercase Font Size};
  996. margin-left: auto;
  997. margin-right: auto;
  998. text-transform: uppercase;
  999. width: 682px;
  1000. }
  1001.  
  1002. #credit {
  1003. bottom: 15px;
  1004. font-size: 0.7rem;
  1005. position: fixed;
  1006. right: 15px;
  1007. text-transform: uppercase;
  1008. }
  1009.  
  1010. #credit a {
  1011. color: {color:Link};
  1012. }
  1013.  
  1014. #credit a:hover {
  1015. color: {color:Link Hover};
  1016. }
  1017.  
  1018. @media only screen and (max-width: 1000px) {
  1019.    
  1020. #mobile-header {
  1021. display: block;
  1022. }
  1023.  
  1024. .mobile-header-content {
  1025. width: 400px;
  1026. }
  1027.    
  1028. #user-information {
  1029. display: none;
  1030. }
  1031.  
  1032. #container {
  1033. margin-bottom: 0px;
  1034. margin-left: 0px;
  1035. margin-top: 0px;
  1036. width: 100%;
  1037. }
  1038.  
  1039. #posts {
  1040. overflow-x: none;
  1041. width: 100%;
  1042. }
  1043.  
  1044. .entries-wrapper {
  1045. background: {color:Post Background};
  1046. margin-top: 0px;
  1047. {block:IndexPage}
  1048. margin-bottom: 10px;
  1049. {/block:IndexPage}
  1050. width: 100%;
  1051. }
  1052.  
  1053. .entries {
  1054. background: none;
  1055. border: none;
  1056. margin-bottom: 0px;
  1057. margin-left: auto;
  1058. margin-right: auto;
  1059. padding: 40px;
  1060. width: 400px;
  1061. }
  1062.  
  1063. .entries img {
  1064. max-width: 100%;
  1065. }
  1066.  
  1067. .audio iframe {
  1068. width: 400px;
  1069. }
  1070.  
  1071. figcaption.npf-audio-wrapper {
  1072. width: 400px;
  1073. }
  1074.  
  1075. .pagination {
  1076. background: none;
  1077. border: none;
  1078. margin-bottom: 0px;
  1079. margin-left: auto;
  1080. margin-right: auto;
  1081. padding: 40px;
  1082. width: 400px;
  1083. }
  1084.  
  1085. }
  1086.  
  1087. @media only screen and (max-width: 500px) {
  1088.  
  1089. #mobile-header {
  1090. display: block;
  1091. }
  1092.  
  1093. .mobile-header-content {
  1094. width: 250px;
  1095. }
  1096.    
  1097. #user-information {
  1098. display: none;
  1099. }
  1100.  
  1101. #container {
  1102. margin-bottom: 0px;
  1103. margin-left: 0px;
  1104. margin-top: 0px;
  1105. width: 100%;
  1106. }
  1107.  
  1108. #posts {
  1109. overflow-x: none;
  1110. width: 100%;
  1111. }
  1112.  
  1113. .entries-wrapper {
  1114. background: {color:Post Background};
  1115. margin-bottom: 0px;
  1116. {block:IndexPage}
  1117. margin-bottom: 10px;
  1118. {/block:IndexPage}
  1119. width: 100%;
  1120. }
  1121.  
  1122. .entries {
  1123. background: none;
  1124. border: none;
  1125. margin-bottom: 0px;
  1126. margin-left: auto;
  1127. margin-right: auto;
  1128. padding: 40px;
  1129. width: 250px;
  1130. }
  1131.  
  1132. .entries img {
  1133. max-width: 100%;
  1134. }
  1135.  
  1136. .audio iframe {
  1137. width: 250px;
  1138. }
  1139.  
  1140. figcaption.npf-audio-wrapper {
  1141. width: 250px;
  1142. }
  1143.  
  1144. .pagination {
  1145. background: none;
  1146. border: none;
  1147. margin-bottom: 0px;
  1148. margin-left: auto;
  1149. margin-right: auto;
  1150. padding: 40px;
  1151. width: 250px;
  1152. }
  1153.  
  1154. }
  1155.  
  1156. {CustomCSS}
  1157.    
  1158. </style>
  1159.    
  1160. </head>
  1161.  
  1162. <body>
  1163.  
  1164. <div id="user-information">
  1165.  
  1166. <div class="header">
  1167.  
  1168. <div class="icon-image"><img src="{image:Icon Image}"/></div>
  1169.  
  1170. <div class="title-name-wrapper">
  1171.  
  1172. <div class="title">{text:Title}</div>
  1173.  
  1174. <div class="name">@{Name}</div>
  1175.  
  1176. </div>
  1177.  
  1178. </div>
  1179.  
  1180. <div class="tab">
  1181. <center>
  1182. <a href="/" title="Home"><i class="far fa-arrow-alt-circle-left"></i></a>
  1183. <a class="tab-links" onclick="openPanel(event, 'one')" id="defaultOpen" title="{text:Tab 1 Title}"><i class="far fa-user-circle"></i></a>
  1184. {block:AskEnabled}<a class="tab-links" onclick="openPanel(event, 'two')" id="defaultOpen" title="{text:Tab 2 Title}"><i class="far fa-envelope"></i></a>{/block:AskEnabled}
  1185. {block:SubmissionsEnabled}{block:IfSubmitLink}<a href="/submit" title="Submit"><i class="fas fa-file-import"></i></a>{/block:IfSubmitLink}{/block:SubmissionsEnabled}
  1186. <a class="tab-links" onclick="openPanel(event, 'three')" id="defaultOpen" title="{text:Tab 3 Title}"><i class="fa-solid fa-list"></i></a>
  1187. <a class="tab-links" onclick="openPanel(event, 'four')" id="defaultOpen" title="{text:Tab 4 Title}"><i class="fas fa-ellipsis-h"></i></a>
  1188. <a href="/archive" title="Archive"><i class="far fa-calendar-plus"></i></a>
  1189. </center>
  1190. </div>
  1191.  
  1192. <div id="one" class="tab-content">
  1193.  
  1194. <div class="subtitle">{text:Subtitle}</div>
  1195.  
  1196. {block:Description}<div class="description">{Description}</div>{/block:Description}
  1197.  
  1198. </div>
  1199.  
  1200. {block:AskEnabled}
  1201. <div id="two" class="tab-content">
  1202.  
  1203. <iframe frameborder="0" height="200" id="ask_form" scrolling="no" src="https://www.tumblr.com/ask_form/{Name}.tumblr.com" width="100%"></iframe>
  1204.  
  1205. </div>
  1206. {/block:AskEnabled}
  1207.  
  1208. <div id="three" class="tab-content">
  1209.  
  1210. <div class="links">
  1211. {block:ifLink1URL}<a href="{text:Link 1 URL}"><i class="far fa-circle" style="color: {color:Main Color};margin-right: 10px;"></i>{text:Link 1 Name}</a>{/block:ifLink1URL}
  1212. {block:ifLink2URL}<a href="{text:Link 2 URL}"><i class="far fa-circle" style="color: {color:Main Color};margin-right: 10px;"></i>{text:Link 2 Name}</a>{/block:ifLink2URL}
  1213. {block:ifLink3URL}<a href="{text:Link 3 URL}"><i class="far fa-circle" style="color: {color:Main Color};margin-right: 10px;"></i>{text:Link 3 Name}</a>{/block:ifLink3URL}
  1214. {block:ifLink4URL}<a href="{text:Link 4 URL}"><i class="far fa-circle" style="color: {color:Main Color};margin-right: 10px;"></i>{text:Link 4 Name}</a>{/block:ifLink4URL}
  1215. {block:ifLink5URL}<a href="{text:Link 5 URL}"><i class="far fa-circle" style="color: {color:Main Color};margin-right: 10px;"></i>{text:Link 5 Name}</a>{/block:ifLink5URL}
  1216. {block:ifLink6URL}<a href="{text:Link 6 URL}"><i class="far fa-circle" style="color: {color:Main Color};margin-right: 10px;"></i>{text:Link 6 Name}</a>{/block:ifLink6URL}
  1217. {block:ifLink7URL}<a href="{text:Link 7 URL}"><i class="far fa-circle" style="color: {color:Main Color};margin-right: 10px;"></i>{text:Link 7 Name}</a>{/block:ifLink7URL}
  1218. </div>
  1219.  
  1220. </div>
  1221.  
  1222. <div id="four" class="tab-content">
  1223.  
  1224. {block:ifUpdate1}
  1225. <div class="updates">
  1226. <div class="updates-date">{text:Update Date 1}</div>
  1227. <div class="updates-content">{text:Update 1}</div>
  1228. </div>
  1229. {block:ifUpdate1}
  1230.  
  1231. {block:ifUpdate2}
  1232. <div class="updates">
  1233. <div class="updates-date">{text:Update Date 2}</div>
  1234. <div class="updates-content">{text:Update 2}</div>
  1235. </div>
  1236. {block:ifUpdate2}
  1237.  
  1238. {block:ifUpdate3}
  1239. <div class="updates">
  1240. <div class="updates-date">{text:Update Date 3}</div>
  1241. <div class="updates-content">{text:Update 3}</div>
  1242. </div>
  1243. {block:ifUpdate3}
  1244.  
  1245. </div>
  1246.  
  1247. </div>
  1248.  
  1249. <div id="mobile-header">
  1250.  
  1251. <div class="muahi-wrapper">
  1252.  
  1253. <div class="mobile-icon-image"><img src="{image:Icon Image}"/></div>
  1254.  
  1255. <p class="mobile-updates-title" title="{text:Tab 4 Title}"><i class="fas fa-ellipsis-h"></i></p>
  1256.  
  1257. <div class="mobile-updates">
  1258. {block:ifUpdate1}
  1259. <div class="updates">
  1260. <div class="updates-date">{text:Update Date 1}</div>
  1261. <div class="updates-content">{text:Update 1}</div>
  1262. </div>
  1263. {block:ifUpdate1}
  1264.  
  1265. {block:ifUpdate2}
  1266. <div class="updates">
  1267. <div class="updates-date">{text:Update Date 2}</div>
  1268. <div class="updates-content">{text:Update 2}</div>
  1269. </div>
  1270. {block:ifUpdate2}
  1271.  
  1272. {block:ifUpdate3}
  1273. <div class="updates">
  1274. <div class="updates-date">{text:Update Date 3}</div>
  1275. <div class="updates-content">{text:Update 3}</div>
  1276. </div>
  1277. {block:ifUpdate3}
  1278. </div>
  1279.  
  1280. </div>
  1281.  
  1282. <div class="mobile-header-image"></div>
  1283.  
  1284. <div class="mobile-header-content">
  1285.  
  1286. <div class="mobile-header-name">
  1287.  
  1288. <div class="mobile-header-title">{text:Title}</div>
  1289.  
  1290. @{Name}
  1291.    
  1292. </div>
  1293.  
  1294. {block:Description}<div class="mobile-header-description">{Description}</div>{/block:Description}
  1295.  
  1296. <div class="mobile-header-links">
  1297. <a href="/"><i class="far fa-arrow-alt-circle-left" style="color: {color:Main Color};margin-right: 10px;"></i>Home</a>
  1298. {block:AskEnabled}<a href="/ask"><i class="far fa-envelope" style="color: {color:Main Color};margin-right: 10px;"></i>Ask</a>{/block:AskEnabled}
  1299. {block:SubmissionsEnabled}{block:IfSubmitLink}<a href="/submit"><i class="fas fa-file-import" style="color: {color:Main Color};margin-right: 10px;"></i>Submit</a>{/block:IfSubmitLink}{/block:SubmissionsEnabled}
  1300. {block:ifLink1URL}<a href="{text:Link 1 URL}"><i class="far fa-circle" style="color: {color:Main Color};margin-right: 10px;"></i>{text:Link 1 Name}</a>{/block:ifLink1URL}
  1301. {block:ifLink2URL}<a href="{text:Link 2 URL}"><i class="far fa-circle" style="color: {color:Main Color};margin-right: 10px;"></i>{text:Link 2 Name}</a>{/block:ifLink2URL}
  1302. {block:ifLink3URL}<a href="{text:Link 3 URL}"><i class="far fa-circle" style="color: {color:Main Color};margin-right: 10px;"></i>{text:Link 3 Name}</a>{/block:ifLink3URL}
  1303. {block:ifLink4URL}<a href="{text:Link 4 URL}"><i class="far fa-circle" style="color: {color:Main Color};margin-right: 10px;"></i>{text:Link 4 Name}</a>{/block:ifLink4URL}
  1304. {block:ifLink5URL}<a href="{text:Link 5 URL}"><i class="far fa-circle" style="color: {color:Main Color};margin-right: 10px;"></i>{text:Link 5 Name}</a>{/block:ifLink5URL}
  1305. {block:ifLink6URL}<a href="{text:Link 6 URL}"><i class="far fa-circle" style="color: {color:Main Color};margin-right: 10px;"></i>{text:Link 6 Name}</a>{/block:ifLink6URL}
  1306. {block:ifLink7URL}<a href="{text:Link 7 URL}"><i class="far fa-circle" style="color: {color:Main Color};margin-right: 10px;"></i>{text:Link 7 Name}</a>{/block:ifLink7URL}
  1307. <a href="/archive"><i class="far fa-calendar-plus" style="color: {color:Main Color};margin-right: 10px;"></i>Archive</a>
  1308. </div>
  1309.    
  1310. </div>
  1311.  
  1312. </div>
  1313.  
  1314. <div id="container">
  1315.  
  1316. <div id="posts">
  1317.  
  1318. {block:Posts}
  1319.  
  1320. <div class="entries-wrapper">
  1321.  
  1322. <div class="entries" id="{PostID}" post-type="{PostType}">
  1323.  
  1324. {block:Text}
  1325. {block:NotReblog}
  1326. <div class="entries-icon"><i class="far fa-file-alt"></i></div>
  1327. <div class="npf-wrapper">
  1328. {block:Title}
  1329. <h1>{Title}</h1>
  1330. {/block:Title}
  1331. {Body}
  1332. </div>
  1333. {/block:NotReblog}
  1334. {block:RebloggedFrom}
  1335. <div class="entries-icon"><i class="far fa-file-alt"></i></div>
  1336. <div class="text-wrapper">
  1337. {block:Title}
  1338. <h1>{Title}</h1>
  1339. {/block:Title}
  1340. <div class="text">
  1341. {Body}
  1342. </div>
  1343. </div>
  1344. {/block:RebloggedFrom}
  1345. {/block:Text}
  1346.  
  1347. {block:Answer}
  1348. <div class="entries-icon"><i class="far fa-envelope"></i></div>
  1349. <div class="ask-wrapper">
  1350. <div class="asker">
  1351. <div class="asker-url">
  1352. <i class="far fa-question-circle" style="background: {color:Main Color};border-radius: 100px;color: {color:Post Background};font-size: 0.9rem;padding: 10px;width: 0.9rem;"></i>
  1353. <br><br>
  1354. A Message From <a href="{AskerURL}">{Asker}</a>
  1355. </div>
  1356. </div>
  1357. <div class="question">
  1358. {Question}
  1359. </div>
  1360. </div>
  1361. <div class="caption">
  1362. {Answer}
  1363. </div>
  1364. {/block:Answer}
  1365.  
  1366. {block:Quote}
  1367. <div class="entries-icon"><i class="fas fa-quote-left"></i></div>
  1368. <div class="quote">
  1369. <div class="quote-icon"><i class="fas fa-quote-left"></i></div>
  1370. <div class="quote-wrapper">
  1371. "{Quote}</i>" {block:Source}— {Source}{/block:Source}
  1372. </div>
  1373. </div>
  1374. {/block:Quote}
  1375.  
  1376. {block:Link}
  1377. <div class="entries-icon"><i class="fas fa-globe-americas"></i></div>
  1378. {block:Thumbnail}
  1379. <img src="{Thumbnail}" style="margin-bottom: 10px;"/>
  1380. {/block:Thumbnail}
  1381. <div class="website"><i class="fas fa-external-link-alt" style="margin-right: 10px;"></i><a href="{URL}" target="_blank">{Name}{block:Excerpt}<br><br>{Excerpt}{/block:Excerpt}
  1382. </a></div>
  1383. {block:Description}
  1384. <div class="caption">
  1385. {Description}
  1386. </div>
  1387. {/block:Description}
  1388. {/block:Link}
  1389.  
  1390. {block:Chat}
  1391. <div class="entries-icon"><i class="far fa-comment"></i></div>
  1392. <div class="chat">
  1393. {block:Title}
  1394. <h1>{Title}</h1>
  1395. {/block:Title}
  1396. {block:Lines}
  1397. <li>{block:Label}{Label}{/block:Label}
  1398. {Line}
  1399. </li>
  1400. {/block:Lines}
  1401. </div>
  1402. {/block:Chat}
  1403.  
  1404. {block:Audio}
  1405. <div class="entries-icon"><i class="fas fa-music"></i></div>
  1406. <div class="audio">
  1407. {AudioEmbed}
  1408. </div>
  1409. {block:Caption}
  1410. <div class="caption">{Caption}</div>
  1411. {/block:Caption}
  1412. {/block:Audio}
  1413.  
  1414. {block:Photo}
  1415. <div class="entries-icon"><i class="fas fa-image"></i></div>
  1416. <a href="#" onclick="Tumblr.Lightbox.init([{ width: {PhotoWidth-HighRes}, height: {PhotoHeight-HighRes}, low_res: '{PhotoURL-HighRes}', high_res: '{PhotoURL-HighRes}' }]); $('body').toggleClass('tumblr_lightbox_active'); return false"><img src="{PhotoURL-HighRes}"></a>
  1417. {block:Caption}
  1418. <div class="text-wrapper">
  1419. <div class="caption">{Caption}</div>
  1420. </div>
  1421. {/block:Caption}
  1422. {/block:Photo}
  1423.  
  1424. {block:Photoset}
  1425. <div class="entries-icon"><i class="fas fa-images"></i></div>
  1426. <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>
  1427. {block:Caption}
  1428. <div class="text-wrapper">
  1429. <div class="caption">{Caption}</div>
  1430. </div>
  1431. {/block:Caption}
  1432. {/block:Photoset}
  1433.  
  1434. {block:Video}
  1435. <div class="entries-icon"><i class="fas fa-video"></i></div>
  1436. <div class="video">
  1437. {Video-500}
  1438. </div>
  1439. {block:Caption}
  1440. <div class="caption">{Caption}</div>
  1441. {/block:Caption}
  1442. {/block:Video}
  1443.  
  1444. {block:ContentSource}
  1445. <div class="source">
  1446. <i class="fas fa-paper-plane" style="color: {color:Main Color};margin-right: 5px;"></i><a href="{SourceURL}" title="{SourceTitle}">Source</a>
  1447. </div>
  1448. {/block:ContentSource}
  1449.  
  1450. {block:Date}
  1451. <div class="entries-information">
  1452. <div class="border"></div>
  1453. {block:PinnedPostLabel}
  1454. <font style="color: {color:Pin};"><i class="fas fa-thumbtack" style="margin-right: 5px;"></i>{PinnedPostLabel}</font>
  1455. <font style="color: {color:Main Color};margin-left: 5px;margin-right: 5px;">•</font>
  1456. {/block:PinnedPostLabel}
  1457. {block:NoteCount}<a href="{Permalink}">{NoteCountWithLabel}</a>
  1458. <font style="color: {color:Main Color};margin-left: 5px;margin-right: 5px;">•</font>{/block:NoteCount}
  1459. <a href="{Permalink}">{DayOfMonth} {ShortMonth} {Year}</a>
  1460. <font style="color: {color:Main Color};margin-left: 5px;margin-right: 5px;">•</font>
  1461. {block:RebloggedFrom} <a href="{ReblogParentURL}">Via</a> / {/block:RebloggedFrom}  
  1462. {block:ContentSource}{block:RebloggedFrom} <a href="{ReblogRootURL}">Source</a> / {/block:RebloggedFrom}{/block:ContentSource}
  1463. <a class="like-b" href="#">{LikeButton}<div class="b">Like</div></a> Or <a href="{ReblogURL}" target="_blank">Reblog</a>
  1464. {block:IfHideTags}
  1465. {block:HasTags}
  1466. <font style="color: {color:Main Color};margin-left: 5px;margin-right: 5px;">•</font>
  1467. <a class="tags-title">Show Tags</a>
  1468. <div class="tags">
  1469. {block:Tags}
  1470. <a href="{TagURL}" style="margin-right: 5px;"><font style="color: {color:Main Color};margin-right: 5px;">•</font>{Tag}</a>
  1471. {/block:Tags}
  1472. </div>
  1473. {/block:HasTags}
  1474. {/block:IfHideTags}
  1475. {block:IfShowTags}
  1476. {block:HasTags}
  1477. <div class="tags-alternate">
  1478. {block:Tags}
  1479. <a href="{TagURL}" style="margin-right: 5px;"><font style="color: {color:Main Color};margin-right: 5px;">•</font>{Tag}</a>
  1480. {/block:Tags}
  1481. </div>
  1482. {/block:HasTags}
  1483. {/block:IfShowTags}
  1484. {block:PostNotes}
  1485. {PostNotes}
  1486. {/block:PostNotes}
  1487. </div>
  1488. {/block:Date}
  1489.  
  1490. </div>
  1491.  
  1492. </div>
  1493.  
  1494. {/block:Posts}
  1495.  
  1496. </div>
  1497.  
  1498. {block:Pagination}
  1499. <div class="entries-wrapper">
  1500. <div class="pagination">
  1501. {CurrentPage} Out Of {TotalPages}
  1502. <font style="float:right;">
  1503. {block:PreviousPage}
  1504. <a href="{PreviousPage}">Previous</a>
  1505. {/block:PreviousPage}
  1506. {block:NextPage}
  1507. Or <a href="{NextPage}">Next</a>
  1508. {/block:NextPage}
  1509. </font>
  1510. </div>
  1511. </div>
  1512. {/block:Pagination}
  1513.  
  1514. </div>
  1515.  
  1516. <div id="credit"><a href="http://ghcstfaec.tumblr.com/" title="ghcstfaec" target="_blank">GHCST</a></div>
  1517.  
  1518. </body>
  1519.  
  1520. <!-- Tabs Script -->
  1521.  
  1522. <script>
  1523. function openPanel(evt, number) {
  1524. var i, tabcontent, tablinks;
  1525. tabcontent = document.getElementsByClassName("tab-content");
  1526. for (i = 0; i < tabcontent.length; i++) {
  1527. tabcontent[i].style.display = "none";
  1528. }
  1529. tablinks = document.getElementsByClassName("tab-links");
  1530. for (i = 0; i < tablinks.length; i++) {
  1531. tablinks[i].className = tablinks[i].className.replace(" active", "");
  1532. }
  1533. document.getElementById(number).style.display = "block";
  1534. evt.currentTarget.className += " active";
  1535. }
  1536. document.getElementById("defaultOpen").click();
  1537. </script>
  1538.  
  1539. </html>
Advertisement
Add Comment
Please, Sign In to add comment