themesbyces

Theme — And We Begin Again

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