themesbyces

Theme — Wildflowers (Contained)

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