themesbyces

Theme — Spring Day

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