themesbyces

Theme — Wildflowers (Contained)

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