₊⁺✿˚

This commit is contained in:
HT 2023-07-28 01:09:25 +01:00
parent 2ab1392073
commit d87447cc1a
1 changed files with 257 additions and 114 deletions

View File

@ -4,7 +4,10 @@ Made by glenthemes
Initial release: 2015/10/14
Major code update: 2018/04/30
Last updated: 2023/05/06
Last updated: 2023/07/27
What's new:
✱ NPF audio post support
TERMS OF USE:
1) Do not remove the theme credit.
@ -43,7 +46,7 @@ attribute:"title"
$(document).ready(function() {
$('iframe.tumblr_audio_player').load( function() {
$('iframe.tumblr_audio_player').contents().find("head")
.append($("<style type='text/css'> .audio-player{background:rgba({RGBcolor:bold},0.2) !important; padding:5px 10px 5px 0px !important} .play-pause{color:{color:bold} !important; font-size:15px!important; padding:0 9.5px!important} </style>"));
.append($("<style type='text/css'> .audio-player{background:rgba({RGBcolor:bold},0.2) !important; padding:5px 10px 5px 0px !important} .play-pause{color:{color:bold} !important; font-size:calc({select:font size} * 1.5)!important; padding:0 9.5px!important} </style>"));
});
});
</script>
@ -67,7 +70,7 @@ $(document).ready(function(){
$('.photo-slideshow').pxuPhotoset({
lightbox: true,
rounded: false,
gutter: '{text:photoset gutter width}px',
gutter: '{select:photos spacing}',
borderRadius: '0px',
photoset: '.photo-slideshow',
photoWrap: '.photo-data',
@ -99,7 +102,7 @@ $(document).ready(function(){
<style tmblr-npf>
:root {
--NPF-Caption-Spacing:1em;
--NPF-Image-Spacing:{text:photoset gutter width}px;
--NPF-Image-Spacing:{select:photos spacing};
}
a.post_media_photo_anchor, a.post_media_photo_anchor:hover {
@ -126,16 +129,16 @@ $(document).ready(function(){
<!-- unblue polls -->
<!-- glenthemes.tumblr.com/post/708014819571302400 -->
<link href="//static.tumblr.com/gtjt4bo/mXBrpdj0n/unblue-polls.css" rel="stylesheet">
<style>
<style unblue-polls>
.poll-post {
--Poll-Question-Font-Size: {text:font size}px;
--Poll-Question-Font-Size: {select:font size};
--Poll-Option-Background-Color: {color:post};
--Poll-Option-Corner-Rounding: 5px;
--Poll-Option-Border-Size: 1px;
--Poll-Option-Border-Color: {color:post borders};
--Poll-Option-Padding: 8px;
--Poll-Option-Font-Size: {text:font size}px;
--Poll-Option-Font-Size: {select:font size};
--Poll-Option-Spacing: 10px;
--Poll-Option-Text-Color: {color:text};
@ -154,8 +157,72 @@ $(document).ready(function(){
}
</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: "Track:",
artistLabel: "Artist:",
albumLabel: "Album:"
});
</script>
<style edit-npf-audio-player>
.npf-audio-wrapper {
--NPF-Audio-Buttons-Size: {select:font size};
--NPF-Audio-Buttons-Color: {color:bold};
--NPF-Audio-Buttons-Padding: 14px;
--NPF-Audio-Buttons-Spacing: calc((var(--NPF-Audio-Buttons-Padding) * 2) + 10px);
--NPF-Audio-Image-Spacing: 0.9rem;
}
.npf-audio-background {
margin-left:calc(18px + var(--NPF-Audio-Buttons-Padding));
}
.npf-audio-play, .npf-audio-pause { position:relative }
.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:rgba({RGBcolor:bold},0.2);
border-radius:100%;
}
.npf-audio-play svg { margin-left:1px; }
.npf-audio-pause svg { margin-left:0; }
.npf-audio-title-label,
.npf-audio-artist-label,
.npf-audio-album-label {
color:{color:bold};
text-transform:uppercase;
}
figcaption.audio-caption,
figcaption.audio-caption ~ audio[controls],
figcaption.audio-caption img, .npf-audio-image {
display:none;
}
</style>
<script src="//glen-npf.gitlab.io/other/neue.js"></script>
<link href="//glen-npf.gitlab.io/other/neue.css" rel="stylesheet">
<!--------------------IMAGES-------------------->
<meta name="image:background image" content=""/>
<meta name="image:sidebar image" content="//static.tumblr.com/9fc2258bc628d2d705031fc4d2274eea/gtjt4bo/kwQnw3ffa/tumblr_static_czxe1z5cg68gos8scwgkowww4.png"/>
<!--------------------COLORS-------------------->
<meta name="color:background" content="#fefefe"/>
@ -187,8 +254,68 @@ $(document).ready(function(){
<meta name="color:highlight" content="#f3f3f3"/>
<meta name="color:highlighted text" content="#555"/>
<!-----------------DROPDOWN OPTS----------------->
<meta name="select:font size" title="12px" content="12px">
<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:font size" title="16px" content="16px">
<meta name="select:post width" title="500px" content="500px">
<meta name="select:post width" title="300px" content="300px">
<meta name="select:post width" title="350px" content="375px">
<meta name="select:post width" title="400px" content="400px">
<meta name="select:post width" title="450px" content="450px">
<meta name="select:post width" title="540px" content="540px">
<meta name="select:post width" title="600px" content="600px">
<meta name="select:post padding" title="20px" content="20px">
<meta name="select:post padding" title="10px" content="10px">
<meta name="select:post padding" title="15px" content="15px">
<meta name="select:post padding" title="25px" content="25px">
<meta name="select:photos spacing" title="10px" content="10px">
<meta name="select:photos spacing" title="0px" content="0px">
<meta name="select:photos spacing" title="2px" content="2px">
<meta name="select:photos spacing" title="4px" content="4px">
<meta name="select:photos spacing" title="6px" content="6px">
<meta name="select:photos spacing" title="8px" content="8px">
<meta name="select:post spacing" title="40px" content="40px">
<meta name="select:post spacing" title="20px" content="20px">
<meta name="select:post spacing" title="25px" content="25px">
<meta name="select:post spacing" title="30px" content="30px">
<meta name="select:post spacing" title="35px" content="35px">
<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:post spacing" title="60px" content="60px">
<meta name="select:sidebar left gap" title="80px" content="80px">
<meta name="select:sidebar left gap" title="30px" content="30px">
<meta name="select:sidebar left gap" title="40px" content="40px">
<meta name="select:sidebar left gap" title="50px" content="50px">
<meta name="select:sidebar left gap" title="60px" content="60px">
<meta name="select:sidebar left gap" title="70px" content="70px">
<meta name="select:sidebar left gap" title="90px" content="90px">
<meta name="select:sidebar left gap" title="100px" content="100px">
<meta name="select:sidebar left gap" title="110px" content="110px">
<meta name="select:sidebar left gap" title="120px" content="120px">
<meta name="select:sidebar left gap" title="130px" content="130px">
<meta name="select:sidebar width" title="225px" content="225px">
<meta name="select:sidebar width" title="150px" content="150px">
<meta name="select:sidebar width" title="175px" content="175px">
<meta name="select:sidebar width" title="200px" content="200px">
<meta name="select:sidebar width" title="250px" content="250px">
<meta name="select:sidebar width" title="275px" content="275px">
<meta name="select:sidebar width" title="300px" content="300px">
<meta name="select:sidebar width" title="325px" content="325px">
<meta name="select:sidebar width" title="350px" content="350px">
<!--------------------OPTIONS-------------------->
<!--------------------TOGGLES-------------------->
<meta name="if:show music player" content="1" />
<meta name="if:pagination in sidebar" content="0" />
@ -201,32 +328,33 @@ $(document).ready(function(){
<meta name="if:smooth scrolling" content="0" />
<meta name="if:dark tumblr controls" content="0" />
<!--------------------IMAGES-------------------->
<meta name="image:background image" content=""/>
<meta name="image:sidebar image" content="//static.tumblr.com/9fc2258bc628d2d705031fc4d2274eea/gtjt4bo/kwQnw3ffa/tumblr_static_czxe1z5cg68gos8scwgkowww4.png"/>
<!--------------------TITLES-------------------->
<meta name="text:how to link music" content="linktr.ee/direct_file_links">
<meta name="text:music player mp3 URL" content="https://rhizo.gitlab.io/m/White_Silence.mp3">
<meta name="text:music player song name" content="White Silence">
<meta name="text:font size" content="12">
<meta name="text:post width" content="500">
<meta name="text:post padding" content="20">
<meta name="text:photoset gutter width" content="10">
<meta name="text:post margin" content="40">
<meta name="text:sidebar left margin" content="80">
<meta name="text:sidebar width" content="225">
<meta name="text:Link 1" content="Sample link 1">
<meta name="text:Link 1 URL" content="/">
<meta name="text:Link 2" content="">
<meta name="text:Link 1 Text" content=".01">
<meta name="text:Link 1 Hover" content="">
<meta name="text:Link 1 URL" content="https://www.youtube.com/watch?v=6opktP4VBN0">
<meta name="text:Link 2 Text" content="">
<meta name="text:Link 2 Hover" content="">
<meta name="text:Link 2 URL" content="">
<meta name="text:Link 3" content="">
<meta name="text:Link 3 Text" content="">
<meta name="text:Link 3 Hover" content="">
<meta name="text:Link 3 URL" content="">
<meta name="text:Link 4" content="">
<meta name="text:Link 4 Text" content="">
<meta name="text:Link 4 Hover" content="">
<meta name="text:Link 4 URL" content="">
<meta name="text:Link 5" content="">
<meta name="text:Link 5 Text" content="">
<meta name="text:Link 5 Hover" content="">
<meta name="text:Link 5 URL" content="">
<meta name="text:Link 6" content="">
<meta name="text:Link 6 Text" content="">
<meta name="text:Link 6 Hover" content="">
<meta name="text:Link 6 URL" content="">
<!-------------------------------------------------------------------->
@ -241,12 +369,12 @@ $(document).ready(function(){
border-radius:5px;
border:1px solid rgba({RGBcolor:text},0.2);
font-family: open sans;
font-size: calc({text:font size}px - 3px);
font-size: calc({select:font size} - 3px);
letter-spacing: 1px;
text-transform: uppercase;
color: {color:text};
z-index:99999999999999999999999999998!important;
max-width: calc({text:post width}px * 1.25);
max-width: calc({select:post width} * 1.25);
-webkit-transition: all 0.3s ease-in-out;
-moz-transition: all 0.3s ease-in-out;
-o-transition: all 0.3s ease-in-out;
@ -312,7 +440,7 @@ color:{color:text};
cursor:normal;
font-family:open sans;
line-height:1.6em;
font-size:{text:font size}px;
font-size:{select:font size};
text-align:left;
}
@ -349,7 +477,10 @@ hr {
background-color:rgba({RGBcolor:text},0.3);
}
p.npf_quirky, p.npf_quote {font-size:calc({text:font size}px + 5px);line-height:1em;}
p.npf_quirky, p.npf_quote {
font-size:calc({select:font size} + 5px);
line-height:inherit;
}
/*--------------------LINKS--------------------*/
a {
@ -367,7 +498,7 @@ a:hover {text-decoration:none;}
img {opacity:1;text-decoration:none;}
h1, h2, h3, h4, h5, h6 {
font-size:calc({text:font size}px + 1px);
font-size:calc({select:font size} + 1px);
font-family:quicksand;
text-transform:uppercase;
letter-spacing:2px;
@ -383,10 +514,10 @@ h1, h2, h3, h4, h5, h6 {
#container {
position:absolute;
margin:0 auto;
margin-top:{text:post margin}px;
margin-bottom:{text:post margin}px;
margin-top:{select:post spacing};
margin-bottom:{select:post spacing};
top:0;left:0;right:0;
width:calc({text:post width}px + ({text:post padding}px * 2) + {text:sidebar left margin}px + {text:sidebar width}px);
width:calc({select:post width} + ({select:post padding} * 2) + {select:sidebar left gap} + {select:sidebar width});
}
@ -397,9 +528,9 @@ h1, h2, h3, h4, h5, h6 {
#galaxy {
position:fixed;
bottom:0;margin-bottom:50px;
margin-left:calc(({text:post width}px + {text:post padding}px * 2) + {text:sidebar left margin}px);
margin-left:calc(({select:post width} + {select:post padding} * 2) + {select:sidebar left gap});
/* total post width + gap between posts and sb */
width:{text:sidebar width}px;
width:{select:sidebar width};
text-align:center;
}
@ -412,7 +543,7 @@ h1, h2, h3, h4, h5, h6 {
.desc {
margin-top:10px;
line-height:1.7em;
font-size:calc({text:font size}px - 1.5px);
font-size:calc({select:font size} - 1.5px);
}
.rinko {
@ -426,7 +557,7 @@ h1, h2, h3, h4, h5, h6 {
.rinko a {
display:inline-block;
margin:0px 4px;
font-size:calc({text:font size}px - 1px);
font-size:calc({select:font size} - 1px);
}
.rinko a:first-child {margin-left:0px;}
@ -463,10 +594,10 @@ h1, h2, h3, h4, h5, h6 {
/*--------------------POSTS--------------------*/
.posts {
overflow:hidden;
margin-bottom:{text:post margin}px;
margin-bottom:{select:post spacing};
{/block:PermalinkPage}
width:{text:post width}px;
padding:{text:post padding}px;
width:{select:post width};
padding:{select:post padding};
background-color:{color:post};
{block:ifpostborders}border:1px solid {color:post borders};{/block:ifpostborders}
}
@ -487,7 +618,7 @@ background-color:{color:post};
.photos, .photos img {
position:relative;
overflow:hidden;
width:{text:post width}px;
width:{select:post width};
{block:IndexPage}
{block:ifphotofade}
@ -552,7 +683,7 @@ background-color:{color:post};
.perma {
text-transform:uppercase;
letter-spacing:1px;
font-size:calc({text:font size}px - 2.5px);
font-size:calc({select:font size} - 2.5px);
}
.perma a, .perma b {
@ -572,7 +703,7 @@ background-color:{color:post};
font-style:italic;
letter-spacing:1.3px;
line-height:1.5em;
font-size:calc({text:font size}px - 3.5px);
font-size:calc({select:font size} - 3.5px);
text-align:right;
}
@ -595,7 +726,7 @@ background-color:{color:post};
/* -- and tutorial by shythemes: //shythemes.tumblr.com/post/147903463743/custom-like-and-reblog-buttons -- */
/* -- and help from borntobewildcodes -- */
.controls {
margin-right:calc({text:post padding}px - 7px);
margin-right:calc({select:post padding} - 7px);
margin-top:-20px;
height:0px;
}
@ -611,17 +742,17 @@ background-color:{color:post};
.controls .like .sf {
position:absolute;
margin-top:calc(({text:font size}px - 2px) * -1);
margin-left:calc(({text:font size}px + 4px) * -1);
font-size:calc({text:font size}px + 1px);
margin-top:calc(({select:font size} - 2px) * -1);
margin-left:calc(({select:font size} + 4px) * -1);
font-size:calc({select:font size} + 1px);
}
.controls .like .like_button {
position:absolute;
margin-top:calc(({text:font size}px - 2px) * -1);
margin-left:calc(({text:font size}px + 4px) * -1);
width:calc({text:font size}px + 1px);
height:calc({text:font size}px + 1px);
margin-top:calc(({select:font size} - 2px) * -1);
margin-left:calc(({select:font size} + 4px) * -1);
width:calc({select:font size} + 1px);
height:calc({select:font size} + 1px);
}
.controls .like .like_button iframe {
@ -638,15 +769,15 @@ background-color:{color:post};
.controls .rb .sf {
position:absolute;
margin-top:calc(({text:font size}px - 1px) * -1);
margin-top:calc(({select:font size} - 1px) * -1);
margin-left:2px;
font-size:calc({text:font size}px - 1px);
font-size:calc({select:font size} - 1px);
}
/*--------------------POST NOTES--------------------*/
ol.notes {
width:{text:post width}px;
width:{select:post width};
padding:0px;
margin-top:30px;
list-style-type:none;
@ -689,7 +820,8 @@ text-decoration:none;
box-shadow:none !important;
border-radius:0px !important;
max-width:none;
padding:{text:post padding}px !important;
margin-top:-{select:post padding}!important;
padding:{select:post padding} !important;
background:{color:post} !important;
border:1px solid rgba({RGBcolor:text},0.15) !important;
}
@ -709,15 +841,15 @@ text-align:center;
.daydreamer .sf {
color:{color:text};
padding:7px 10px 2px 10px;
font-size:calc({text:font size}px + 5px);
font-size:calc({select:font size} + 5px);
}
.daydreamer::before {
content:"";
position:absolute;
margin-top:8px;
margin-left:calc(-{text:post width}px / 4);
width:calc({text:post width}px / 4);
margin-left:calc(-{select:post width} / 4);
width:calc({select:post width} / 4);
height:1px;
background:-webkit-linear-gradient(left, transparent 0%, {color:text} 80%, transparent 100%);
}
@ -727,7 +859,7 @@ content:"";
position:absolute;
margin-top:8px;
margin-left:0px;
width:calc({text:post width}px / 4);
width:calc({select:post width} / 4);
height:1px;
background:-webkit-linear-gradient(right, transparent 0%, {color:text} 80%, transparent 100%);
}
@ -735,7 +867,7 @@ background:-webkit-linear-gradient(right, transparent 0%, {color:text} 80%, tran
.quote {
font-family:Quicksand;
text-transform:uppercase;letter-spacing:1px;
font-size:calc({text:font size}px + 1px);
font-size:calc({select:font size} + 1px);
font-weight:bold;
text-align:center;
}
@ -773,7 +905,7 @@ font-weight:bold;
.label.odd {color:{color:question and chat text};}
.label.even {color:{color:text};}
p.npf_chat { font-family:Courier; font-size:{text:font size}px; }
p.npf_chat { font-family:Courier; font-size:{select:font size}; }
/*---------------------------ASKS---------------------------*/
.q-wrap {
@ -833,7 +965,7 @@ height:0px;
/*---------------------------VIDEO---------------------------*/
.tumblr_video_container {
width:{text:post width}px!important;
width:{select:post width}!important;
height:auto!important;
max-height:540px!important;
overflow:hidden!important;
@ -863,66 +995,66 @@ height:0px;
/*------------------------SB PAGINATION------------------------*/
.sbpagi {
width:inherit;
border-top:1px solid rgba({RGBcolor:text},0.15);
text-align:center;
margin-top:17px;
width:inherit;
border-top:1px solid rgba({RGBcolor:text},0.15);
text-align:center;
margin-top:17px;
}
/* 'Current page' number */
.sbpagi span {
margin:7px 0;
font-size:9px;
color:{color:Text};
padding:3px 5px;
width:9px;
display:inline-block;
margin-left:5px;
text-align:center;
margin:7px 0;
font-size:9px;
color:{color:Text};
padding:3px 5px;
width:9px;
display:inline-block;
margin-left:5px;
text-align:center;
}
/* Other page numbers */
.sbpagi a {
margin:7px 0;
font-size:9px;
color:{color:text};
padding:3px 5px;
width:9px;
display:inline-block;
margin-left:5px;
text-align:center;
margin:7px 0;
font-size:9px;
color:{color:text};
padding:3px 5px;
width:9px;
display:inline-block;
margin-left:5px;
text-align:center;
}
/*------------------------BOT PAGI------------------------*/
.botpagi {
width:calc({text:post width}px + ({text:post padding}px * 2));
text-align:center;
padding-top:15px;
border-top:1px solid rgba({RGBcolor:text},0.15);
margin-bottom:-10px;
width:calc({select:post width} + ({select:post padding} * 2));
text-align:center;
padding-top:15px;
border-top:1px solid rgba({RGBcolor:text},0.15);
margin-bottom:calc({select:post spacing} - 10px);
}
/* 'Current page' number */
.botpagi span {
font-size:9px;
color:{color:Text};
padding:3px 5px;
width:9px;
display:inline-block;
margin-left:5px;
text-align:center;
font-size:9px;
color:{color:Text};
padding:3px 5px;
width:9px;
display:inline-block;
margin-left:5px;
text-align:center;
}
/* Other page numbers */
.botpagi a {
font-size:9px;
color:{color:text};
padding:3px 5px;
width:9px;
display:inline-block;
margin-left:2px;
text-align:center;
font-size:9px;
color:{color:text};
padding:3px 5px;
width:9px;
display:inline-block;
margin-left:2px;
text-align:center;
}
{block:ifshowmusicplayer}
@ -1051,18 +1183,29 @@ height:0px;
<div class="desc">{Description}</div>
<div class="rinko">
{block:ifLink1}<a href="{text:Link 1 URL}" title="{text:Link 1}">.01</a>
{/block:ifLink1}
{block:ifLink2}<a href="{text:Link 2 URL}" title="{text:Link 2}">.02</a>
{/block:ifLink2}
{block:ifLink3}<a href="{text:Link 3 URL}" title="{text:Link 3}">.03</a>
{/block:ifLink3}
{block:ifLink4}<a href="{text:Link 4 URL}" title="{text:Link 4}">.04</a>
{/block:ifLink4}
{block:ifLink5}<a href="{text:Link 5 URL}" title="{text:Link 5}">.05</a>
{/block:ifLink5}
{block:ifLink6}<a href="{text:Link 6 URL}" title="{text:Link 6}">.06</a>
{/block:ifLink6}
{block:ifLink1Text}
<a href="{text:Link 1 URL}" {block:ifLink1Hover}title="{text:Link 1 Hover}"{/block:ifLink1Hover}>{text:Link 1 Text}</a>
{/block:ifLink1Text}
{block:ifLink2Text}
<a href="{text:Link 2 URL}" {block:ifLink2Hover}title="{text:Link 2 Hover}"{/block:ifLink2Hover}>{text:Link 2 Text}</a>
{/block:ifLink2Text}
{block:ifLink3Text}
<a href="{text:Link 3 URL}" {block:ifLink3Hover}title="{text:Link 3 Hover}"{/block:ifLink3Hover}>{text:Link 3 Text}</a>
{/block:ifLink3Text}
{block:ifLink4Text}
<a href="{text:Link 4 URL}" {block:ifLink4Hover}title="{text:Link 4 Hover}"{/block:ifLink4Hover}>{text:Link 4 Text}</a>
{/block:ifLink4Text}
{block:ifLink5Text}
<a href="{text:Link 5 URL}" {block:ifLink5Hover}title="{text:Link 5 Hover}"{/block:ifLink5Hover}>{text:Link 5 Text}</a>
{/block:ifLink5Text}
{block:ifLink6Text}
<a href="{text:Link 6 URL}" {block:ifLink6Hover}title="{text:Link 6 Hover}"{/block:ifLink6Hover}>{text:Link 6 Text}</a>
{/block:ifLink6Text}
</div><!--rinko-->
<div class="aya">