Advertisement
Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- <!----------------------------------------------------
- Theme [04]: Whimsical
- Made by glenthemes
- Initial release: 2015/08/??
- Rework date: [v1] 2018/09/27 ✧ [v2] 2022/01/28
- Last updated: 2023/08/27
- What's new:
- ✱ NPF audio post support
- ✱ fixed issue with icons not showing on post page
- TERMS OF USE:
- 1) Do not remove the theme credit.
- 2) Do not repost/redistribute my themes.
- 3) Do not take parts of the code and use it as your own.
- 4) Do not use my themes as a base code.
- 5) Do not mix my themes together.
- THEME GUIDE:
- https://docs.google.com/presentation/d/1FVZWJQes4r_UqANvDcTa88uSCWTpFVyZMCTRPO4VMYU/edit?usp=sharing
- CREDITS:
- (ෆ’∀’ෆ) ~ glencredits.tumblr.com/whimsical
- ----------------------------------------------------->
- <!DOCTYPE html>
- <html font="{select:font}" tumblr-controls="{select:tumblr controls color}" bg-type="{select:background image type}" {block:IndexPage}index-page="true"{/block:IndexPage} {block:PermalinkPage}permalink-page="true"{/block:PermalinkPage} post-cols="{select:post columns}" pagi-place="{select:pagination location}">
- <head>
- <title>{Title}</title>
- <link rel="shortcut icon" href="{Favicon}">
- {block:Description}
- <meta name="description" content="{MetaDescription}">
- {/block:Description}
- <!-------- FONTS -------->
- <!-- google fonts -->
- <link href="//fonts.googleapis.com/css?family=Work+Sans|Overpass+Mono|Libre+Franklin|Open+Sans|Manrope:500|Karla|Readex+Pro|Sora|Space+Mono" rel="stylesheet">
- <!-------- ICON FONTS -------->
- <!-- phosphor icons -->
- <link rel="stylesheet" href="//unpkg.com/phosphor-icons@1.3.2/src/css/phosphor.css">
- <!-- cappucicons -->
- <link href="//static.tumblr.com/gtjt4bo/tQkr83ou4/cappuccicons.css" rel="stylesheet">
- <!-- iconsax -->
- <script src="//glenthemes.github.io/iconsax/geticons.js"></script>
- <link href="//glenthemes.github.io/iconsax/style.css" rel="stylesheet">
- <!-- ahmed agrma line icons -->
- <script src="//glenthemes.github.io/aa-line-icons/script.js"></script>
- <link href="//glenthemes.github.io/aa-line-icons/style.css" rel="stylesheet">
- <!------ PRELOAD ------>
- <link rel="preload" href="//glen-assets.github.io/fonts/KaoriGel.ttf" as="font" type="font/ttf" crossorigin>
- <link rel="preload" href="//glen-assets.github.io/fonts/Eri Ji.otf" as="font" type="font/otf" crossorigin>
- <link rel="preload" href="//glen-assets.github.io/fonts/HatsukoiFriends.otf" as="font" type="font/otf" crossorigin>
- <link rel="preload" href="//glen-assets.github.io/fonts/ness.ttf" as="font" type="font/ttf" crossorigin>
- <link rel="preload" href="//glen-assets.github.io/fonts/Dreaming Outloud AllCaps.otf" as="font" type="font/otf" crossorigin>
- <!-------- JQUERY -------->
- <script src="//ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
- <!-------- THEME SCRIPTS -------->
- <script src="//npf-images-v3.github.io/script.js"></script>
- <link rel="stylesheet" href="//npf-images-v3.github.io/recon.css">
- <script src="//rawgit.com/robinpx/tumblr/master/scripts/flexibleFrames/flexibleFrames.min.js"></script>
- <link href="//static.tumblr.com/0podkko/oDSpg7y88/photosets.css" rel="stylesheet">
- <script src="//static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script>
- <script src="//griddery.github.io/grid.js"></script>
- <link href="//griddery.github.io/basics.css" rel="stylesheet">
- <script src="//static.tumblr.com/gtjt4bo/sgMrymui0/waitforelement.js"></script>
- <script src="//glen-themes.gitlab.io/thms/04/always-late-for-the-bus.js"></script>
- <script src="//glen-themes.gitlab.io/thms/04/late-again.js"></script>
- <script src="//static.tumblr.com/gtjt4bo/5XRr7yhna/if_onlydigits.js"></script>
- <!-- unblue polls -->
- <!-- glenthemes.tumblr.com/post/708014819571302400 -->
- <link href="//static.tumblr.com/gtjt4bo/mXBrpdj0n/unblue-polls.css" rel="stylesheet">
- <style unblue-polls>
- .poll-post {
- --Poll-Question-Font-Size: var(--Body-Font-Size);
- --Poll-Option-Background-Color: {color:post};
- --Poll-Option-Corner-Rounding: {text:post corner roundness};
- --Poll-Option-Border-Size: 2px;
- --Poll-Option-Border-Color: {color:post borders inner};
- --Poll-Option-Padding: 8px;
- --Poll-Option-Font-Size: var(--Body-Font-Size);
- --Poll-Option-Spacing: 10px;
- --Poll-Option-Text-Color: {color:text};
- --Poll-Option-HOVER-Border-Color: {color:special border};
- --Poll-Option-HOVER-Background-Color: {color:special background};
- --Poll-Option-HOVER-Text-Color: {color:special text};
- --Poll-Option-HOVER-Speed: 0.4s;
- }
- .poll-see-results {
- padding-bottom:0!important;
- border-bottom:none!important;
- font-size:calc(var(--Poll-Option-Font-Size) - 1px)!important;
- text-transform:uppercase;
- letter-spacing:0.5px;
- }
- </style>
- <!-- npf audio player -->
- <!-- glenthemes.tumblr.com/post/722160746171072512 -->
- <script src="//tmblr-npf-audio.gitlab.io/s/init.js"></script>
- <link href="//tmblr-npf-audio.gitlab.io/s/base.css" rel="stylesheet">
- <script>
- tumblr_npf_audio({
- emptyTitleText: "Untitled track",
- emptyArtistText: "Untitled artist",
- emptyAlbumText: "Untitled album",
- titleLabel: "",
- artistLabel: "",
- albumLabel: ""
- });
- </script>
- <style edit-npf-audio-player>
- .npf-audio-wrapper {
- --NPF-Audio-Buttons-Size: var(--Audio-Post-Buttons-Size);
- --NPF-Audio-Buttons-Color: var(--Audio-Post-Buttons-Color);
- --NPF-Audio-Buttons-Padding: var(--Audio-Post-Buttons-Padding);
- --NPF-Audio-Buttons-Spacing: calc(var(--p) + var(--Audio-Post-Album-Right-Gap));
- --NPF-Audio-Image-Size: var(--Audio-Post-Album-Size);
- --NPF-Audio-Image-Spacing: 0px;
- --t:calc((var(--NPF-Audio-Buttons-Padding) * 2) + var(--NPF-Audio-Buttons-Size));
- --p:calc(var(--NPF-Audio-Buttons-Padding) + ((var(--NPF-Audio-Image-Size) - var(--t)) / 2));
- }
- .npf-audio-wrapper {
- position:relative;
- background:{color:special background};
- z-index:0;
- }
- .npf-audio-background {
- margin-left:var(--p);
- }
- .npf-audio-play, .npf-audio-pause {
- position:relative;
- z-index:0;
- }
- .npf-audio-play:after, .npf-audio-pause:after {
- content:"";
- position:absolute;
- top:0;left:0;
- margin-top:calc(0px - var(--NPF-Audio-Buttons-Padding));
- margin-left:calc(0px - var(--NPF-Audio-Buttons-Padding));
- width:calc(100% + (var(--NPF-Audio-Buttons-Padding) * 2));
- height:calc(100% + (var(--NPF-Audio-Buttons-Padding) * 2));
- background:var(--Audio-Post-Buttons-Background);
- border-radius:100%;
- z-index:-1;
- }
- .npf-audio-play svg { margin-left:1px; }
- .npf-audio-pause svg { margin-left:0; }
- figcaption.audio-caption,
- figcaption.audio-caption ~ audio[controls]{
- display:none;
- }
- .npf-audio-image {
- position:absolute;
- top:0;left:0;
- z-index:-1;
- }
- .npf-audio-details {
- line-height:var(--Line-Height);
- --flesk:calc((((var(--Body-Font-Size) - 1px) * var(--Line-Height-INT)) - var(--AUD-Font-Size)) / 2);
- margin:calc(0px - var(--flesk)) 0;
- color:{color:special text};
- }
- .npf-audio-details > * + * {
- margin-top:-1px;
- }
- </style>
- <script src="//glen-npf.gitlab.io/other/neue.js"></script>
- <link href="//glen-npf.gitlab.io/other/neue.css" rel="stylesheet">
- {block:Hidden}
- <!-------- CUSTOMIZE PANEL OPTIONS -------->
- <!-- hi if you're reading this click the back arrow to edit! -->
- <meta name="image:background image" content="//64.media.tumblr.com/7c88c24dd4501217a38b4e63286fe6dd/05ae38d18ab04189-01/s2048x3072/c93baedfc6fe915a31b7ea2a749e58d056a47f0d.png">
- <meta name="image:sidebar image" content="//static.tumblr.com/d4261490526b9e0279b6ce2c0187ef0e/2pnwama/E58pfq59y/tumblr_static_225be2i6dvxck8gkckgk4oow8.gif">
- <meta name="color:top bar" content="#dae6eb">
- <meta name="color:background" content="#fcfcfc">
- <meta name="color:─── ・ 。゚☆: *.☽ .* :☆゚. ───" content="#">
- <meta name="color:sidebar title" content="#95bdd1">
- <meta name="color:desc text" content="#96b7c0">
- <meta name="color:desc bold" content="#637781">
- <meta name="color:desc italic" content="#7bb3b1">
- <meta name="color:desc link" content="#89bbc2">
- <meta name="color:─── ・ 。゚☆: *.☽ .* :☆゚. ───​" content="#">
- <meta name="color:sidebar link 1" content="#deedf2">
- <meta name="color:sidebar link 1 hover" content="#dce5e8">
- <meta name="color:sidebar link 2" content="#cce2eb">
- <meta name="color:sidebar link 2 hover" content="#dce5e8">
- <meta name="color:sidebar link 3" content="#b9d8e4">
- <meta name="color:sidebar link 3 hover" content="#dce5e8">
- <meta name="color:sidebar link 4" content="#afd2e0">
- <meta name="color:sidebar link 4 hover" content="#dce5e8">
- <meta name="color:─── ・ 。゚☆: *.☽ .* :☆゚. ───​​" content="#">
- <meta name="color:customlinks number" content="#a5a5a5">
- <meta name="color:customlinks line" content="#d5d5d5">
- <meta name="color:customlinks text" content="#95bdd1">
- <meta name="color:customlinks hover number" content="#60656c">
- <meta name="color:customlinks hover line" content="#d5d5d5">
- <meta name="color:customlinks hover text" content="#60656c">
- <meta name="color:─── ・ 。゚☆: *.☽ .* :☆゚. ───​​​" content="#">
- <meta name="color:searchbar border" content="#efefef">
- <meta name="color:searchbar bg" content="#fefefe">
- <meta name="color:searchbar text" content="#a3a3a3">
- <meta name="color:searchbar icon border" content="#efefef">
- <meta name="color:searchbar icon bg" content="#fefefe">
- <meta name="color:searchbar icon" content="#a9a9a9">
- <meta name="color:─── ・ 。゚☆: *.☽ .* :☆゚. ───​​​​" content="#">
- <meta name="color:pagination border" content="#eaeaea">
- <meta name="color:pagination arrows" content="#95bdd1">
- <meta name="color:pagination numbers" content="#95bdd1">
- <meta name="color:─── ・ 。゚☆: *.☽ .* :☆゚. ───​​​​​" content="#">
- <meta name="color:musicplayer buttons" content="#60656c">
- <meta name="color:musicplayer note" content="#60656c">
- <meta name="color:musicplayer text" content="#60656c">
- <meta name="color:musicplayer link" content="#9ac1d0">
- <meta name="color:─── ・ 。゚☆: *.☽ .* :☆゚. ───​​​​​​" content="#">
- <meta name="color:post" content="#fff">
- <meta name="color:text" content="#696969">
- <meta name="color:bold" content="#444">
- <meta name="color:italic" content="#7bb3b1">
- <meta name="color:link" content="#9ac1d0">
- <meta name="color:headings" content="#444">
- <meta name="color:post borders outer" content="#eee">
- <meta name="color:post borders inner" content="#f2f2f2">
- <meta name="color:reblogger line" content="#bdd6e0">
- <meta name="color:reblogger" content="#88a7ad">
- <meta name="color:special border" content="#f0f0f0">
- <meta name="color:special background" content="#fafafa">
- <meta name="color:special text" content="#444">
- <meta name="color:permalink border" content="#eee">
- <meta name="color:permalink background" content="#fbfbfb">
- <meta name="color:permalink text" content="#7d8585">
- <meta name="color:tags" content="#999">
- <meta name="color:post buttons" content="#7d8585">
- <meta name="color:like button liked" content="#92c5cd">
- <meta name="color:─── ・ 。゚☆: *.☽ .* :☆゚. ───​​​​​​​" content="#">
- <meta name="color:scrollbar" content="#ccc">
- <meta name="color:scrollbar background" content="#fcfcfc">
- <meta name="color:text selection background" content="#e7f1f4">
- <meta name="color:text selected" content="#444">
- <meta name="color:label bg" content="#9ac1d0">
- <meta name="color:label text" content="#fcfcfc">
- <meta name="select:tumblr controls color" title="white" content="white">
- <meta name="select:tumblr controls color" title="black" content="black">
- <meta name="select:background image type" title="small" content="repeat">
- <meta name="select:background image type" title="large" content="full">
- <meta name="select:─── ・ 。゚☆: *.☽ .* :☆゚. ───">
- <meta name="select:sidebar image width" title="80%" content="80%">
- <meta name="select:sidebar image width" title="40%" content="40%">
- <meta name="select:sidebar image width" title="50%" content="50%">
- <meta name="select:sidebar image width" title="60%" content="60%">
- <meta name="select:sidebar image width" title="70%" content="70%">
- <meta name="select:sidebar image width" title="90%" content="90%">
- <meta name="select:sidebar image width" title="100%" content="100%">
- <meta name="select:sidebar image width" title="110%" content="110%">
- <meta name="select:sidebar image width" title="120%" content="120%">
- <meta name="select:sidebar image width" title="130%" content="130%">
- <meta name="select:sidebar title font" title="Ness" content="ness">
- <meta name="select:sidebar title font" title="Dreaming Outloud" content="dreaming outloud">
- <meta name="select:sidebar title font" title="Eri Ji" content="eri ji">
- <meta name="select:sidebar title font" title="Hatsukoi Friends" content="htskfrnds">
- <meta name="select:sidebar title size" title="15px" content="15px">
- <meta name="select:sidebar title size" title="10px" content="10px">
- <meta name="select:sidebar title size" title="11px" content="11px">
- <meta name="select:sidebar title size" title="12px" content="12px">
- <meta name="select:sidebar title size" title="13px" content="13px">
- <meta name="select:sidebar title size" title="14px" content="14px">
- <meta name="select:sidebar title size" title="16px" content="16px">
- <meta name="select:sidebar title size" title="17px" content="17px">
- <meta name="select:sidebar title size" title="18px" content="18px">
- <meta name="select:sidebar title size" title="19px" content="19px">
- <meta name="select:sidebar title size" title="20px" content="20px">
- <meta name="select:desc font" title="Manrope" content="Manrope">
- <meta name="select:desc font" title="Sora" content="Sora">
- <meta name="select:desc font" title="Libre Franklin" content="Libre Franklin">
- <meta name="select:desc font" title="Open Sans" content="Open Sans">
- <meta name="select:desc font" title="Karla" content="Karla">
- <meta name="select:desc font size" title="12px" content="12px">
- <meta name="select:desc font size" title="10px" content="10px">
- <meta name="select:desc font size" title="11px" content="11px">
- <meta name="select:desc font size" title="13px" content="13px">
- <meta name="select:desc font size" title="14px" content="14px">
- <meta name="select:desc font size" title="15px" content="15px">
- <meta name="select:desc text align" title="center" content="center">
- <meta name="select:desc text align" title="left" content="left">
- <meta name="select:desc text align" title="right" content="right">
- <meta name="select:desc text align" title="justify" content="justify">
- <meta name="select:customlinks size" title="10px" content="10px">
- <meta name="select:customlinks size" title="8px" content="8px">
- <meta name="select:customlinks size" title="9px" content="9px">
- <meta name="select:customlinks size" title="11px" content="11px">
- <meta name="select:customlinks size" title="12px" content="12px">
- <meta name="select:customlinks size" title="13px" content="13px">
- <meta name="select:customlinks size" title="14px" content="14px">
- <meta name="select:show searchbar" title="show" content="show">
- <meta name="select:show searchbar" title="hide" content="hide">
- <meta name="select:pagination location" title="sidebar" content="sb">
- <meta name="select:pagination location" title="bottom of page" content="bbt">
- <meta name="select:pagination border" title="show" content="show">
- <meta name="select:pagination border" title="hide" content="hide">
- <!-------- POST OPTIONS -------->
- <meta name="select:─── ・ 。゚☆: *.☽ .* :☆゚. ───​">
- <meta name="select:font" title="Sora" content="Sora">
- <meta name="select:font" title="Manrope" content="Manrope">
- <meta name="select:font" title="Libre Franklin" content="Libre Franklin">
- <meta name="select:font" title="Open Sans" content="Open Sans">
- <meta name="select:font" title="Karla" content="Karla">
- <meta name="select:font size" title="12px" content="12px">
- <meta name="select:font size" title="10px" content="10px">
- <meta name="select:font size" title="11px" content="11px">
- <meta name="select:font size" title="13px" content="13px">
- <meta name="select:font size" title="14px" content="14px">
- <meta name="select:font size" title="15px" content="15px">
- <meta name="select:post columns" title="2" content="2">
- <meta name="select:post columns" title="1" content="1">
- <meta name="select:post columns" title="3" content="3">
- <meta name="select:post padding" title="14px" content="14px">
- <meta name="select:post padding" title="10px" content="10px">
- <meta name="select:post padding" title="18px" content="18px">
- <meta name="select:post padding" title="22px" content="22px">
- <meta name="select:photoset spacing" title="4px" content="4px">
- <meta name="select:photoset spacing" title="2px" content="2px">
- <meta name="select:photoset spacing" title="6px" content="6px">
- <meta name="select:photoset spacing" title="8px" content="8px">
- <meta name="select:photoset spacing" title="10px" content="10px">
- <meta name="select:grayscale images" title="off" content="off">
- <meta name="select:grayscale images" title="on" content="on">
- <meta name="select:toggle tags" title="yes" content="yes">
- <meta name="select:toggle tags" title="no" content="no">
- <meta name="select:post spacing" title="30px" content="30px">
- <meta name="select:post spacing" title="25px" content="25px">
- <meta name="select:post spacing" title="35px" content="35px">
- <meta name="select:post spacing" title="40px" content="40px">
- <meta name="select:post spacing" title="45px" content="45px">
- <meta name="select:post spacing" title="50px" content="50px">
- <meta name="select:post spacing" title="55px" content="55px">
- <meta name="select:center gap" title="65px" content="65px">
- <meta name="select:center gap" title="30px" content="30px">
- <meta name="select:center gap" title="35px" content="35px">
- <meta name="select:center gap" title="40px" content="40px">
- <meta name="select:center gap" title="45px" content="45px">
- <meta name="select:center gap" title="55px" content="55px">
- <meta name="select:center gap" title="50px" content="50px">
- <meta name="select:center gap" title="55px" content="55px">
- <meta name="select:center gap" title="60px" content="60px">
- <meta name="select:center gap" title="70px" content="70px">
- <meta name="select:center gap" title="75px" content="75px">
- <meta name="select:center gap" title="80px" content="80px">
- <meta name="select:center gap" title="85px" content="85px">
- <meta name="select:center gap" title="90px" content="90px">
- <meta name="select:center gap" title="95px" content="95px">
- <meta name="if:small cursor" content="1">
- {/block:Hidden}
- <!--------- TEXT FIELDS --------->
- <meta name="text:top bar height" content="10px">
- <meta name="text:screen margin" content="40px">
- <meta name="text:sidebar width" content="165px">
- <meta name="text:sidebar title" content="WHIMSICAL">
- <meta name="text:description" content="And may your bones sing<br>
No longer with pain<br>
But with <a href="https://devsmaycry.tumblr.com/post/166734190864" title="Moira Egan, from ‘Vespers’">roses</a>.">
- <meta name="text:searchbar text" content="search...">
- <meta name="text:󠀠​" content="─── ・ 。゚☆: *.☽ .* :☆゚. ───
">
- <meta name="text:customlink 1 name" content="sample link">
- <meta name="text:customlink 1 url" content="https://youtube.com/watch?v=ZkNMZlkrzaU">
- <meta name="text:customlink 2 name" content="">
- <meta name="text:customlink 2 url" content="">
- <meta name="text:customlink 3 name" content="">
- <meta name="text:customlink 3 url" content="">
- <meta name="text:customlink 4 name" content="">
- <meta name="text:customlink 4 url" content="">
- <meta name="text:customlink 5 name" content="">
- <meta name="text:customlink 5 url" content="">
- <meta name="text:customlink 6 name" content="">
- <meta name="text:customlink 6 url" content="">
- <meta name="text:󠀠​​" content="─── ・ 。゚☆: *.☽ .* :☆゚. ───
">
- <meta name="text:HOW TO CHANGE THE MUSIC" content="https://linktr.ee/direct_file_links">
- <meta name="text:music name" content="Love Like You [ <a href="https://youtube.com/watch?v=aier51lcRfg" title="piano cover by taioo">x</a> ]">
- <meta name="text:music file" content="https://rhizo.gitlab.io/m/Love_Like_You__Piano_Cover_by_Taioo_.mp3">
- <meta name="text:music volume" content="100%">
- <meta name="text:󠀠​​​" content="─── ・ 。゚☆: *.☽ .* :☆゚. ───
">
- <meta name="text:post width" content="275px">
- <meta name="text:post width large" content="400px">
- <meta name="text:post corner roundness" content="5px">
- <meta name="text:permalink icon A" content="file">
- <meta name="text:permalink icon B" content="star">
- <!--------------------------------------------------->
- <style type="text/css">
- @font-face { font-family: "kaori gel"; src: url("//glen-assets.github.io/fonts/KaoriGel.ttf"); }
- @font-face { font-family: "eri ji"; src: url("//glen-assets.github.io/fonts/Eri Ji.otf"); }
- @font-face { font-family: "hatsukoi friends"; src: url("//glen-assets.github.io/fonts/HatsukoiFriends.otf"); }
- @font-face { font-family: "ness"; src: url("//glen-assets.github.io/fonts/ness.ttf"); }
- @font-face { font-family: "dreaming outloud"; src: url("//glen-assets.github.io/fonts/Dreaming Outloud AllCaps.otf"); }
- /*-------- TUMBLR CONTROLS --------*/
- iframe#tumblr_controls, .iframe-controls--desktop {
- top:calc(5px + var(--TopBar-Height))!important;
- right:calc(5px + (var(--Scrollbar-Padding) / 2) + 1px)!important;
- position:fixed!important;
- --TC-Resize-Factor:0.69;
- transform:scale(var(--TC-Resize-Factor),var(--TC-Resize-Factor));
- -webkit-transform:scale(var(--TC-Resize-Factor),var(--TC-Resize-Factor));
- opacity:0.8;
- transform-origin:100% 0;
- z-index:999999!important;
- user-select:none;
- }
- .tmblr-iframe--follow-teaser, .follow-teaser, .iframe-controls--phone-mobile, .tmblr-iframe--app-cta-button {
- display:none!important;
- visibility:hidden!important;
- height:0!important;
- }
- [tumblr-controls="black"] iframe#tumblr_controls,
- [tumblr-controls="black"] .iframe-controls--desktop {
- filter:invert(100%) hue-rotate(180deg)!important;
- -webkit-filter:invert(100%) hue-rotate(180deg)!important;
- opacity:1;
- }
- /*------- SCROLLBAR --------*/
- ::-webkit-scrollbar {
- width:var(--Scrollbar-Padding);
- height:var(--Scrollbar-Padding);
- background-color:{color:scrollbar background};
- }
- ::-webkit-scrollbar-thumb {
- background-color:{color:scrollbar};
- border:calc((var(--Scrollbar-Padding) - 1px) / 2) solid transparent;
- border-top:calc(var(--Scrollbar-Padding) / 2.69) solid transparent;
- border-bottom:calc(var(--Scrollbar-Padding) / 2.69) solid transparent;
- background-clip:padding-box;
- }
- ::-webkit-scrollbar-corner {
- background:transparent;
- }
- /*------- TOOLTIPS --------*/
- #s-m-t-tooltip {
- padding:6px 9px;
- margin:17px;
- background-color:{color:label bg};
- border-radius:2px;
- font-family:var(--SmallCaps-Font-Family);
- font-size:calc(var(--SmallCaps-Font-Size) - .5px);
- letter-spacing:0.5px;
- text-transform:uppercase;
- color:{color:label text};
- line-height:var(--Line-Height);
- z-index:99;
- max-width:40vw;
- }
- /*---- GLOBAL FONT SETTINGS ----*/
- [font]{
- font-family:var(--Body-Font-Family);
- font-size:var(--Body-Font-Size);
- color:var(--Body-Text-Color);
- }
- [font="Libre Franklin"]{
- font-size:calc(var(--Body-Font-Size) - .5px)!important;
- letter-spacing:0.1px;
- }
- [font="Manrope"]{
- font-size:calc(var(--Body-Font-Size) - 1px)!important;
- letter-spacing:0.3px;
- }
- [font="Sora"]{
- font-size:calc(var(--Body-Font-Size) - 1px)!important;
- letter-spacing:0.1px;
- }
- /*------- TEXT HIGHLIGHT --------*/
- ::selection {
- background:{color:text selection background};
- color:{color:text selected};
- }
- img::selection {background:transparent;}
- img::-moz-selection {background:transparent;}
- ::-moz-selection {
- background:{color:text selection background};
- color:{color:text selected};
- }
- /*------- BASICS --------*/
- {block:ifsmallcursor}
- * {
- cursor:url("https://78.media.tumblr.com/66991e3a24432876aa22db906d5071de/tumblr_pe9t1ipv6S1qg2f5co6_r1_75sq.png"), auto!important;
- }
- {/block:ifsmallcursor}
- body {
- margin:0;
- background-color:{color:background};
- background-image:url('{image:background image}');
- background-attachment:fixed;
- overflow:hidden;
- }
- [bg-type="repeat"] body {
- background-repeat:repeat;
- }
- [bg-type="full"] body {
- background-repeat:no-repeat;
- background-size:cover;
- background-position:center;
- }
- a {
- text-decoration:none;
- color:var(--Link);
- }
- a[title][class*="smt-current-element"]:not([href]){
- cursor:help;
- }
- a[title=""]:not([href]){
- cursor:initial;
- }
- p {
- margin:var(--Paragraph-Margins) 0;
- }
- blockquote {
- margin:var(--Paragraph-Margins);
- margin-right:0;
- padding-left:var(--Paragraph-Margins);
- border-left:1px solid rgba({RGBcolor:text},0.169);
- }
- h1, h2, h3, h4, h5, h6, .linkpost-title {
- margin:var(--Heading-Margins) 0;
- font-family:var(--Heading-Font-Family);
- font-weight:normal;
- font-size:var(--Heading-Font-Size);
- text-transform:uppercase;
- letter-spacing:.3px;
- line-height:calc(var(--Line-Height) * 1.1);
- -webkit-text-stroke-width:0.3px;
- -webkit-text-stroke-color:{color:headings};
- color:{color:headings};
- }
- img, iframe {
- vertical-align:middle;
- max-width:100%;
- }
- figure {
- margin:0;
- }
- figure img {
- height:auto;
- }
- pre, code {
- white-space:pre-wrap;
- font-family:overpass mono;
- font-size:calc(var(--Body-Font-Size) - 1.5px);
- background:{color:special background};
- border:1px solid {color:special border};
- color:{color:special text};
- }
- pre {
- padding:0.8em 1em;
- border-radius:3px;
- word-break:break-word;
- }
- code {
- padding:3px 4px;
- }
- hr {
- display:block;
- margin:var(--Heading-Margins) auto;
- border-width:0px;
- width:69%;
- height:1px;
- background:{color:post borders inner};
- }
- .p-more {
- text-align:center;
- }
- a.read_more {
- padding-bottom:1.5px!important;
- font-family:var(--SmallCaps-Font-Family);
- font-size:calc(var(--SmallCaps-Font-Size) + 1px);
- text-transform:uppercase;
- letter-spacing:.7px;
- }
- ul, ol {
- margin:var(--Paragraph-Margins) 0;
- margin-left:1.69em;
- padding:0;
- }
- ol li {
- padding-left:0.420em;
- }
- ul li {
- position:relative;
- padding-left:0.25em;
- margin-left:calc((var(--Body-Font-Size) * 1.420) - 3px);
- list-style:none;
- }
- ul li:before {
- content:"";
- position:absolute;
- margin-top:calc(((var(--Body-Font-Size) * var(--Line-Height-INT)) / 2) - 0px);
- transform:translateY(-50%);
- left:0;margin-left:calc((var(--Body-Font-Size) * -1.420) - 3px);
- width:var(--Body-Font-Size);
- height:.7px;
- background:rgba({RGBcolor:text},0.420);
- }
- .flex {
- display:flex!important;
- align-items:center;
- }
- :root {
- --TopBar-Height:{text:top bar height};
- --Screen-Margin:{text:screen margin};
- --Main-Content-Shift:-25px;
- /*--- SIDEBAR SETTINGS ---*/
- --Sidebar-Width:{text:sidebar width};
- --Navlinks-Bar-Height:12px;
- --Navlinks-Bar-Roundness:10px;
- --Navlinks-Fade-Speed:420ms; /* can be in ms or s! */
- --CustomLinks-Line-Width:28px;
- --CustomLinks-Line-Thickness:1px;
- --CustomLinks-Line-Spacing:8px;
- --CustomLinks-Fade-Speed:279ms;
- --CustomLinks-Row-Spacing:10px;
- --Searchbar-Text-Padding:5px;
- --Searchbar-Icon-Spacing:5px;
- --Searchbar-Icon-Size:calc(var(--Body-Font-Size) - 1px);
- --Pagination-Numbers-Size:calc(var(--Body-Font-Size) - 2px);
- --Pagination-Arrows-Size:calc(var(--SmallCaps-Font-Size) + 1px);
- --Pagination-Spacing:10px;
- --Sidebar-Stuff-Spacing:20px;
- /*--- MUSIC PLAYER SETTINGS ---*/
- --MusicPlayer-Corner-Offset:20px;
- --MusicPlayer-Buttons-Size:12px;
- --MusicPlayer-Note-Left-Gap:9px;
- --MusicPlayer-Text-Left-Gap:7px;
- --MusicPlayer-Text-Size:calc(var(--SmallCaps-Font-Size));
- /*--- POST SETTINGS ---*/
- --Paragraph-Margins:1em;
- --Heading-Margins:1em;
- --Body-Font-Family:{select:font};
- --Body-Font-Size:{select:font size};
- --Body-Text-Color:{color:text};
- --Line-Height:1.7em; /* line-height with suffix */
- --Line-Height-INT:1.7; /* line-height without suffix */
- --Heading-Font-Family:"kaori gel";
- --Heading-Font-Size:calc(var(--Body-Font-Size) - 1px);
- --SmallCaps-Font-Family:"readex pro";
- --SmallCaps-Font-Size:calc(var(--Body-Font-Size) - 3px);
- {block:IndexPage}
- --Post-Width:{text:post width};
- {/block:IndexPage}
- {block:PermalinkPage}
- --Post-Width:{text:post width large};
- {/block:PermalinkPage}
- --Post-Total-Width:calc(var(--Post-Width) + (var(--Post-Padding) * 2) + 2px);
- --Post-Padding:{select:post padding};
- --Post-Spacing:{select:post spacing};
- --Post-Columns:{select:post columns};
- --Post-Columns-Spacing:{select:post spacing};
- --Reblogger-Avatar-Gap-Right:8px;
- --Reblogger-Username-Line-Width:15px;
- --Reblogger-Username-Line-Color:{color:reblogger line};
- --Reblogger-Username-Color:{color:reblogger};
- --Reblogger-Avatar-Bottom-Gap:12px;
- --Reblogs-Spacing:15px;
- --Reblogs-Border:{color:post borders inner};
- --Captions-Gap:13px;
- --NPF-Caption-Spacing:var(--Captions-Gap);
- --Photoset-Spacing:{select:photoset spacing};
- --NPF-Image-Spacing:var(--Photoset-Spacing);
- --Grayscale-Settings:grayscale(100%) contrast(110%) brightness(104%);
- --Grayscale-Transition-Speed:0.269s;
- --AskerPortrait-Size:42px;
- --AskerPortrait-Padding:6px;
- --Audio-Post-Album-Size:64px;
- --Audio-Post-Album-Right-Gap:13px;
- --Audio-Post-Buttons-Size:10px;
- --Audio-Post-Buttons-Color:{color:label text};
- --Audio-Post-Buttons-Padding:9px;
- --Audio-Post-Buttons-Background:{color:label bg};
- --Audio-Post-Download-Color:{color:special text};
- --Link:{color:link};
- --Post-Borders-Inner:{color:post borders inner};
- --Quote-Font-Family:var(--Heading-Font-Family);
- --Quote-Font-Size:calc(var(--Body-Font-Size) - 1.3px);
- /*--- READMORE SETTINGS ---*/
- --Shorten-LongPosts:yes;
- --LongPosts-Action:expand; /* choose: expand | postlink */
- --LongPosts-Expand-Speed:420ms; /* in ms ONLY. */
- --LongPosts-Expand-Text:"keep reading"; /* keep between the quotes */
- /*--- TAGS SETTINGS ---*/
- --Tags-Fade-Speed-MS:269; /* fade speed without suffix */
- --Tags-Fade-Speed-MS-SFX:269ms; /* fade speed with suffix */
- --Tags-Spacing:4px;
- /*--- PERMALINK SETTINGS ---*/
- --Permalink-Padding:15px;
- --Permalink-Text-Size:calc(var(--Body-Font-Size) - 3px);
- /*--- POST BUTTONS SETTINGS ---*/
- --Post-Buttons-Size:var(--Body-Font-Size);
- --Post-Buttons-Color:{color:post buttons};
- --Like-Button-Liked:{color:like button liked};
- --Post-Buttons-Spacing:4px;
- /*--- POST NOTES SETTINGS ---*/
- --Notes-Indicator-Size:14px;
- --Notes-Indicator-Gap-Right:7px;
- --Notes-Row-Spacing:10px;
- /*--- MISC ---*/
- --Center-Gap:{select:center gap};
- --Pagination-Color:{color:text};
- --TumblrControls-Color:{select:tumblr controls color};
- --Scrollbar-Padding:13px;
- }
- /*---- TOP BAR ----*/
- .topbar {
- position:fixed;
- top:0;left:0;
- width:100%;
- height:var(--TopBar-Height);
- background:{color:top bar};
- z-index:6;
- }
- /*---- BIG CONTAINER ----*/
- .vojjg {
- position:absolute;
- margin:0 auto;
- top:0;left:0;right:0;
- margin-top:var(--TopBar-Height);
- height:calc(100% - var(--TopBar-Height));
- text-align:center;
- overflow-y:scroll;
- overflow-x:hidden;
- overscroll-behavior-y:none;
- }
- @-moz-document url-prefix(){
- .vojjg {
- scrollbar-width:thin; /* firefox only */
- }
- }
- .uqune {
- display:inline-block;
- text-align:initial;
- margin-left:var(--Main-Content-Shift);
- }
- /*---- LEFT SIDEBAR ----*/
- .jinbar {
- position:fixed;
- top:0;margin-top:calc(0px - var(--TopBar-Height));
- width:var(--Sidebar-Width);
- height:calc(100% + var(--TopBar-Height));
- display:table;
- }
- .uoooo {
- display:table-cell;
- vertical-align:middle;
- }
- .uoooo > * + * {
- margin-top:var(--Sidebar-Stuff-Spacing);
- }
- /*---- SIDEBAR IMAGE ----*/
- .sb-img-cont {
- display:flex;
- justify-content:center;
- }
- .sb-img-cont img {
- width:{select:sidebar image width};
- max-width:none;
- }
- /*---- SIDEBAR TITLE ----*/
- .sb-title {
- font-family:{select:sidebar title font};
- font-size:{select:sidebar title size};
- color:{color:sidebar title};
- text-align:center;
- }
- .sb-title[sbt-font="eri ji"]{
- font-family:eri ji;
- font-size:calc({select:sidebar title size} + 3px);
- -webkit-text-stroke-width:.3px;
- -webkit-text-stroke-color:{color:sidebar title};
- }
- .sb-title[sbt-font="htskfrnds"]{
- font-family:hatsukoi friends;
- }
- .sb-title[sbt-font="ness"]{
- font-family:ness;
- letter-spacing:2.5px;
- -webkit-text-stroke-width:.3px;
- -webkit-text-stroke-color:{color:sidebar title};
- }
- .sb-title[sbt-font="dreaming outloud"]{
- font-family:dreaming outloud;
- font-size:calc({select:sidebar title size} + 3px);
- letter-spacing:.5px;
- }
- /*---- SIDEBAR DESCRIPTION ----*/
- .sb-title + .desc {
- margin-top:calc(var(--Sidebar-Stuff-Spacing) / 1.69);
- }
- .desc {
- font-family:{select:desc font};
- font-size:{select:desc font size};
- color:{color:desc text};
- text-align:{select:desc text align};
- line-height:var(--Line-Height);
- }
- .desc[desctf="Libre Franklin"]{
- letter-spacing:0.1px;
- }
- .desc[desctf="Manrope"]{
- letter-spacing:0.3px;
- }
- .desc b, .desc strong {
- font-weight:normal;
- color:{color:desc bold};
- -webkit-text-stroke-width:.3px;
- -webkit-text-stroke-color:{color:desc bold};
- }
- .desc i:not([class]), .desc em:not([class]){
- color:{color:desc italic};
- }
- .dyn {
- --phlesk:calc((({select:desc font size} * var(--Line-Height-INT)) - {select:desc font size}) / 2);
- margin:calc(0px - var(--phlesk)) 0;
- }
- .desc a {
- color:{color:desc link};
- padding-bottom:.5px;
- border-bottom:1px solid rgba({RGBcolor:desc link},0.3);
- }
- /*---- NAVLINKS ----*/
- .navlinks {
- display:flex;
- }
- .navlinks a {
- display:block;
- flex:1;
- height:var(--Navlinks-Bar-Height);
- transition:background var(--Navlinks-Fade-Speed) ease-in-out;
- }
- .navlinks a:first-child {
- border-radius:var(--Navlinks-Bar-Roundness) 0 0 var(--Navlinks-Bar-Roundness);
- background:{color:sidebar link 1};
- }
- .navlinks a:first-child:hover {
- background:{color:sidebar link 1 hover};
- }
- .navlinks a:nth-child(2){
- background:{color:sidebar link 2};
- }
- .navlinks a:nth-child(2):hover {
- background:{color:sidebar link 2 hover};
- }
- .navlinks a:nth-child(3){
- background:{color:sidebar link 3};
- }
- .navlinks a:nth-child(3):hover {
- background:{color:sidebar link 3 hover};
- }
- .navlinks a:last-child {
- border-radius:0 var(--Navlinks-Bar-Roundness) var(--Navlinks-Bar-Roundness) 0;
- background:{color:sidebar link 4};
- }
- .navlinks a:last-child:hover {
- background:{color:sidebar link 4 hover};
- }
- /*---- CUSTOM LINKS ----*/
- .honeydew {
- display:flex;
- line-height:var(--Line-Height);
- --b0rk:calc((({select:customlinks size} * var(--Line-Height-INT)) - {select:customlinks size}) / 2);
- }
- .honeydew + .honeydew {
- margin-top:calc(0px - var(--b0rk));
- padding-top:var(--CustomLinks-Row-Spacing);
- }
- .honeydew * {
- display:block;
- flex-shrink:0;
- line-height:var(--Line-Height);
- transition:color var(--CustomLinks-Fade-Speed) ease-in-out, background var(--CustomLinks-Fade-Speed) ease-in-out;
- }
- .honeydew [num]{
- font-family:space mono;
- font-size:calc({select:customlinks size} + 1px);
- letter-spacing:1px;
- color:{color:customlinks number};
- -webkit-text-stroke-width:.1px;
- -webkit-text-stroke-color:{color:customlinks number};
- }
- .honeydew:hover [num]{
- color:{color:customlinks hover number};
- }
- .honeydew [le-line]{
- margin-top:calc(var(--b0rk) + ({select:customlinks size} / 2) - (var(--CustomLinks-Line-Thickness) / 2));
- margin-left:calc(var(--CustomLinks-Line-Spacing) - 3px);
- margin-right:var(--CustomLinks-Line-Spacing);
- width:var(--CustomLinks-Line-Width);
- height:var(--CustomLinks-Line-Thickness);
- background:{color:customlinks line};
- transform:perspective(0);
- }
- .honeydew:hover [le-line]{
- background:{color:customlinks hover line};
- }
- .honeydew [cltxt]{
- font-family:var(--SmallCaps-Font-Family);
- font-size:{select:customlinks size};
- text-transform:uppercase;
- letter-spacing:.5px;
- color:{color:customlinks text};
- flex:1;
- }
- .honeydew:hover [cltxt]{
- color:{color:customlinks hover text};
- }
- .honeydew:first-child {
- margin-top:calc(0px - var(--b0rk));
- }
- .honeydew:last-child {
- margin-bottom:calc(0px - var(--b0rk));
- }
- /*---- SEARCHBAR ----*/
- .mr-starch[m7="hide"]{
- display:none;
- }
- .mr-starch form {
- display:flex;
- align-items:center;
- }
- .mr-starch form > * {
- flex-shrink:0;
- }
- .mr-starch input {
- display:block;
- flex:1;
- outline:none;
- padding:var(--Searchbar-Text-Padding);
- background:{color:searchbar bg};
- border:1px solid {color:searchbar border};
- border-radius:2px;
- font-family:var(--SmallCaps-Font-Family);
- font-size:var(--SmallCaps-Font-Size);
- text-transform:uppercase;
- letter-spacing:.7px;
- color:{color:searchbar text};
- line-height:1em;
- }
- .mr-starch input::placeholder {
- color:rgba({RGBcolor:searchbar text},0.8);
- }
- .mr-starch button {
- display:block;
- outline:none;
- margin-left:var(--Searchbar-Icon-Spacing);
- align-self:stretch;
- box-sizing:border-box;
- background:{color:searchbar icon bg};
- border:1px solid {color:searchbar icon border};
- border-radius:2px;
- cursor:pointer;
- }
- .mr-starch .aa-line-icons {
- display:block;
- --Line-Icons-Size:var(--Searchbar-Icon-Size);
- --Line-Icons-Color:{color:searchbar icon};
- }
- @-moz-document url-prefix(){
- .mr-starch .aa-line-icons {
- padding:0 1px;
- }
- }
- /*---- PAGINATION ----*/
- .sbpagi {
- display:flex;
- align-items:center;
- justify-content:space-between;
- margin-left:calc(var(--Pagination-Spacing) / -2);
- margin-right:calc(var(--Pagination-Spacing) / -2);
- font-family:space mono;
- font-size:var(--Pagination-Numbers-Size);
- line-height:1em;
- }
- .sbpagi[brd="show"]{
- position:relative;
- padding-top:calc(var(--Sidebar-Stuff-Spacing) - (var(--Pagination-Spacing) / 2));
- }
- .sbpagi[brd="show"]:before {
- content:"";
- position:absolute;
- top:0;left:0;
- margin-top:-1px;
- margin-left:calc(var(--Pagination-Spacing) / 2);
- width:calc(100% - var(--Pagination-Spacing));
- height:1px;
- background:{color:pagination border};
- transform:perspective(0);
- }
- .botpagi[brd="show"]{
- padding-top:calc(var(--Post-Spacing) - (var(--Pagination-Spacing) / 2));
- }
- [pagi-place="bbt"] .jinbar .sbpagi {
- display:none;
- }
- [pagi-place="sb"] .botpagi {
- display:none;
- }
- .botpagi {
- margin-top:var(--Post-Spacing);
- justify-content:center;
- }
- .sbpagi * {
- padding:0 calc(var(--Pagination-Spacing) / 2);
- flex-shrink:0;
- }
- .sbarlynk {
- display:flex;
- align-items:center;
- }
- .sbarlynk i {
- padding:0;
- }
- .sbarlynk i + i {
- margin-left:calc(0px - (var(--Pagination-Arrows-Size) / 2) - 1px);
- }
- .sbarlynk:not([href]){
- visibility:hidden;
- }
- .sbp-mid {
- display:flex;
- align-items:center;
- }
- .botpagi .sbp-mid {
- margin:0 calc(var(--Pagination-Spacing) / 2);
- }
- .curpagi, .othernumz {
- color:{color:pagination numbers};
- }
- .curpagi {
- font-size:calc(var(--Pagination-Numbers-Size) * 1.5);
- cursor:default;
- }
- .sbpagi [class*="ph-"]{
- display:flex;
- font-size:var(--Pagination-Arrows-Size);
- color:{color:pagination arrows};
- }
- /*---- POST CONTAINER ----*/
- .jinbar + .postscont {
- margin-left:calc(var(--Sidebar-Width) + var(--Center-Gap));
- }
- .postscont {
- margin:var(--Screen-Margin) 0;
- {block:IndexPage}
- min-width:calc((var(--Post-Total-Width) * var(--Post-Columns)) + var(--Post-Columns-Spacing) * (var(--Post-Columns) - 1));
- {/block:IndexPage}
- {block:PermalinkPage}
- min-width:var(--Post-Total-Width);
- {/block:PermalinkPage}
- }
- .posts {
- width:calc(var(--Post-Width) + (var(--Post-Padding) * 2) + 2px);
- overflow:hidden;
- }
- .posts + .posts {
- padding-top:var(--Post-Spacing);
- }
- .postscont .col-column {
- width:initial;
- }
- .postscont .col-column + .col-column {
- padding-left:var(--Post-Columns-Spacing);
- }
- [black-and-white="on"] img,
- [black-and-white="on"] iframe,
- [black-and-white="on"] video {
- transition:filter var(--Grayscale-Transition-Speed) ease-in-out;
- filter:var(--Grayscale-Settings);
- }
- [black-and-white="on"] .posts:hover img,
- [black-and-white="on"] .posts:hover iframe,
- [black-and-white="on"] .posts:hover video {
- filter:none;
- }
- /*-----------------------*/
- .postinner {
- position:relative;
- padding:var(--Post-Padding);
- background:{color:post};
- border:1px solid {color:post borders outer};
- line-height:var(--Line-Height);
- border-radius:{text:post corner roundness};
- }
- .postinner.envee {
- overflow:hidden;
- }
- .postinner, .envee {
- transition:height var(--LongPosts-Expand-Speed) ease-in-out;
- }
- .postinner.envee:after {
- content:"";
- position:absolute;
- bottom:0;left:0;
- width:100%;
- height:calc(var(--Post-Padding) + var(--Captions-Gap));
- background:{color:post};
- z-index:1;
- }
- .ensheet {
- position:absolute;
- bottom:0;
- margin-bottom:calc(var(--Post-Padding) + var(--Captions-Gap));
- left:0;
- width:100%;
- height:69px;
- background:linear-gradient(to bottom, transparent, {color:post});
- z-index:1;
- }
- .lynxy {
- position:absolute;
- bottom:0;margin-bottom:calc(var(--Post-Padding) + 4px);
- left:0;
- width:100%;
- display:flex;
- align-items:center;
- justify-content:center;
- z-index:2;
- }
- .lynxy.nyh a {
- cursor:help;
- }
- .lynxy a {
- padding:0.69em 0.8em;
- background:{color:label bg};
- border-radius:3px;
- font-family:var(--SmallCaps-Font-Family);
- font-size:calc(var(--SmallCaps-Font-Size));
- text-transform:uppercase;
- letter-spacing:.5px;
- color:{color:label text};
- line-height:1em;
- }
- [has-date] .postinner {
- border-radius:{text:post corner roundness} {text:post corner roundness} 0 0;
- }
- .postinner a:not(.reblog-url a, .tumblr_blog, .linkpost-title, .single-photo, .post_media_photo_anchor, .post_media_photo_anchor, .inari, .tagsdiv a, .lynxy a), .msgbby a {
- padding-bottom:.5px;
- border-bottom:1px solid rgba({RGBcolor:link},0.420);
- }
- .pinzz {
- position:absolute;
- margin-top:10px;
- margin-left:10px;
- padding:6px 8px;
- background:{color:label bg};
- border-radius:3px;
- font-family:var(--SmallCaps-Font-Family);
- font-size:var(--SmallCaps-Font-Size);
- text-transform:uppercase;
- letter-spacing:.5px;
- color:{color:label text};
- line-height:1em;
- cursor:default;
- transition:opacity .4s ease-in-out;
- }
- .posts:hover .pinzz {
- opacity:0;
- }
- .postinner b, .postinner strong {
- font-weight:normal;
- -webkit-text-stroke-width:.3px;
- -webkit-text-stroke-color:{color:bold};
- color:{color:bold}!important;
- }
- .postinner i:not([class]), .postinner em:not([class]){
- color:{color:italic};
- }
- .postinner b a,
- .postinner strong a,
- .postinner h1 a,
- .postinner h2 a,
- .postinner h3 a,
- .postinner h4 a,
- .postinner h5 a,
- .postinner h6 a {
- -webkit-text-stroke-width:.3px;
- -webkit-text-stroke-color:{color:link};
- }
- /*---- REBLOG HEAD ----*/
- .reblog-wrap {
- margin:0 calc(0px - var(--Post-Padding));
- padding:0 var(--Post-Padding);
- }
- .reblog-wrap + .reblog-wrap {
- margin-top:var(--Reblogs-Spacing);
- padding-top:var(--Reblogs-Spacing);
- border-top:1px solid var(--Reblogs-Border);
- }
- .reblog-head {
- display:flex;
- align-items:center;
- }
- /*------------*/
- .reblog-head [class*="ph-"]{
- font-size:calc(var(--Body-Font-Size) + 2px);
- color:var(--Reblogger-Username-Color);
- }
- .reblog-head [class*="ph-"] + .reblog-url {
- position:relative;
- margin-left:var(--Reblogger-Avatar-Gap-Right);
- padding-left:calc(var(--Reblogger-Username-Line-Width) + var(--Reblogger-Avatar-Gap-Right));
- }
- .reblog-head [class*="ph-"] + .reblog-url:before {
- content:"";
- position:absolute;
- left:0;
- top:50%;transform:translateY(-50%) perspective(0);
- width:var(--Reblogger-Username-Line-Width);
- height:1px;
- background:var(--Reblogger-Username-Line-Color);
- }
- /*------------*/
- .reblog-url, .reblog-url a, [customize-page="true"] .tumblr_blog {
- font-family:var(--SmallCaps-Font-Family);
- font-size:calc(var(--SmallCaps-Font-Size) + .5px);
- text-transform:uppercase;
- letter-spacing:.7px;
- color:var(--Reblogger-Username-Color);
- }
- .reblog-url .deac {
- margin-left:3px;
- color:var(--Body-Text-Color);
- }
- .reblog-head + .reblog-comment {
- margin-top:calc(0px - var(--Paragraph-Margins) + var(--Reblogger-Avatar-Bottom-Gap));
- }
- /*---- NPF... STUFF ----*/
- figure[data-orig-src] + figure[data-orig-src]{
- margin-top:var(--Photoset-Spacing);
- }
- .tmblr-full video {
- cursor:pointer;
- }
- video::-webkit-media-controls-panel {
- position:absolute;
- bottom:0;
- background:transparent!important;
- width:100%;
- box-sizing:border-box;
- opacity:1!important;
- }
- video::-webkit-media-controls-volume-slider, video::-webkit-media-controls-timeline {
- display:none!important;
- }
- * + .npf-link-block {
- margin-top:10px;
- }
- .npf-link-block {
- margin-top:0px;
- margin-bottom:0;
- border-color:{color:special border}!important;
- border-radius:0!important;
- }
- .npf-link-block + * {
- margin-bottom:var(--Paragraph-Margins);
- }
- .npf-link-block a {
- padding:0!important;
- border:none!important;
- }
- .npf-link-block .title {
- font-family:var(--SmallCaps-Font-Family)!important;
- font-size:calc(var(--SmallCaps-Font-Size) + 4px)!important;
- text-transform:uppercase;
- letter-spacing:.5px;
- color:{color:link}!important;
- line-height:1.7em!important;
- text-shadow:1px 1px 1px rgba(0,0,0,0.1);
- }
- .npf-link-block .bottom {
- background:{color:special background}!important;
- }
- .npf-link-block .description {
- font-family:var(--SmallCaps-Font-Family)!important;
- font-size:calc(var(--SmallCaps-Font-Size) + 2px)!important;
- text-transform:uppercase;
- letter-spacing:.5px;
- color:{color:link}!important;
- -webkit-text-stroke-width:.3px;
- -webkit-text-stroke-color:{color:link};
- line-height:1.7em!important;
- }
- .npf-link-block .site-name {
- text-transform:initial!important;
- font-family:var(--Body-Font-Family)!important;
- font-weight:normal!important;
- font-size:var(--Body-Font-Size)!important;
- color:{color:special text}!important;
- }
- .npf-link-block .description + .site-name {
- margin-top:0;
- }
- .npf-link-block.no-poster .title {
- padding:0.8em!important;
- text-shadow:none!important;
- }
- .npf-link-block.no-poster .title + .bottom {
- border-top:1px solid {color:special border};
- }
- /*---- TEXT POSTS (TITLE) ----*/
- .post-title, .linkpost-title {
- margin-top:2px;
- margin-bottom:0;
- padding:0.8em;
- background:{color:special background};
- border:1px solid {color:special border};
- border-radius:3px;
- font-size:var(--Heading-Font-Size);
- color:{color:special text};
- -webkit-text-stroke-width:0.3px;
- -webkit-text-stroke-color:{color:special text}!important;
- text-align:center;
- }
- .post-title + *, .linkpost-title + * {
- margin-top:var(--Heading-Margins);
- }
- /*---- LINK POSTS (TITLE) ----*/
- .linkpost-title {
- display:flex;
- align-items:center;
- justify-content:space-between;
- color:{color:special text};
- text-align:left;
- }
- .linkpost-title span {
- display:block;
- max-width:calc(100% - (var(--Heading-Font-Size) * 1.1) - 10px - 2px);
- }
- span + .linksym {
- margin-left:10px;
- margin-right:2px;
- }
- .linksym {
- width:calc(var(--Heading-Font-Size) * 1.1);
- height:calc(var(--Heading-Font-Size) * 1.1);
- -webkit-mask-size:contain;
- -webkit-mask-repeat:no-repeat;
- -webkit-mask-position:center;
- -webkit-mask-image:var(--ext);
- background:{color:special text};
- }
- .linkpost-title + .link-excerpt {
- margin-top:-1px;
- }
- .link-excerpt {
- padding:0.8em calc(0.8em + 2px);
- border:1px solid {color:post borders inner};
- }
- .link-excerpt + * {
- margin-top:var(--Heading-Margins);
- }
- .le-host {
- font-family:var(--SmallCaps-Font-Family);
- font-size:var(--SmallCaps-Font-Size);
- text-transform:uppercase;
- letter-spacing:.7px;
- }
- /*---- PHOTO POSTS ----*/
- a.single-photo {
- cursor:pointer;
- }
- img.photopic {
- width:100%;
- }
- [photoset-layout] {
- grid-gap:var(--Photoset-Spacing);
- }
- [photoset-layout] div {
- cursor:pointer;
- backface-visibility:hidden;
- }
- .caption {
- margin-top:var(--Captions-Gap);
- }
- /*----- LIGHTBOX BS -----*/
- .tmblr-lightbox, #tumblr_lightbox {
- background-color:rgba({RGBcolor:post},0.69)!important;
- }
- .tmblr-lightbox .vignette {
- background-image:none!important;
- }
- #vignette {display:none!important}
- .lightbox-image, #tumblr_lightbox_left_image, #tumblr_lightbox_center_image, #tumblr_lightbox_right_image {
- margin-top:calc(0px - var(--Post-Padding));
- }
- .tmblr-lightbox img, #tumblr_lightbox img {
- max-width:initial;
- box-shadow:none!important;
- padding:var(--Post-Padding);
- background:{color:post}!important;
- border:1px solid {color:post borders outer}!important;
- border-radius:{text:post corner roundness}!important;
- }
- /*----- QUOTE POSTS -----*/
- .SHAAAA {
- position:relative;
- display:flex;
- align-items:center;
- justify-content:center;
- margin-bottom:var(--Heading-Margins);
- --oni:calc(var(--Body-Font-Size) * 1.420);
- --onigap:12px;
- --onilyn:50%;
- }
- .SHAAAA:before {
- content:"";
- position:absolute;
- top:0;margin-top:calc(var(--oni) / 2);
- left:0;margin-left:calc(50% - var(--onilyn));
- width:calc(var(--onilyn) - (var(--oni) / 2) - var(--onigap));
- height:1px;
- transform:perspective(0);
- background:linear-gradient(to right, transparent 0%, {color:post borders inner} 80%, transparent 100%);
- }
- .SHAAAA:after {
- content:"";
- position:absolute;
- top:0;margin-top:calc(var(--oni) / 2);
- right:0;margin-right:calc(50% - var(--onilyn));
- width:calc(var(--onilyn) - (var(--oni) / 2) - var(--onigap));
- height:1px;
- transform:perspective(0);
- background:linear-gradient(to left, transparent 0%, {color:post borders inner} 80%, transparent 100%);
- }
- .SHAAAA [class*="ph-"]{
- display:block;
- font-size:var(--oni);
- line-height:1em;
- color:{color:headings};
- }
- .quote-words, .npf_quote {
- padding:0 var(--Post-Padding);
- font-family:var(--Quote-Font-Family)!important;
- font-size:var(--Quote-Font-Size)!important;
- text-transform:uppercase;
- letter-spacing:.3px;
- text-align:center;
- color:{color:headings};
- -webkit-text-stroke-width:.3px;
- -webkit-text-stroke-color:{color:headings};
- line-height:169%;
- }
- .quote-words + .quote-source,
- .npf_quote + p[style*="margin-bottom: 0px;"]{
- margin-top:var(--Paragraph-Margins);
- text-align:center;
- }
- /*----- VIDEO POSTS -----*/
- .tmblr-video {
- max-width:initial;
- }
- .tumblr_video_container, .tumblr_video_iframe {
- width:100%!important;
- }
- /*---- CHAT POSTS ----*/
- .chatwrap {
- display:table;
- width:calc(100% - 2px);
- border:1px solid var(--Post-Borders-Inner);
- border-radius:3px;
- }
- .chat_row {
- position:relative;
- display:table-row;
- overflow:hidden;
- }
- .chat_row:after {
- content:"";
- position:absolute;
- bottom:0;left:0;
- transform:translateY(-.5px);
- width:100%;
- height:1px;
- background:var(--Post-Borders-Inner);
- }
- .chatwrap .chat_row:last-child:after {
- display:none;
- }
- .chat_row code:only-child {
- display:block;
- padding:0.8em;
- border:none;
- background:transparent;
- }
- .chat_label {
- display:table-cell;
- padding:1em;
- padding-right:1em;
- }
- .chat_content {
- display:table-cell;
- padding:1em;
- width:60%;
- }
- .chat_label + .chat_content {
- border-left:1px solid var(--Post-Borders-Inner);
- }
- /*---- AUDIO POSTS ----*/
- .audio-post .npf_inst img {
- width:100%;
- }
- .aud-emb {display:none}
- .audiowrap {
- display:flex;
- align-items:center;
- }
- .albumwrap {
- position:relative;
- width:var(--Audio-Post-Album-Size);
- height:var(--Audio-Post-Album-Size);
- display:flex;
- align-items:center;
- justify-content:center;
- }
- .albumwrap[has-cover] .audplac {display:none}
- .butts {
- width:calc(var(--Audio-Post-Buttons-Size) + (var(--Audio-Post-Buttons-Padding) * 2));
- height:calc(var(--Audio-Post-Buttons-Size) + (var(--Audio-Post-Buttons-Padding) * 2));
- background:var(--Audio-Post-Buttons-Background);
- border-radius:100%;
- display:flex;
- align-items:center;
- justify-content:center;
- cursor:pointer;
- z-index:2;
- }
- .overplay, .overpause {
- width:var(--Audio-Post-Buttons-Size);
- height:var(--Audio-Post-Buttons-Size);
- -webkit-mask-size:contain;
- -webkit-mask-repeat:no-repeat;
- -webkit-mask-position:center;
- background:var(--Audio-Post-Buttons-Color);
- }
- .overplay {
- margin-left:2px;
- -webkit-mask-image:var(--audioplay);
- }
- .overpause {
- display:none;
- -webkit-mask-image:var(--audiopause);
- }
- .ov-y {display:block}
- .ov-z {display:none}
- .audplac {
- position:absolute;
- top:0;left:0;
- width:var(--Audio-Post-Album-Size);
- height:var(--Audio-Post-Album-Size);
- background:var(--Audio-Post-Buttons-Background);
- }
- .albumwrap img {
- position:absolute;
- top:0;left:0;
- width:100%;
- height:100%;
- }
- .audiotxt {
- flex:1;
- height:var(--Audio-Post-Album-Size);
- padding:var(--Audio-Post-Album-Right-Gap);
- background:{color:special background};
- display:flex;
- align-items:center;
- box-sizing:border-box;
- display:flex;
- align-items:center;
- justify-content:space-between;
- --AUD-Font-Size:calc(var(--Body-Font-Size) - 1px);
- font-size:var(--AUD-Font-Size);
- color:{color:special text};
- line-height:var(--Line-Height);
- --flesk:calc(((var(--AUD-Font-Size) * var(--Line-Height-INT)) - var(--AUD-Font-Size)) / 2);
- }
- .odin div {
- margin:calc(0px - var(--flesk)) 0;
- }
- .odin div + div {
- margin-top:3px;
- }
- .aud-song-name, .npf-audio-title {
- font-family:var(--SmallCaps-Font-Family);
- font-size:calc(var(--Body-Font-Size) - 2px);
- text-transform:uppercase;
- letter-spacing:.5px;
- -webkit-text-stroke-width:.3px;
- -webkit-text-stroke-color:{color:special text};
- }
- .aud-song-name[has-name] .untit {
- display:none;
- }
- .aud-artist[has-artist] .unart {
- display:none;
- }
- .inari {
- display:block;
- padding:6px;
- margin-right:-6px;
- cursor:pointer;
- }
- .int-all {
- display:block;
- width:calc(var(--Audio-Post-Buttons-Size) + 4px);
- height:calc(var(--Audio-Post-Buttons-Size) + 4px);
- -webkit-mask-size:contain;
- -webkit-mask-repeat:no-repeat;
- -webkit-mask-position:center;
- -webkit-mask-image:var(--install);
- background:var(--Audio-Post-Download-Color);
- }
- /*---- SPOTIFY ----*/
- iframe[src*='open.spotify.com'][src*='track'], figure[data-npf*='open.spotify.com'][data-npf*='track']{
- height:80px!important;
- }
- .spotify_audio_player {
- width:100%;
- }
- /*---- SOUNDCLOUD ----*/
- .tmblr-video iframe[src*='soundcloud.com']{
- }
- .audio-soundcloud {
- max-height:113px;
- border-radius:4px;
- overflow:hidden;
- }
- .soundcloud_audio_player {
- margin:-1px;
- margin-bottom:0;
- width:calc(100% + 2px);
- max-width:initial;
- }
- /*---- ASK/ANSWER POSTS ----*/
- .une_question {
- display:flex;
- }
- .asker-person {
- align-self:baseline;
- }
- .une_question .reblog-comment {
- flex:1;
- margin-left:12px;
- }
- .askpot {
- padding:var(--AskerPortrait-Padding);
- background:{color:special background};
- border:1px solid {color:special border};
- }
- .asker-person img {
- width:var(--AskerPortrait-Size);
- height:var(--AskerPortrait-Size);
- border-radius:0;
- }
- .une_question .reblog-url {
- margin-top:1px;
- padding:3px 4px;
- background:{color:special background};
- border:1px solid {color:special border};
- border-radius:2px;
- color:{color:special text};
- }
- .question_text > p:first-child {
- margin-top:4px;
- }
- .question_text > p:only-child {
- margin-bottom:0;
- }
- .answerer + * {
- margin-top:var(--Captions-Gap);
- }
- .une_question + .une_reponse {
- margin-top:var(--Paragraph-Margins);
- }
- /*---- TAGS SECTION ----*/
- .tagsdiv {
- margin-top:var(--Captions-Gap);
- }
- .tagsdiv[clicktags="yes"] {
- {block:IndexPage}
- display:none;
- opacity:0;
- transition:opacity var(--Tags-Fade-Speed-MS-SFX) ease-in-out;
- {/block:IndexPage}
- }
- .tagsfade {
- opacity:1!important;
- }
- .tagsin {
- display:flex;
- flex-wrap:wrap;
- justify-content:flex-end;
- margin:calc(0px - var(--Tags-Spacing));
- /*margin-top:calc(var(--Captions-Gap) - var(--Tags-Spacing));*/
- margin-bottom:calc((((var(--SmallCaps-Font-Size) - 1px) * var(--Line-Height-INT)) / 2) * -1);
- }
- .tagsin a {
- position:relative;
- display:block;
- margin:0 var(--Tags-Spacing);
- font-family:var(--SmallCaps-Font-Family);
- font-size:calc(var(--SmallCaps-Font-Size) - 1px);
- text-transform:uppercase;
- letter-spacing:.7px;
- color:{color:tags};
- }
- .tagsin a:before {
- content:"#";
- font-family:work sans;
- margin-right:.5px;
- }
- /*---- PERMALINK BAR ----*/
- .permadiv {
- margin-top:-1px;
- display:flex;
- align-items:center;
- justify-content:space-between;
- padding:calc(var(--Permalink-Padding) - 2px) calc(var(--Post-Padding) + 1px);
- background:{color:permalink background};
- border:1px solid {color:post borders outer};
- border-top:1px solid {color:permalink border};
- border-radius:0 0 {text:post corner roundness} {text:post corner roundness};
- font-family:var(--SmallCaps-Font-Family);
- font-size:var(--Permalink-Text-Size);
- text-transform:uppercase;
- letter-spacing:.5px;
- }
- .permadiv, .permadiv a {
- color:{color:permalink text};
- }
- .permaleft {
- text-transform:uppercase;
- letter-spacing:.7px;
- word-spacing:1px;
- }
- .permaleft a {
- display:flex;
- align-items:center;
- margin:calc(0px - var(--Post-Padding));
- margin-right:0;
- padding:var(--Post-Padding);
- padding-right:2px;
- }
- .permaleft .aa-line-icons {
- display:block;
- align-items:center;
- --Line-Icons-Size:calc(var(--Permalink-Text-Size) + 3px);
- --Line-Icons-Color:{color:permalink text};
- margin-right:7px;
- }
- .pin-ah + .aa-line-icons {
- display:none;
- }
- .permaleft .nc-ah {
- --Line-Icons-Size:var(--Permalink-Text-Size);
- margin-left:3px;
- margin-right:0;
- }
- .permaright {
- display:flex;
- align-items:center;
- justify-content:center;
- }
- .permaright a {
- display:block;
- position:relative;
- {block:IndexPage}
- width:var(--Post-Buttons-Size);
- height:var(--Post-Buttons-Size);
- {/block:IndexPage}
- backface-visibility:hidden;
- }
- .permaright .iconsax {
- display:block;
- --Iconsax-Size:var(--Post-Buttons-Size);
- --Iconsax-Color:var(--Post-Buttons-Color);
- backface-visibility:hidden;
- }
- .permaright .iconsax[icon-name='repeat']{
- transform-origin:center;
- transform:scaleX(1.1);
- }
- .permaright .cp {
- padding-left:1px;
- font-size:var(--Post-Buttons-Size);
- color:var(--Post-Buttons-Color);
- }
- .permaright span {display:block}
- .permaright a + a {
- margin-left:var(--Post-Buttons-Spacing);
- }
- .permaright[clicktags="no"] .clicktags {
- display:none;
- }
- .clicktags {
- cursor:help;
- }
- .like_button {
- position:absolute;
- top:0;left:0;
- width:100%;
- height:100%;
- z-index:2;
- }
- .like_button iframe {
- width:100%;
- height:100%;
- vertical-align:initial;
- opacity:0;
- }
- .like_button.liked + .cp-heart-o {
- color:var(--Like-Button-Liked);
- }
- .permaright a[dash]{
- font-size:calc(var(--SmallCaps-Font-Size) + 1px);
- }
- /*---- POST NOTES ----*/
- .notescont {
- margin-top:var(--Post-Spacing);
- padding:var(--Post-Padding);
- background:{color:post};
- border:1px solid {color:post borders outer};
- border-radius:{text:post corner roundness};
- }
- .notescont h1 {
- margin-top:5px;
- margin-bottom:calc(var(--Heading-Margins) + 2px);
- letter-spacing:1px;
- text-align:center;
- }
- .notescont ol.notes {
- padding:0;
- margin:0;
- }
- .notescont li {
- list-style-type:none;
- padding:0!important;
- line-break:anywhere;
- }
- .notescont li + li {
- margin-top:var(--Notes-Row-Spacing);
- }
- .notescont li:before {
- font-family:phosphor;
- font-size:var(--Notes-Indicator-Size);
- color:{color:text};
- vertical-align:middle;
- }
- .notescont li.like:before {
- content:"\f1ca";
- }
- .notescont li.reblog:before {
- content:"\f2c3";
- }
- .notescont li.reply:before,
- .notescont li.with_commentary:before {
- content:"\f0db"!important;
- }
- .notescont li.original_post:before {
- content:"\f0da";
- }
- .notescont .avatar_frame {
- display:none;
- }
- .notescont .avatar_frame + .action {
- margin-left:var(--Notes-Indicator-Gap-Right);
- }
- .notescont .action a {
- font-family:var(--SmallCaps-Font-Family);
- font-size:calc(var(--SmallCaps-Font-Size) - 0px);
- text-transform:uppercase;
- letter-spacing:.7px;
- color:var(--Reblogger-Username-Color);
- }
- .notescont blockquote {
- margin-left:calc(var(--Notes-Indicator-Size) / 2);
- padding-left:calc((var(--Notes-Indicator-Size) / 2) + var(--Notes-Indicator-Gap-Right));
- }
- .more_notes_link_container {
- margin-top:1em!important;
- margin-bottom:calc(var(--Paragraph-Margins) / 2);
- }
- .more_notes_link, .notes_loading {
- font-family:var(--SmallCaps-Font-Family);
- font-size:calc(var(--SmallCaps-Font-Size) + 1px);
- text-transform:uppercase;
- letter-spacing:.5px;
- color:{color:link};
- }
- /*---- MUSIC PLAYER ----*/
- .m-usicplayer {
- position:fixed;
- bottom:0;margin-bottom:var(--MusicPlayer-Corner-Offset);
- left:0;margin-left:var(--MusicPlayer-Corner-Offset);
- z-index:20;
- }
- .wwwh {
- display:flex;
- align-items:center;
- }
- .m-usicplayer [class*="ph-"]{
- display:block;
- font-size:var(--MusicPlayer-Buttons-Size);
- color:{color:musicplayer buttons};
- line-height:0;
- }
- .pl-c {display:block;}
- .pa-c {display:none;}
- .bhh {display:none;}
- .bhz {display:block;}
- .sngsym {
- height:calc(var(--MusicPlayer-Buttons-Size));
- display:flex;
- align-items:center;
- margin-left:var(--MusicPlayer-Note-Left-Gap);
- --Line-Icons-Size:calc(var(--MusicPlayer-Buttons-Size) - 3px);
- --Line-Icons-Color:{color:musicplayer note};
- }
- .sngtxt {
- margin-left:var(--MusicPlayer-Text-Left-Gap);
- font-family:var(--SmallCaps-Font-Family);
- font-size:var(--MusicPlayer-Text-Size);
- text-transform:uppercase;
- letter-spacing:.3px;
- word-spacing:.7px;
- color:{color:musicplayer text};
- line-height:var(--MusicPlayer-Buttons-Size);
- }
- .sngtxt a {
- color:{color:musicplayer link};
- padding-bottom:.5px;
- border-bottom:1px solid rgba({RGBcolor:musicplayer link},0.420);
- }
- /*---- OTHER ----*/
- .healsdeez {
- position:fixed;
- display:block;
- bottom:0;right:0;
- padding-bottom:8px;
- padding-right:16px;
- z-index:20;
- }
- .healsdeez {
- width:38px;
- filter:hue-rotate(-27deg) brightness(110%) contrast(95%) saturate(80%);
- }
- .msgbby {
- position:fixed;
- top:0;margin-top:calc(var(--TopBar-Height) + 18px);
- left:0;margin-left:18px;
- width:225px;
- padding:10px 12px;
- background:{color:post};
- border:1px solid {color:post borders outer};
- border-radius:{text:post corner roundness};
- box-shadow:3px 3px 14px rgba({RGBcolor:post borders outer},40%);
- animation:wheee 0.69s ease-in-out;
- animation-fill-mode:forwards;
- line-height:169%;
- z-index:20;
- }
- @keyframes wheee {
- 0% {margin-left:-100%;}
- 100% {margin-left:18px;}
- }
- .msgbby {
- visibility:visible;
- }
- {CustomCSS}
- </style>
- </head>
- <!--------------------------------------------------->
- <body>
- <!---- MUSIC PLAYER ---->
- {block:ifmusicfile}
- <div class="m-usicplayer" volume="{text:music volume}">
- <div class="wwwh">
- <div class="cciuq">
- <div class="pl-c">
- <i class="ph-play-bold"></i>
- </div>
- <div class="pa-c">
- <i class="ph-pause-bold"></i>
- </div>
- </div>
- <i class="sngsym aa-line-icons" icon-name="music-2"></i>
- <div class="sngtxt">{text:music name}</div>
- <audio src="{text:music file}"></audio>
- </div>
- </div>
- {/block:ifmusicfile}
- <!---- TOP BAR ---->
- <div class="topbar"></div>
- <!---- MAIN CONTAINER ---->
- <div class="vojjg">
- <div class="uqune">
- <!---- LEFT SIDEBAR ---->
- <div class="jinbar">
- <div class="uoooo">
- <!------ SIDEBAR IMAGE ------>
- <div class="sb-img-cont" deez="{image:sidebar image}">
- <img src="{image:sidebar image}">
- </div>
- <!------ SIDEBAR TITLE ------>
- {block:ifsidebartitle}
- <div class="sb-title" sbt-font="{select:sidebar title font}">
- {text:sidebar title}
- </div>
- {/block:ifsidebartitle}
- <!------ DESCRIPTION (original vs custom) ------>
- {block:ifdescription}
- <div class="desc" desctf="{select:desc font}">
- <div class="dyn">
- {text:description}
- </div>
- </div>
- {/block:ifdescription}
- {block:ifnotdescription}
- {block:Description}
- <div class="desc" desctf="{select:desc font}">
- <div class="dyn">
- {Description}
- </div>
- </div>
- {/block:ifdescription}
- {/block:Description}
- {/block:ifnotdescription}
- <!------ NAVLINKS ------>
- <div class="navlinks">
- <a href="//{Name}.tumblr.com" title="home"></a>
- <a href="//{Name}.tumblr.com/ask" title="askbox"></a>
- <a href="//{Name}.tumblr.com/archive" title="archive"></a>
- <!-- you CAN change the sidebar credit to something else! -->
- <!-- just don't remove the whale credit in the corner! -->
- <!-- only 4 links in total please! -->
- <a href="//glenthemes.tumblr.com" title=""whimsical" theme by glenthemes ♪(^∇^*)"></a>
- </div><!--end navlinks-->
- <!------ CUSTOM LINKS ------>
- <div class="customlinks">
- {block:ifcustomlink1name}
- <a class="honeydew" href="{text:customlink 1 url}">
- <span num>001.</span>
- <span le-line></span>
- <span cltxt>{text:customlink 1 name}</span>
- </a>
- {/block:ifcustomlink1name}
- {block:ifcustomlink2name}
- <a class="honeydew" href="{text:customlink 2 url}">
- <span num>002.</span>
- <span le-line></span>
- <span cltxt>{text:customlink 2 name}</span>
- </a>
- {/block:ifcustomlink2name}
- {block:ifcustomlink3name}
- <a class="honeydew" href="{text:customlink 3 url}">
- <span num>003.</span>
- <span le-line></span>
- <span cltxt>{text:customlink 3 name}</span>
- </a>
- {/block:ifcustomlink3name}
- {block:ifcustomlink4name}
- <a class="honeydew" href="{text:customlink 4 url}">
- <span num>004.</span>
- <span le-line></span>
- <span cltxt>{text:customlink 4 name}</span>
- </a>
- {/block:ifcustomlink4name}
- {block:ifcustomlink5name}
- <a class="honeydew" href="{text:customlink 5 url}">
- <span num>005.</span>
- <span le-line></span>
- <span cltxt>{text:customlink 5 name}</span>
- </a>
- {/block:ifcustomlink5name}
- {block:ifcustomlink6name}
- <a class="honeydew" href="{text:customlink 6 url}">
- <span num>006.</span>
- <span le-line></span>
- <span cltxt>{text:customlink 6 name}</span>
- </a>
- {/block:ifcustomlink6name}
- </div><!--end customlinks-->
- <!------ SEARCHBAR ------>
- <div class="mr-starch" m7="{select:show searchbar}">
- <form action="/search" method="get">
- <input type="text" name="q" value="{SearchQuery}" placeholder="{text:searchbar text}" autocomplete="off">
- <button class="fetchh" type="submit">
- <i class="aa-line-icons" icon-name="search"></i>
- </button>
- </form>
- </div><!--end searchbar-->
- <!------ PAGINATION (sidebar) ------>
- {block:Pagination}
- <div class="sbpagi" brd="{select:pagination border}">
- <a{block:PreviousPage} href="{PreviousPage}" title="previous page"{/block:PreviousPage} class="sbarlynk">
- <i class="ph-caret-left-bold"></i>
- <i class="ph-caret-left-bold"></i>
- </a>
- <div class="sbp-mid">
- {block:JumpPagination length="6"}
- {block:CurrentPage}
- <a class="curpagi" title="you are here (page {CurrentPage})">×</a>
- {/block:CurrentPage}
- {block:JumpPage}
- <a class="othernumz" href="{URL}">{PageNumber}</a>
- {/block:JumpPage}
- {/block:JumpPagination}
- </div>
- <a{block:NextPage} href="{NextPage}" title="next page"{/block:NextPage} class="sbarlynk">
- <i class="ph-caret-right-bold"></i>
- <i class="ph-caret-right-bold"></i>
- </a>
- </div><!--sbpagi-->
- {/block:Pagination}
- </div><!--end sidebar, part 1/2-->
- </div><!--end sidebar, part 2/2-->
- <!---- POST CONTAINER ---->
- <div class="postscont" black-and-white="{select:grayscale images}">
- {block:Posts inlineMediaWidth="1280" inlineNestedMediaWidth="1280"}
- <div class="posts {PostType}-post" id="{PostID}" post-type="{PostType}" {block:NotReblog}original-post{/block:NotReblog} {block:RebloggedFrom}reblogged-post{/block:RebloggedFrom} {block:Date}has-date{/block:Date} post-url="{ShortURL}">
- <div class="postinner">
- {block:IndexPage}
- {block:PinnedPostLabel}
- <div class="pinzz">✧ pinned post ✧</div>
- {/block:PinnedPostLabel}
- {/block:IndexPage}
- <!------ POST TITLE ------>
- {block:Title}
- <h1 class="post-title">{Title}</h1>
- {/block:Title}
- <!------ TEXT POSTS ------>
- {block:Text}
- {block:NotReblog}{Body}{/block:NotReblog}
- {block:RebloggedFrom}
- {block:Reblogs}
- <div class="reblog-wrap">
- <div class="reblog-head source-head">
- <i class="ph-user"></i>
- <span class="reblog-url">
- <a href="{Permalink}">{Username}</a>
- </span>
- </div>
- <div class="reblog-comment">{Body}</div>
- </div>
- {/block:Reblogs}
- {/block:RebloggedFrom}
- {/block:Text}
- <!------ SINGLE PHOTO ------>
- {block:Photo}
- <a class="single-photo" onclick="Tumblr.Lightbox.init([{ width:{PhotoWidth-HighRes}, height:{PhotoHeight-HighRes}, low_res:'{PhotoURL-500}', high_res:'{PhotoURL-HighRes}' }]); $('body').toggleClass('tumblr_lightbox_active'); return false"><img class="photopic" src="{PhotoURL-HighRes}" alt="{PhotoAlt}"></a>
- {/block:Photo}
- <!------ PHOTOSETS ------>
- {block:Photoset}<div class="photoset-grid" photoset-layout="{PhotosetLayout}">{block:Photos}<div data-width="{PhotoWidth-HighRes}" data-height="{PhotoHeight-HighRes}" data-lowres="{PhotoURL-500}" data-highres="{PhotoURL-HighRes}" onclick="lightbox(this)"><img src="{PhotoURL-HighRes}" /></div>{/block:Photos}</div>{/block:Photoset}
- <!------ QUOTE POSTS ------>
- {block:Quote}
- <div class="SHAAAA">
- <i class="ph-quotes"></i>
- </div>
- <div class="quote-words">{Quote}</div>
- {block:Source}
- <div class="quote-source">
- <span mdash>—</span>
- {Source}
- </div>{/block:Source}
- {/block:Quote}
- <!------ LINK POSTS ------>
- {block:Link}
- <a class="linkpost-title" href="{URL}" {Target}>
- <span>{Name}</span>
- <div class="linksym"></div>
- </a>
- {block:Excerpt}
- <div class="link-excerpt">
- {Excerpt}
- {block:Host}— <a class="le-host" href="{URL}" {Target}>{Host}</a>{/block:Host}
- </div>
- {/block:Excerpt}
- {block:Description}
- <div class="link-description">
- {block:NotReblog}{Description}{/block:NotReblog}
- {block:RebloggedFrom}
- {block:Reblogs}
- <div class="reblog-wrap">
- <div class="reblog-head">
- <i class="ph-user"></i>
- <span class="reblog-url">
- <a href="{Permalink}">{Username}</a>
- </span>
- </div>
- <div class="reblog-comment">{Body}</div>
- </div>
- {/block:Reblogs}
- {/block:RebloggedFrom}
- </div>
- {/block:Description}
- {/block:Link}
- <!------ CHAT POSTS ------>
- {block:Chat}
- {block:Lines}
- <div class="chat_row">
- {block:Label}
- <div class="chat_label">{Label}</div>
- {/block:Label}
- <div class="chat_content">
- {Line}
- </div>
- </div>
- {/block:Lines}
- {/block:Chat}
- <!------ AUDIO POSTS ------>
- {block:Audio}
- <div class="audiowrap">
- {block:AudioPlayer}
- <div class="aud-emb">
- {AudioPlayer}
- </div>
- {/block:AudioPlayer}
- <div class="albumwrap" {block:AlbumArt}has-cover{/block:AlbumArt}>
- {block:AlbumArt}
- <img src="{AlbumArtURL}">
- {/block:AlbumArt}
- <div class="audplac"></div>
- <div class="butts">
- <div class="overplay"></div>
- <div class="overpause"></div>
- </div>
- </div>
- <div class="audiotxt">
- <div class="odin">
- <div class="aud-song-name" {block:TrackName}has-name{/block:TrackName}>
- <div class="untit">Untitled track</div>
- {block:TrackName}
- <div class="hastit">{TrackName}</div>
- {/block:TrackName}
- </div>
- {block:Album}
- <div class="aud-album-name">{Album}</div>
- {/block:Album}
- <div class="aud-artist" {block:Artist}has-artist{/block:Artist}>
- <div class="unart">Unknown artist</div>
- {block:Artist}
- <div class="hasart">{Artist}</div>
- {/block:Artist}
- </div>
- </div><!--odin-->
- <a class="inari" title="download" target="_blank">
- <span class="int-all"></span>
- </a>
- </div><!--audiotxt-->
- </div><!--audiowrap-->
- {/block:Audio}
- <!------ VIDEO POSTS ------>
- {block:Video}
- <div class="tmblr-video">{Video-500}</div>
- {/block:Video}
- <!------ ANSWER POSTS ------>
- {block:Answer}
- <!-- who asked? -->
- <div class="reblog-wrap une_question">
- <div class="asker-person reblog-head">
- <div class="askpot">
- <img src="{AskerPortraitURL-64}">
- </div>
- </div>
- <div class="reblog-comment">
- <span class="reblog-url">{Asker} asked:</span>
- <div class="question_text">{Question}</div>
- </div>
- </div>
- <!--------------------------------------->
- <!-- who answered? -->
- {block:Answerer}
- <div class="reblog-wrap une_reponse">
- <div class="answerer reblog-head">
- <i class="ph-user"></i>
- <span class="reblog-url">{Answerer} answered:</span>
- </div>
- <p class="answer_text">{Answer}</p>
- </div>
- <!-- additional reblogs to the ask post -->
- {block:Reblogs}
- <div class="reblog-wrap reply_container">
- <div class="replier reblog-head">
- <i class="ph-user"></i>
- <span class="reblog-url">
- <a href="{Permalink}">{Username}</a>
- </span>
- </div>
- <div class="reply">{Body}</div>
- </div>
- {/block:Reblogs}
- {/block:Answerer}
- <!--------------------------------------->
- <!-- original answer post -->
- {block:NotReblog}
- <div class="reblog-wrap une-reponse">
- <div class="answerer reblog-head">
- <i class="ph-user"></i>
- <span class="reblog-url">
- <a href="{Permalink}">{Name}</a>
- </span>
- </div>
- <div class="answer_text">{Answer}</div>
- </div><!--answer-container-->
- {/block:NotReblog}
- {/block:Answer}
- <!------ END ANSWER ------>
- <!------ 'CAPTION'? ------>
- {block:Caption}
- <div class="caption">
- {block:NotReblog}{Caption}{/block:NotReblog}
- {block:RebloggedFrom}
- {block:Reblogs}
- <div class="reblog-wrap">
- <div class="reblog-head">
- <i class="ph-user"></i>
- <span class="reblog-url">
- <a href="{Permalink}">{Username}</a>
- </span>
- </div><!--reblog-head-->
- <div class="reblog-comment">{Body}</div>
- </div><!--comment-container-->
- {/block:Reblogs}
- {/block:RebloggedFrom}
- </div><!--caption-->
- {/block:Caption}
- <!------ TAGS ------>
- {block:HasTags}
- <div class="tagsdiv" clicktags="{select:toggle tags}">
- <div class="tagsin">
- {block:Tags}
- <a href="{TagURL}">{Tag}</a>
- {/block:Tags}
- </div>
- </div>
- {/block:HasTags}
- </div><!--postinner-->
- <!------ PERMALINK ------>
- {block:Date}
- <div class="permadiv">
- <div class="permaleft">
- <a {block:IndexPage}href="{Permalink}" title="{block:PinnedPostLabel}pinned post ✧ {/block:PinnedPostLabel}{TimeAgo}"{/block:IndexPage}>
- {block:PinnedPostLabel}
- <i class="aa-line-icons pin-ah" icon-name="location-pin-1"></i>
- {/block:PinnedPostLabel}
- <!---------------->
- <i class="aa-line-icons" icon-name="{text:permalink icon A}"></i>
- {block:IndexPage}
- {DayOfMonthWithZero} {ShortMonth} '{ShortYear} @ {24HourWithZero}:{Minutes}
- {/block:IndexPage}
- {block:PermalinkPage}
- {DayOfMonthWithZero} {ShortMonth} {Year} @ {24HourWithZero}:{Minutes} ✧ {TimeAgo}
- {/block:PermalinkPage}
- <!---------------->
- {block:PermalinkPage}
- {block:PinnedPostLabel}
-  ✧ pinned post
- {/block:PinnedPostLabel}
- {/block:PermalinkPage}
- <!---------------->
- {block:IndexPage}
-  {NoteCount}
- <i class="aa-line-icons nc-ah" icon-name="{text:permalink icon B}"></i>
- {/block:IndexPage}
- </a>
- </div>
- <!------------------------------>
- {block:IndexPage}
- <div class="permaright" clicktags="{select:toggle tags}">
- {block:HasTags}
- <a class="clicktags">
- <i class="iconsax" icon-name="hashtag"></i>
- </a>
- {/block:HasTags}
- <a href="{ReblogURL}" title="reblog this post">
- <i class="iconsax" icon-name="repeat"></i>
- </a>
- <a title="like this post">
- {LikeButton}
- <i class="cp cp-heart-o"></i>
- </a>
- </div>
- {/block:IndexPage}
- <!------------------------------>
- {block:PermalinkPage}
- <div class="permaright">
- {block:NotReblog}
- original post
- {/block:NotReblog}
- {block:RebloggedFrom}
- <a href="{ReblogParentURL}" title="{ReblogParentName}">via</a>
- <a dash>/</a>
- <a href="{ReblogRootURL}" title="{ReblogRootName}">source</a>
- {/block:RebloggedFrom}
- </div>
- {/block:PermalinkPage}
- </div><!--permadiv-->
- {/block:Date}
- {block:PostNotes}
- <div class="notescont">
- <h1>{NoteCountWithLabel}</h1>
- {PostNotes}
- </div>
- {/block:PostNotes}
- </div><!--posts-->
- {/block:Posts}
- <!------ PAGINATION ------>
- {block:Pagination}
- <div class="sbpagi botpagi" brd="{select:pagination border}">
- <a{block:PreviousPage} href="{PreviousPage}" title="previous page"{/block:PreviousPage} class="sbarlynk">
- <i class="ph-caret-left-bold"></i>
- <i class="ph-caret-left-bold"></i>
- </a>
- <div class="sbp-mid">
- {block:JumpPagination length="9"}
- {block:CurrentPage}
- <a class="curpagi" title="you are here (page {CurrentPage})">×</a>
- {/block:CurrentPage}
- {block:JumpPage}
- <a class="othernumz" href="{URL}">{PageNumber}</a>
- {/block:JumpPage}
- {/block:JumpPagination}
- </div>
- <a{block:NextPage} href="{NextPage}" title="next page"{/block:NextPage} class="sbarlynk">
- <i class="ph-caret-right-bold"></i>
- <i class="ph-caret-right-bold"></i>
- </a>
- </div><!--sbpagi-->
- {/block:Pagination}
- </div><!--postscont-->
- </div><!--uqune-->
- </div><!--vojjg-->
- <!----THEME CREDIT. PLEASE DO NOT REMOVE, THANK YOU! :)---->
- <!--icon credit goes to GrasshoneyZ on DeviantArt-->
- <!--https://www.deviantart.com/grasshoneyz/art/whale-avatar-110055163-->
- <a class="healsdeez" href="//glenthemes.tumblr.com" title=""whimsical" theme by glenthemes ♪(^∇^*)"><img src="https://orig00.deviantart.net/90dc/f/2009/019/7/7/whale_avatar_by_grasshoneyz.gif"></a>
- <script src="//static.tumblr.com/0podkko/jfMplm3f8/modified_photosets.js"></script>
- </body>
- </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement