themesbyces

Theme — Burning

Jul 31st, 2020 (edited)
2,761
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
CSS 26.87 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: burning
  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:Link" content="#000000"/>
  27. <meta name="color:Link Hover" content="#cfcfcf"/>
  28. <meta name="color:Like" content="#ec6363"/>
  29. <meta name="color:Main Color" content="#ddaa99"/>
  30. <meta name="color:Pin" content="#31a49d"/>
  31. <meta name="color:Post Background" content="#ffffff"/>
  32. <meta name="color:Question Background" content="#ffffff"/>
  33. <meta name="color:Quote Icon Color" content="#ffffff"/>
  34. <meta name="color:Scrollbar" content="#000000"/>
  35. <meta name="color:Text" content="#555555"/>
  36. <meta name="color:Tooltip Background" content="#000000"/>
  37. <meta name="color:Tooltip Color" content="#ffffff"/>
  38.  
  39. <meta name="select:Body Font" content="Karla" title="Karla"/>
  40. <meta name="select:Body Font" content="Montserrat" title="Montserrat"/>
  41. <meta name="select:Body Font" content="Muli" title="Muli"/>
  42. <meta name="select:Body Font" content="Open Sans" title="Open Sans"/>
  43. <meta name="select:Body Font" content="Poppins" title="Poppins"/>
  44. <meta name="select:Body Font" content="Raleway" title="Raleway"/>
  45. <meta name="select:Body Font" content="Work Sans" title="Work Sans"/>
  46.  
  47. <meta name="select:Body Font Size" content="1rem" title="1rem"/>
  48. <meta name="select:Body Font Size" content="0.9rem" title="0.9rem"/>
  49. <meta name="select:Body Font Size" content="0.8rem" title="0.8rem"/>
  50.  
  51. <meta name="select:Uppercase Font Size" content="0.9rem" title="0.9rem"/>
  52. <meta name="select:Uppercase Font Size" content="0.8rem" title="0.8rem"/>
  53.  
  54. <meta name="image:Background Image" content="https://i.imgur.com/aD2oyjw.png"/>
  55. <meta name="image:Sidebar Image" content="https://i.imgur.com/56ho3vw.png"/>
  56.  
  57. <meta name="text:Title" content="Burning"/>
  58.  
  59. <meta name="text:Link 1 URL" content="/"/>
  60. <meta name="text:Link 1 Name" content="Link One"/>
  61. <meta name="text:Link 2 URL" content="/"/>
  62. <meta name="text:Link 2 Name" content="Link Two"/>
  63. <meta name="text:Link 3 URL" content="/"/>
  64. <meta name="text:Link 3 Name" content="Link Three"/>
  65. <meta name="text:Link 4 URL" content="/"/>
  66. <meta name="text:Link 4 Name" content="Link Four"/>
  67. <meta name="text:Link 5 URL" content="/"/>
  68. <meta name="text:Link 5 Name" content="Link Five"/>
  69.  
  70. <meta name="if:Submit Link" content="1"/>
  71.  
  72. <meta name="if:Hide Tags" content="0"/>
  73. <meta name="if:Show Tags" content="1"/>
  74.  
  75. <!-- Google Fonts Script -->
  76.  
  77. <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;0,800;1,400;1,700;1,800&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">
  78.  
  79. <!-- jQuery Script -->
  80.  
  81. <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.7.1/jquery.min.js"></script>
  82.  
  83. <!-- Styled Tooltips Script -->
  84.  
  85. <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  86.  
  87. <script src="https://static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script>
  88.  
  89. <script>
  90. (function($){
  91. $(document).ready(function(){
  92. $("a[title], button[title]").style_my_tooltips({
  93. tip_follows_cursor:true,
  94. tip_delay_time:90,
  95. tip_fade_speed:600,
  96. attribute:"title"
  97. });
  98. });
  99. })(jQuery);
  100. </script>
  101.  
  102. <!-- Font Awesome Script -->
  103.  
  104. <link href="//use.fontawesome.com/releases/v6.0.0/css/all.css" rel="stylesheet">
  105.  
  106. <!-- Search Bar Script -->
  107.  
  108. <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
  109.  
  110. <script>
  111. $(document).ready(function(){
  112. $('.search').submit(function(event){
  113. var value = $('input:first').val();
  114. location.replace('http://{Name}.tumblr.com/tagged/' + value);
  115. });
  116. });
  117. </script>
  118.  
  119. <!-- Hide & Show Script -->
  120.  
  121. <script src="//ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
  122.  
  123. <script>
  124. $(document).ready(function(){
  125. $('.tags').hide();
  126. $('.tags-title').click(function() {
  127. $(this).closest('.entries').find('.tags').slideToggle(500);
  128. });
  129. });
  130. </script>
  131.  
  132. <!--✻✻✻✻✻✻  npf audio player by @glenthemes  ✻✻✻✻✻✻-->
  133.  
  134. <script src="//tmblr-npf-audio.gitlab.io/s/init.js"></script>
  135.  
  136. <link href="//tmblr-npf-audio.gitlab.io/s/base.css" rel="stylesheet">
  137.  
  138. <script>
  139. tumblr_npf_audio({
  140. emptyTitleText: "",
  141. emptyArtistText: "",
  142. emptyAlbumText: "",
  143. titleLabel: "",    
  144. artistLabel: "",
  145. albumLabel: "",
  146. });
  147. </script>
  148.  
  149. <!-- Unnest Captions Script -->
  150.  
  151. <script src="//code.jquery.com/jquery-2.2.4.min.js"></script>
  152.  
  153. <script src="https://static.tumblr.com/wgg6svp/OoTofxa0c/unnest.min.js"></script>
  154.  
  155. <script>
  156. $(function(){  $('.entries').unnest({
  157. yourCaption: ".text, .caption",
  158. wrapName: ".tumblr_parent",
  159. newCaptionUsername: false,
  160. originalPostCaptionUsername: false,
  161. tumblrAvatars: true,
  162. tumblrAvatarClass: ".tumblr_avatar",
  163. usernameColon: false
  164. });
  165. });
  166. </script>
  167.  
  168. <!--
  169.         NPF images fix v4.0 by @glenthemes [2023]
  170.         💌 gitlab.com/glen-npf/v4-beta
  171. --->
  172.  
  173. <link href="//glen-npf.gitlab.io/v4-beta/main.css" rel="stylesheet">
  174.  
  175. <script src="//glen-npf.gitlab.io/v4-beta/use.js"></script>
  176. <style>
  177. :root {
  178. --NPF-Images-Spacing:1px;
  179. --NPF-Caption-Spacing:1em;
  180. --NPF-Move-1st-Photoset:"no";
  181. --Text-Container-Selector:".caption";
  182. --Text-Reblogs-Selector:".tumblr_parent";
  183. }
  184. </style>
  185.  
  186. <!-- Inline Images Resizing Script -->
  187.  
  188. <script>
  189. $(".tmblr-full, figure").each(function(){
  190. var imgWidth = $(this).attr("data-orig-width"),
  191. img = $(this).find("img"),
  192. imgSrc = img.attr("src");
  193. $('figure').css({'margin-left':'0','margin-right':'0','display':'inline-block'});
  194. if (imgWidth >= 500){
  195. img.attr("src",imgSrc.replace("_500.","_1280."));
  196. $('.tmblr-full img, figure img').css({'width':'auto','height':'auto','vertical-align':'middle'});
  197. }
  198. });  
  199. </script>
  200.  
  201. <!-- PXU Script -->
  202.  
  203. <link href="https://static.tumblr.com/qudkd6d/OcDnl99gb/style.css" rel="stylesheet" type="text/css"/>
  204.  
  205. <script src="https://static.tumblr.com/qudkd6d/Az6nkemqr/pxuphotoset.min.js"></script>
  206.  
  207. <script>
  208. $(document).ready(function(){
  209. $('.photo-slideshow').pxuPhotoset({
  210. lightbox: true,
  211. rounded: false,
  212. gutter: '1px',
  213. borderRadius: '0px',
  214. photoset: '.photo-slideshow',
  215. photoWrap: '.photo-data',
  216. photo: '.pxu-photo'
  217. });
  218. });
  219. </script>
  220.  
  221. <!-- Responsive Tumblr Videos Script -->
  222.  
  223. <script src="//cdn.jsdelivr.net/gh/robinpx/tumblr@master/scripts/flexibleFrames/flexibleFrames.min.js"></script>
  224.  
  225. <script>
  226. $(document).ready(function() {
  227. flexibleFrames($(".video"));  
  228. });
  229. </script>
  230.  
  231. <style type="text/css">
  232.  
  233. .tmblr-iframe--app-cta-button {
  234. display: none!important;
  235. }
  236.  
  237. ::-webkit-scrollbar-thumb:vertical {
  238. background: {color:Scrollbar};
  239. }
  240.  
  241. ::-webkit-scrollbar {
  242. width: 1px;
  243. }
  244.  
  245. ::selection {
  246. background: {color:Main Color};
  247. color: white;
  248. }
  249.  
  250. ::-moz-selection {
  251. background: {color:Main Color};
  252. color: white;
  253. }
  254.  
  255. #s-m-t-tooltip {
  256. background: {color:Tooltip Background};
  257. border-radius: 5px;
  258. color: {color:Tooltip Color};
  259. font-size: {select:Uppercase Font Size};
  260. margin-top: 30px;
  261. padding: 5px;
  262. text-align: center;
  263. text-transform: uppercase;
  264. z-index: 999999999999999999999999999999999999;
  265. }
  266.  
  267. body {
  268. background: {color:Background};
  269. background-attachment: fixed;
  270. background-image: url('{image:Background Image}');
  271. background-repeat: repeat;
  272. color: {color:Text};
  273. cursor: url(https://i.imgur.com/lhPqll6.png), progress;
  274. font-family: '{select:Body Font}', sans-serif;
  275. font-size: {select:Body Font Size};
  276. font-style: normal;
  277. font-weight: 400;
  278. hyphens: auto;
  279. letter-spacing: 1px;
  280. margin: 0px;
  281. text-align: left;
  282. text-transform: none;
  283. word-wrap: break-word;
  284. }
  285.  
  286. a {
  287. color: {color:Link};
  288. text-decoration: none;
  289. -webkit-transition: all 0.5s ease;
  290. -moz-transition: all 0.5s ease;
  291. -o-transition: all 0.5s ease;
  292. }
  293.  
  294. a:hover {
  295. color: {color:Link Hover};
  296. }
  297.  
  298. b {
  299. font-weight: 700;
  300. }
  301.  
  302. h1 {
  303. font-size: 1.2rem;
  304. font-weight: bold;
  305. margin-block-start: 0em;
  306. text-transform: lowercase;
  307. }
  308.  
  309. h2 {
  310. font-size: 1rem;
  311. font-weight: bold;
  312. margin-block-start: 0em;
  313. }
  314.  
  315. blockquote {
  316. border-left: 1px solid {color:Border};
  317. margin: 5px;
  318. padding-left: 5px;
  319. }
  320.  
  321. blockquote img {
  322. height: auto;
  323. max-width: 100%;
  324. }
  325.  
  326. blockquote blockquote {
  327. border-left: 1px solid {color:Border};
  328. padding-left: 5px;
  329. }
  330.  
  331. pre {
  332. background: #f8f8f8;
  333. border-radius: 5px;
  334. padding: 10px;
  335. word-wrap: break-all;
  336. white-space: pre-wrap;
  337. }
  338.  
  339. #user-information {
  340. background-image: url("{image:Sidebar Image}");
  341. background-position: center;
  342. background-repeat: no-repeat;
  343. background-size: cover;
  344. border-right: 1px solid {color:Border};
  345. height: 100%;
  346. left: 0px;
  347. top: 0px;
  348. position: fixed;
  349. width: 320px;
  350. z-index: 1;
  351. }
  352.  
  353. .td-wrapper {
  354. background: rgba({RGBcolor:Background}, 0.9);
  355. border-top: 1px solid {color:Border};
  356. border-top-left-radius: 15px;
  357. border-top-right-radius: 15px;
  358. bottom: 0px;
  359. padding: 20px;
  360. position: fixed;
  361. width: 280px;
  362. }
  363.  
  364. .title {
  365. color: {color:Main Color};
  366. font-family: 'Poppins', sans-serif;
  367. font-size: 1.2rem;
  368. font-weight: 800;
  369. text-transform: lowercase;
  370. }
  371.  
  372. .description {
  373. font-size: {select:Uppercase Font Size};
  374. margin-top: 15px;
  375. text-transform: uppercase;
  376. }
  377.  
  378. .hns-wrapper {
  379. margin-top: 15px;
  380. display: flex;
  381. align-items: center;
  382. width: 280px;
  383. }
  384.  
  385. .home {
  386. position: absolute;
  387. width: 34.8px;
  388. }
  389.  
  390. #navigation {
  391. background: none;
  392. border: 1px solid {color:Border};
  393. border-radius: 100px;
  394. display: inline-block;
  395. margin: 0px;
  396. margin-left: 44.8px;
  397. outline: none;
  398. padding: 0px;
  399. width: 34.8px;
  400. z-index: 1;
  401. }
  402.  
  403. .modal {
  404. animation-duration: 0.5s;
  405. animation-name: animatetop;
  406. display: none;
  407. height: 100%;
  408. left: 0px;
  409. overflow: auto;
  410. position: fixed;
  411. top: 0px;
  412. width: 100%;
  413. z-index: 1;
  414. }
  415.  
  416. .modal-content {
  417. background: {color:Post Background};
  418. border: 1px solid {color:Border};
  419. border-radius: 5px;
  420. bottom: 77px;
  421. margin-left: 20px;
  422. position: fixed;
  423. width: 278px;
  424. }
  425.  
  426. .links {
  427. font-size: {select:Uppercase Font Size};
  428. text-transform: uppercase;
  429. }
  430.  
  431. .links a {
  432. border-bottom: 1px solid {color:Border};
  433. display: block;
  434. padding: 10px;
  435. }
  436.  
  437. .links a:last-child {
  438. border-bottom: none;
  439. }
  440.  
  441. @keyframes animatetop {
  442.  
  443. from {
  444. opacity: 0;
  445. }
  446.  
  447. to {
  448. top: 0px;
  449. opacity: 1;
  450. }
  451.  
  452. }
  453.  
  454. .search-wrapper {
  455. background: {color:Post Background};
  456. border: 1px solid {color:Border};
  457. border-radius: 100px;
  458. margin-left: 10px;
  459. width: 188px;
  460. }
  461.  
  462. .search  {
  463. border: none;
  464. display: inline-block;
  465. margin-bottom: 0px;
  466. padding: 0px;
  467. position: relative;
  468. width: calc(100% - 54.39px);
  469. }
  470.  
  471. .query {
  472. background: none;
  473. border: none;
  474. color: {color:Text};
  475. font-family: '{select:Body Font}', sans-serif;
  476. font-size: {select:Uppercase Font Size};
  477. letter-spacing: 1px;
  478. padding: 0px;
  479. text-align: left;
  480. text-transform: uppercase;
  481. outline: 0;
  482. width: 100%;
  483. }
  484.  
  485. #container {
  486. margin-left: 321px;
  487. width: calc(100% - 321px);
  488. }
  489.  
  490. #posts {
  491. margin-bottom: 100px;
  492. margin-left: auto;
  493. margin-right: auto;
  494. margin-top: 100px;
  495. width: 542px;
  496. }
  497.  
  498. .entries {
  499. background: {color:Post Background};
  500. border: 1px solid {color:Border};
  501. border-radius: 5px;
  502. margin-bottom: 50px;
  503. padding: 20px;
  504. width: 500px;
  505. }
  506.  
  507. .entries img {
  508. height: auto;
  509. max-width: 100%;
  510. }
  511.  
  512. .npf_row img {
  513. width: 100%;
  514. }
  515.  
  516. .tmblr-full {
  517. margin-bottom: 10px;
  518. }
  519.  
  520. .npf_inst {
  521. margin-bottom: 20px;
  522. }
  523.  
  524. .npf-wrapper {
  525. margin: 0px;
  526. }
  527.  
  528. .npf-wrapper .tmblr-full {
  529. display: flex;
  530. }
  531.  
  532. .text-wrapper {
  533. margin: 0px;
  534. }
  535.  
  536. .read_more {
  537. background: {color:Main Color};
  538. border: 1px solid {color:Border};
  539. border-radius: 5px;
  540. color: white;
  541. display: inline-block;
  542. font-size: {select:Uppercase Font Size};
  543. padding: 10px;
  544. text-align: center;
  545. text-transform: uppercase;
  546. width: calc(100% - 22px);
  547. }
  548.  
  549. .read_more:hover {
  550. background: white;
  551. color: {color:Main Color};
  552. }
  553.  
  554. .vignette, #vignette {
  555. opacity: 0;
  556. }
  557.  
  558. .lightbox-image, #tumblr_lightbox img {
  559. border-radius: 0!important;
  560. box-shadow: none!important;
  561. max-width: none;
  562. }
  563.  
  564. .tmblr-lightbox, #tumblr_lightbox {
  565. background-attachment: fixed;
  566. background-image: url('https://i.imgur.com/7wF2zbK.png');
  567. background-repeat: repeat;
  568. }
  569.  
  570. .lightbox-caption, #tumblr_lightbox_caption {
  571. visibility: hidden;
  572. }
  573.  
  574. .text p {
  575. margin-top: 0px;
  576. }
  577.  
  578. .caption {
  579. margin-top: 20px;
  580. }
  581.  
  582. .caption p {
  583. margin-top: 0px;
  584. }
  585.  
  586. blockquote.tumblr_parent {
  587. border: none;
  588. border-bottom: 1px solid {color:Border};
  589. margin: 0px;
  590. margin-bottom: 20px;
  591. padding: 0px;
  592. }
  593.  
  594. blockquote.tumblr_parent:last-child {
  595. border-bottom: 0px;
  596. }
  597.  
  598. blockquote.user-reblog {
  599. border: none;
  600. margin: 0px;
  601. padding: 0px;
  602. }
  603.  
  604. .tumblr_avatar {
  605. border-radius: 100px;
  606. height: 30px;
  607. margin-bottom: 20px;
  608. width: 30px;
  609. }
  610.  
  611. .tumblr_avatar img {
  612. height: 30px;
  613. width: 30px;
  614. }
  615.  
  616. .user-image img {
  617. height: 30px;
  618. width: 30px;
  619. }
  620.  
  621. a.tumblr_blog {
  622. font-size: {select:Body Font Size};
  623. font-weight: bold;
  624. margin-top: calc((30px - {select:Body Font Size}) / 4);
  625. display: inline-block;
  626. position: absolute;
  627. margin-left: 10px;
  628. text-align: center;
  629. text-transform: lowercase;
  630. }
  631.  
  632. .ask-wrapper {
  633. width: 100%;
  634. }
  635.  
  636. .asker {
  637. background: {color:Asker Background};
  638. border: 1px solid {color:Border};
  639. padding: 20px;
  640. }
  641.  
  642. .asker-url {
  643. font-size: {select:Uppercase Font Size};
  644. text-align: center;
  645. text-transform: uppercase;
  646. }
  647.  
  648. .asker-url a {
  649. border: none;
  650. background: none;
  651. padding: 0px;
  652. }
  653.  
  654. .question {
  655. background: {color:Question Background};
  656. border: 1px solid {color:Border};
  657. border-top: none;
  658. padding: 20px;
  659. text-align: center;
  660. }
  661.  
  662. .question p {
  663. margin-block-start: 0em;
  664. }
  665.  
  666. .question p:last-of-type {
  667. margin-block-end: 0em;
  668. }
  669.  
  670. .quote {
  671. background: {color:Asker Background};
  672. font-size: {select:Uppercase Font Size};
  673. padding: 10px;
  674. text-transform: uppercase;
  675. }
  676.  
  677. .quote-icon {
  678. background: {color:Main Color};
  679. display: inline-block;
  680. color: {color:Quote Icon Color};
  681. margin: -10px;
  682. padding: 10px;
  683. }
  684.  
  685. .quote-wrapper {
  686. margin-top: 20px;
  687. width: 100%;
  688. }
  689.  
  690. .quote a.tumblr_blog {
  691. font-size: {select:Uppercase Font Size};
  692. font-weight: normal;
  693. margin-top: 0px;
  694. margin-left: 0px;
  695. display: inline-block;
  696. position: relative;
  697. text-align: center;
  698. text-transform: uppercase;
  699. }
  700.  
  701. .website {
  702. background: {color:Main Color};
  703. color: {color:Quote Icon Color};
  704. font-size: {select:Uppercase Font Size};
  705. padding: 10px;
  706. text-transform: uppercase;
  707. }
  708.  
  709. .website a {
  710. color: {color:Quote Icon Color};
  711. }
  712.  
  713. .website a:hover {
  714. color: {color:Link Hover};
  715. }
  716.  
  717. .chat {
  718. font-size: {select:Uppercase Font Size};
  719. text-transform: uppercase;
  720. }
  721.  
  722. .chat li {
  723. list-style-type: none;
  724. }
  725.  
  726. .chat li:nth-child(odd) {
  727. background: {color:Main Color};
  728. color: {color:Quote Icon Color};
  729. padding: 10px;
  730. }
  731.  
  732. .chat li:nth-child(even) {
  733. background: {color:Asker Background};
  734. color: {color:Main Color};
  735. padding: 10px;
  736. }
  737.  
  738. .audio iframe {
  739. height: 85px;
  740. width: 100%;
  741. }
  742.  
  743. /** spotify fix by glenthemes **/
  744.  
  745. iframe[src*='open.spotify.com'][src*='track'], figure[data-npf*='open.spotify.com'][data-npf*='track']{
  746. height: 85px!important;
  747. margin-bottom: 0px;
  748. }
  749.  
  750. figure {
  751. display: flex;
  752. width: 100%;
  753. }
  754.  
  755. figcaption.npf-audio-wrapper {
  756. width: 100%;
  757. }
  758.  
  759. .npf-audio-wrapper {
  760. --NPF-Audio-Buttons-Size: 1.4rem;
  761. --NPF-Audio-Buttons-Color: #555555;
  762. --NPF-Audio-Buttons-Spacing: 1.3rem;
  763. --NPF-Audio-Image-Size: 85px;
  764. --NPF-Audio-Image-Spacing: 0px;
  765. }
  766.  
  767. span.npf-audio-title {
  768. font-weight: bold;
  769. }
  770.  
  771. .npf-audio-background {
  772. background-color: #f2f2f2;
  773. padding: 1.5rem;
  774. }
  775.  
  776. video {
  777. height: auto;
  778. width: 100%;
  779. }
  780.  
  781. .source {
  782. background: {color:Asker Background};
  783. border-radius: 5px;
  784. display: inline-block;
  785. font-size: {select:Uppercase Font Size};
  786. margin-top: 10px;
  787. padding: 5px;
  788. text-transform: uppercase;
  789. }
  790.  
  791. .notes-wrapper {
  792. border-bottom: 1px solid {color:Border};
  793. font-size: {select:Uppercase Font Size};
  794. font-weight: bold;
  795. margin: -20px;
  796. margin-bottom: 20px;
  797. padding: 20px;
  798. text-transform: uppercase;
  799. }
  800.  
  801. .entries-information {
  802. border-top: 1px solid {color:Border};
  803. font-size: {select:Uppercase Font Size};
  804. margin-top: 20px;
  805. padding-top: 20px;
  806. text-transform: uppercase;
  807. }
  808.  
  809. .like-b {
  810. display: inline-block;
  811. margin-right: 0px;
  812. position: relative;
  813. }
  814.  
  815. .like-b .like_button iframe {
  816. bottom: 0px;
  817. left: 0px;
  818. opacity: 0;
  819. position: absolute;
  820. right: 0px;
  821. top: 0px;
  822. }
  823.  
  824. .like-b .liked + .b {
  825. color: {color:Like};
  826. }
  827.  
  828. .like-b .liked + .b:after {
  829. content: 'd';
  830. }
  831.  
  832. .tags-title a {
  833. color: {color:Link};
  834. margin-top: 20px;
  835. margin-left: auto;
  836. margin-right: auto;
  837. margin-top: 20px;
  838. text-align: center;
  839. width: 70px;
  840. -webkit-transition: all 0.5s ease;
  841. -moz-transition: all 0.5s ease;
  842. -o-transition: all 0.5s ease;
  843. }
  844.  
  845. .tags-title:hover {
  846. color: {color:Link Hover};
  847. }
  848.  
  849. .tags {
  850. margin-top: 5px;
  851. }
  852.  
  853. .tags-alternate {
  854. margin-top: 5px;
  855. }
  856.  
  857. ol.notes {
  858. font-size: {select:Uppercase Font Size};
  859. margin: -10px;
  860. margin-top: 20px;
  861. padding: 0px;
  862. text-align: left;
  863. text-transform: uppercase;
  864. }
  865.  
  866. ol.notes li {
  867. list-style-type: none;
  868. margin: 10px;
  869. }
  870.  
  871. ol.notes li.note img.avatar {
  872. border-radius: 100px;
  873. vertical-align: -4px;
  874. height: 16px;
  875. margin-right: 10px;
  876. width: 16px;
  877. }
  878.  
  879. .more_notes_link {
  880. background: {color:Main Color};
  881. border-radius: 5px;
  882. color: white;
  883. display: inline-block;
  884. padding: 5px 10px 5px 10px;
  885. text-align: center;
  886. }
  887.  
  888. .pagination {
  889. font-size: {select:Uppercase Font Size};
  890. text-transform: uppercase;
  891. }
  892.  
  893. #credit {
  894. bottom: 15px;
  895. font-size: 0.7rem;
  896. position: fixed;
  897. right: 15px;
  898. text-transform: uppercase;
  899. }
  900.  
  901. #credit a {
  902. color: {color:Link};
  903. }
  904.  
  905. #credit a:hover {
  906. color: {color:Link Hover};
  907. }
  908.  
  909. {CustomCSS}
  910.    
  911. </style>
  912.    
  913. </head>
  914.  
  915. <body>
  916.  
  917. <div id="user-information">
  918.  
  919. <div class="td-wrapper">
  920.  
  921. <div class="title">{text:Title}</div>
  922.  
  923. {block:Description}<div class="description">{Description}</div>{/block:Description}
  924.  
  925. <div class="hns-wrapper">
  926.  
  927. <a href="/" class="home" title="Home"><i class="far fa-arrow-alt-circle-left" style="background: {color:Main Color};border: 1px solid {color:Border};border-radius: 100px;color: {color:Post Background};font-size: 0.9rem;padding: 10px;width: 0.9rem;"></i></a>
  928.  
  929. <button id="navigation" title="Blog Menu"><i class="fas fa-list-ul" style="background: {color:Main Color};border-radius: 100px;color: {color:Post Background};font-size: 0.9rem;padding: 10px;width: 0.9rem;"></i></button>
  930.  
  931. <div class="search-wrapper">
  932. <i class="fas fa-search" style="background: {color:Main Color};border-radius: 100px;color: {color:Post Background};font-size: 0.9rem;margin-right: 10px;padding: 10px;width: 0.9rem;"></i>
  933. <form class="search" action="javascript:return false">
  934. <input type="text" class="query" placeholder="Search This Blog">
  935. </form>
  936. </div>
  937.  
  938. </div>
  939.  
  940. </div>
  941.  
  942. </div>
  943.  
  944. <div id="modal-popup" class="modal">
  945.  
  946. <div class="modal-content">
  947.  
  948. <div class="links">
  949. {block:AskEnabled}<a href="/ask"><i class="far fa-envelope" style="background: {color:Main Color};border-radius: 100px;color: {color:Quote Icon Color};font-size: 0.9rem;margin-right: 10px;padding: 10px;width: 0.9rem;"></i>Ask</a>{/block:AskEnabled}
  950. {block:SubmissionsEnabled}{block:IfSubmitLink}<a href="/submit"><i class="fas fa-file-import" style="background: {color:Main Color};border-radius: 100px;color: {color:Quote Icon Color};font-size: 0.9rem;margin-right: 10px;padding: 10px;width: 0.9rem;"></i>Submit</a>{/block:IfSubmitLink}{/block:SubmissionsEnabled}
  951. {block:ifLink1URL}<a href="{text:Link 1 URL}"><i class="fa-solid fa-wand-magic-sparkles" style="background: {color:Main Color};border-radius: 100px;color: {color:Quote Icon Color};font-size: 0.9rem;margin-right: 10px;padding: 10px;width: 0.9rem;"></i>{text:Link 1 Name}</a>{/block:ifLink1URL}
  952. {block:ifLink2URL}<a href="{text:Link 2 URL}"><i class="fa-solid fa-cookie-bite" style="background: {color:Main Color};border-radius: 100px;color: {color:Quote Icon Color};font-size: 0.9rem;margin-right: 10px;padding: 10px;width: 0.9rem;"></i>{text:Link 2 Name}</a>{/block:ifLink2URL}
  953. {block:ifLink3URL}<a href="{text:Link 3 URL}"><i class="fa-solid fa-dove" style="background: {color:Main Color};border-radius: 100px;color: {color:Quote Icon Color};font-size: 0.9rem;margin-right: 10px;padding: 10px;width: 0.9rem;"></i>{text:Link 3 Name}</a>{/block:ifLink3URL}
  954. {block:ifLink4URL}<a href="{text:Link 4 URL}"><i class="fa-regular fa-heart" style="background: {color:Main Color};border-radius: 100px;color: {color:Quote Icon Color};font-size: 0.9rem;margin-right: 10px;padding: 10px;width: 0.9rem;"></i>{text:Link 4 Name}</a>{/block:ifLink4URL}
  955. {block:ifLink5URL}<a href="{text:Link 5 URL}"><i class="fa-solid fa-fan" style="background: {color:Main Color};border-radius: 100px;color: {color:Quote Icon Color};font-size: 0.9rem;margin-right: 10px;padding: 10px;width: 0.9rem;"></i>{text:Link 5 Name}</a>{/block:ifLink5URL}
  956. <a href="/archive"><i class="far fa-calendar-plus" style="background: {color:Main Color};border-radius: 100px;color: {color:Quote Icon Color};font-size: 0.9rem;margin-right: 10px;padding: 10px;width: 0.9rem;"></i>Archive</a>
  957. </div>
  958.  
  959. </div>
  960.  
  961. </div>
  962.  
  963. <div id="container">
  964.  
  965. <div id="posts">
  966.  
  967. {block:Posts}
  968.  
  969. <div class="entries" id="{PostID}" post-type="{PostType}">
  970.  
  971. {block:NoteCount}<div class="notes-wrapper"><i class="far fa-chart-bar" style="background: {color:Main Color};border-radius: 100px;color: {color:Post Background};font-size: 0.9rem;margin-right: 10px;padding: 10px;width: 0.9rem;"></i><a href="{Permalink}">{NoteCountWithLabel}</a></div>{/block:NoteCount}
  972.  
  973. {block:Text}
  974. {block:NotReblog}
  975. <div class="npf-wrapper">
  976. {block:Title}
  977. <h1>{Title}</h1>
  978. {/block:Title}
  979. {Body}
  980. </div>
  981. {/block:NotReblog}
  982. {block:RebloggedFrom}
  983. <div class="text-wrapper">
  984. {block:Title}
  985. <h1>{Title}</h1>
  986. {/block:Title}
  987. <div class="text">
  988. {Body}
  989. </div>
  990. </div>
  991. {/block:RebloggedFrom}
  992. {/block:Text}
  993.  
  994. {block:Answer}
  995. <div class="ask-wrapper">
  996. <div class="asker">
  997. <div class="asker-url">
  998. <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>
  999. <br><br>
  1000. A Message From <a href="{AskerURL}">{Asker}</a>
  1001. </div>
  1002. </div>
  1003. <div class="question">
  1004. {Question}
  1005. </div>
  1006. </div>
  1007. <div class="caption">
  1008. {Answer}
  1009. </div>
  1010. {/block:Answer}
  1011.  
  1012. {block:Quote}
  1013. <div class="quote">
  1014. <div class="quote-icon"><i class="fas fa-quote-left"></i></div>
  1015. <div class="quote-wrapper">
  1016. "{Quote}</i>" {block:Source}— {Source}{/block:Source}
  1017. </div>
  1018. </div>
  1019. {/block:Quote}
  1020.  
  1021. {block:Link}
  1022. {block:Thumbnail}
  1023. <img src="{Thumbnail}" style="margin-bottom: 10px;"/>
  1024. {/block:Thumbnail}
  1025. <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}
  1026. </a></div>
  1027. {block:Description}
  1028. <div class="caption">
  1029. {Description}
  1030. </div>
  1031. {/block:Description}
  1032. {/block:Link}
  1033.  
  1034. {block:Chat}
  1035. <div class="chat">
  1036. {block:Title}
  1037. <h1>{Title}</h1>
  1038. {/block:Title}
  1039. {block:Lines}
  1040. <li>{block:Label}{Label}{/block:Label}
  1041. {Line}
  1042. </li>
  1043. {/block:Lines}
  1044. </div>
  1045. {/block:Chat}
  1046.  
  1047. {block:Audio}
  1048. <div class="audio">
  1049. {AudioEmbed}
  1050. </div>
  1051. {block:Caption}
  1052. <div class="caption">{Caption}</div>
  1053. {/block:Caption}
  1054. {/block:Audio}
  1055.  
  1056. {block:Photo}
  1057. <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>
  1058. {block:Caption}
  1059. <div class="text-wrapper">
  1060. <div class="caption">{Caption}</div>
  1061. </div>
  1062. {/block:Caption}
  1063. {/block:Photo}
  1064.  
  1065. {block:Photoset}
  1066. <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>
  1067. {block:Caption}
  1068. <div class="text-wrapper">
  1069. <div class="caption">{Caption}</div>
  1070. </div>
  1071. {/block:Caption}
  1072. {/block:Photoset}
  1073.  
  1074. {block:Video}
  1075. <div class="video">
  1076. {Video-500}
  1077. </div>
  1078. {block:Caption}
  1079. <div class="caption">{Caption}</div>
  1080. {/block:Caption}
  1081. {/block:Video}
  1082.  
  1083. {block:ContentSource}
  1084. <div class="source">
  1085. <i class="fas fa-paper-plane" style="color: {color:Main Color};margin-right: 5px;"></i><a href="{SourceURL}" title="{SourceTitle}">Source</a>
  1086. </div>
  1087. {/block:ContentSource}
  1088.  
  1089. {block:Date}
  1090. <div class="entries-information">
  1091. {block:PinnedPostLabel}
  1092. <font style="color: {color:Pin};"><i class="fas fa-thumbtack" style="margin-right: 5px;"></i>{PinnedPostLabel}</font>
  1093. <font style="color: {color:Main Color};margin-left: 5px;margin-right: 5px;">•</font>
  1094. {/block:PinnedPostLabel}
  1095. <a href="{Permalink}">{DayOfMonth} {ShortMonth} {Year}</a>
  1096. <font style="color: {color:Main Color};margin-left: 5px;margin-right: 5px;">•</font>
  1097. {block:RebloggedFrom} <a href="{ReblogParentURL}">Via</a> / {/block:RebloggedFrom}  
  1098. {block:ContentSource}{block:RebloggedFrom} <a href="{ReblogRootURL}">Source</a> / {/block:RebloggedFrom}{/block:ContentSource}
  1099. <a class="like-b" href="#">{LikeButton}<div class="b">Like</div></a> Or <a href="{ReblogURL}" target="_blank">Reblog</a>
  1100. {block:IfHideTags}
  1101. {block:HasTags}
  1102. <font style="color: {color:Main Color};margin-left: 5px;margin-right: 5px;">•</font>
  1103. <a class="tags-title">Show Tags</a>
  1104. <div class="tags">
  1105. {block:Tags}
  1106. <a href="{TagURL}" style="margin-right: 5px;"><font style="color: {color:Main Color};margin-right: 5px;">•</font>{Tag}</a>
  1107. {/block:Tags}
  1108. </div>
  1109. {/block:HasTags}
  1110. {/block:IfHideTags}
  1111. {block:IfShowTags}
  1112. {block:HasTags}
  1113. <div class="tags-alternate">
  1114. {block:Tags}
  1115. <a href="{TagURL}" style="margin-right: 5px;"><font style="color: {color:Main Color};margin-right: 5px;">•</font>{Tag}</a>
  1116. {/block:Tags}
  1117. </div>
  1118. {/block:HasTags}
  1119. {/block:IfShowTags}
  1120. {block:PostNotes}
  1121. {PostNotes}
  1122. {/block:PostNotes}
  1123. </div>
  1124. {/block:Date}
  1125.  
  1126. </div>
  1127.  
  1128. {/block:Posts}
  1129.  
  1130. {block:Pagination}
  1131. <div class="pagination">
  1132. {CurrentPage} Out Of {TotalPages}
  1133. <font style="float:right;">
  1134. {block:PreviousPage}
  1135. <a href="{PreviousPage}">Previous</a>
  1136. {/block:PreviousPage}
  1137. {block:NextPage}
  1138. Or <a href="{NextPage}">Next</a>
  1139. {/block:NextPage}
  1140. </font>
  1141. </div>
  1142. {/block:Pagination}
  1143.  
  1144. </div>
  1145.  
  1146. </div>
  1147.  
  1148. <div id="credit"><a href="http://ghcstfaec.tumblr.com/" title="ghcstfaec" target="_blank">GHCST</a></div>
  1149.  
  1150. </body>
  1151.  
  1152. <!-- Modal Script -->
  1153.  
  1154. <script>
  1155. var modal = document.getElementById("modal-popup");
  1156. var btn = document.getElementById("navigation");
  1157. btn.onclick = function() {
  1158. modal.style.display = "block";
  1159. }
  1160. window.onclick = function(event) {
  1161. if (event.target == modal) {
  1162. modal.style.display = "none";
  1163. }
  1164. }
  1165. </script>
  1166.  
  1167. </html>
Advertisement
Add Comment
Please, Sign In to add comment