diff --git a/33-Sparrow b/33-Sparrow index ab0e660..81f8c51 100644 --- a/33-Sparrow +++ b/33-Sparrow @@ -3,7 +3,11 @@ Theme [33]: Sparrow Made by glenthemes Initial release: 2018/08/31 -Last updated: 2023/05/08 +Last updated: 2023/07/30 + +What's new: +✱ NPF audio post support +✱ corner music player mini update TERMS OF USE: 1) Do not remove the theme credit. @@ -57,7 +61,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', @@ -66,15 +70,13 @@ $(document).ready(function(){ }); - - - + {block:ifsmoothscrolling} {/block:ifsmoothscrolling} - + @@ -91,7 +93,7 @@ $(document).ready(function(){ +{block:ifmusicplayer} + + + + + +{/block:ifmusicplayer} + + + + + + + + + + + + + + @@ -174,18 +280,18 @@ $(document).ready(function(){ - - - - - - - - - - - - + + + + + + + + + + + + @@ -208,8 +314,77 @@ $(document).ready(function(){ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + - + @@ -220,18 +395,13 @@ $(document).ready(function(){ - - - - - - - - + + + - + @@ -244,17 +414,14 @@ $(document).ready(function(){ - - - + + + + + - - - - - - + @@ -279,16 +446,16 @@ $(document).ready(function(){ #s-m-t-tooltip { padding: 4px 9px; margin: 26px 9px 0px 15px; - background-color: {color:description background}; + background-color: {color:desc background}; border-radius:5px; - border:1px solid {color:description bottom border}; + border:1px solid {color:desc bottom border}; font-family: karla; - font-size: calc({text:font size}px - 3px); + font-size: calc({select:font size} - 3px); letter-spacing: 1px; text-transform: uppercase; - color: {color:description text}; + color: {color:desc text}; z-index:99999999999999999999999999998!important; - max-width: calc({text:post width}px * 0.8); + max-width: calc({select:post width} * 0.8); -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; @@ -355,7 +522,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; overflow-x:hidden; } @@ -393,7 +560,7 @@ 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:1em;} /*--------------------LINKS--------------------*/ a { @@ -415,7 +582,7 @@ a:hover {text-decoration:none;} img {opacity:1;text-decoration:none;} h1 { - font-size:calc({text:font size}px + 1px); + font-size:calc({select:font size} + 1px); font-family:quicksand; text-transform: uppercase; letter-spacing: 2px; @@ -430,15 +597,15 @@ h1 { #container { position:absolute; margin:0 auto; - margin-top:calc({text:post margin}px + 28px); - margin-bottom:calc({text:post margin}px + 28px); + margin-top:calc({select:post spacing} + 28px); + margin-bottom:calc({select:post spacing} + 28px); top:0;left:0;right:0; - width:calc(406px + {text:sidebar right margin}px + {text:post width}px + ({text:post padding}px * 2)); + width:calc(406px + {select:center gap} + {select:post width} + ({select:post padding} * 2)); } #nudge { - margin-left:calc(406px + {text:sidebar right margin}px); + margin-left:calc(406px + {select:center gap}); } #sidehoe { @@ -613,19 +780,19 @@ h1 { /*--------------------TOP DESC--------------------*/ #desk { - margin-bottom:{text:post margin}px; - width:calc({text:post width}px + ({text:post padding}px * 2)); + margin-bottom:{select:post spacing}; + width:calc({select:post width} + ({select:post padding} * 2)); } #title { width:100%; padding:10px 12px; - background-color:{color:description title background}; + background-color:{color:desc title background}; font-family:silkscreen; text-transform:uppercase; font-size:9px; line-height:1em; - color:{color:description title}; + color:{color:desc title}; } #titleflex, #bordflex { @@ -638,79 +805,79 @@ h1 { } .bord1 { - background-color:{color:description title border 1}; + background-color:{color:desc title border 1}; } .bord2 { - background-color:{color:description title border 2}; + background-color:{color:desc title border 2}; } .bord3 { - background-color:{color:description title border 3}; + background-color:{color:desc title border 3}; } #descholder { margin-top:0px; - width:calc(100% - ({text:description padding}px * 2)); - min-height:calc(100px - ({text:description padding}px * 2)); - background-color:{color:description background}; - padding:{text:description padding}px; - border-bottom:3px solid {color:description bottom border}; + width:calc(100% - ({select:desc padding} * 2)); + min-height:calc(100px - ({select:desc padding} * 2)); + background-color:{color:desc background}; + padding:{select:desc padding}; + border-bottom:3px solid {color:desc bottom border}; } .desc-ico { float:left; margin-right:20px; width:auto; - height:{text:description height}px; + height:{select:desc height}; } .desc { - height:{text:description height}px; + height:{select:desc height}; font-size:12px; - color:{color:description text}; + color:{color:desc text}; line-height:1.7em; overflow:auto; text-align:justify; padding-right:10px; } -.desc b {color:{color:description bold};} +.desc b {color:{color:desc bold};} -.desc i {color:{color:description italic};} +.desc i {color:{color:desc italic};} .desc a { padding-bottom:1px; - border-bottom:1px solid rgba({RGBcolor:description link},0.4); - color:{color:description link}; + border-bottom:1px solid rgba({RGBcolor:desc link},0.4); + color:{color:desc link}; } .desc a:hover { - border-bottom:1px solid rgba({RGBcolor:description link hover},0.4); - color:{color:description link hover}; + border-bottom:1px solid rgba({RGBcolor:desc link hover},0.4); + color:{color:desc link hover}; } .desc blockquote { padding-left:10px; margin-left:5px; - border-left:1px solid rgba({RGBcolor:description text},0.6); + border-left:1px solid rgba({RGBcolor:desc text},0.6); margin:10px; } .desc p:last-child {margin-bottom:0px;} .desc::-webkit-scrollbar { - background-color:{color:description background}; + background-color:{color:desc background}; height:13px; width:13px; } .desc::-webkit-scrollbar-thumb { - background-color:rgba({RGBcolor:description text},0.7); - border:6px solid {color:description background}; + background-color:rgba({RGBcolor:desc text},0.7); + border:6px solid {color:desc background}; } -.desc::-webkit-scrollbar-track {background-color:{color:description background};} +.desc::-webkit-scrollbar-track {background-color:{color:desc background};} /*--------------------POSTS--------------------*/ @@ -718,16 +885,16 @@ h1 { overflow:hidden; {block:PermalinkPage} -margin-bottom:{text:post margin}px; +margin-bottom:{select:post spacing}; {/block:PermalinkPage} {block:IndexPage} -margin-bottom:calc({text:post margin}px + 28px); +margin-bottom:calc({select:post spacing} + 28px); {/block:IndexPage} {/block:PermalinkPage} -width:{text:post width}px; -padding:{text:post padding}px; +width:{select:post width}; +padding:{select:post padding}; background-color:{color:post}; border-bottom:3px solid {color:posts bottom border}; } @@ -750,7 +917,7 @@ border-bottom:3px solid {color:posts bottom border}; .photos, .photos img { position:relative; overflow:hidden; - width:{text:post width}px; + width:{select:post width}; {block:IndexPage} {block:ifphotofade} @@ -807,9 +974,9 @@ border-bottom:3px solid {color:posts bottom border}; /*--------------------PERMALINK--------------------*/ .permawrap { - margin-top:{text:post padding}px; - margin-left:-{text:post padding}px; - padding:{text:post padding}px {text:post padding}px 0px {text:post padding}px; + margin-top:{select:post padding}; + margin-left:-{select:post padding}; + padding:{select:post padding} {select:post padding} 0px {select:post padding}; width:100%; border-top:1px solid rgba({RGBcolor:posts bottom border},0.8); } @@ -817,7 +984,7 @@ border-bottom:3px solid {color:posts bottom border}; .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 {{color:link};} @@ -829,7 +996,7 @@ border-bottom:3px solid {color:posts bottom border}; text-transform:uppercase; 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; } @@ -846,8 +1013,8 @@ border-bottom:3px solid {color:posts bottom border}; /*--------------------BOT PERMA--------------------*/ .botperma { position:absolute; - margin-top:calc(-{text:post margin}px - 28px); - margin-left:calc(({text:post width}px + ({text:post padding}px * 2)) - 140px); + margin-top:calc(-{select:post spacing} - 28px); + margin-left:calc(({select:post width} + ({select:post padding} * 2)) - 140px); width:140px; text-align:right; } @@ -894,7 +1061,7 @@ border-bottom:3px solid {color:posts bottom border}; /*--------------------POST NOTES--------------------*/ ol.notes { -width:calc({text:post width}px + ({text:post padding}px * 2)); +width:calc({select:post width} + ({select:post padding} * 2)); padding:0px; margin-top:30px; list-style-type:none; @@ -937,7 +1104,7 @@ text-decoration:none; box-shadow:none !important; border-radius:0px !important; max-width:none; - padding:{text:post padding}px !important; + padding:{select:post padding} !important; background:{color:post} !important; border:1px solid rgba({RGBcolor:text},0.15) !important; } @@ -957,15 +1124,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%); } @@ -975,7 +1142,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%); } @@ -983,7 +1150,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; } @@ -1021,7 +1188,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 { @@ -1080,7 +1247,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; @@ -1109,11 +1276,11 @@ height:0px; } /*------------------------BOT PAGI------------------------*/ .botpagi { - width:calc({text:post width}px + ({text:post padding}px * 2)); + 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(0px - 10px + {text:post margin}px); + margin-bottom:calc(0px - 10px + {select:post spacing}); } /* 'Current page' number */ @@ -1137,47 +1304,6 @@ height:0px; margin-left:2px; text-align:center; } - -/*-------------------MUSIC PLAYER-------------------*/ -#glenjamin { - position:fixed; - bottom:0;margin-bottom:20px; - left:0;margin-left:20px; - display:flex; - z-index:2; -} - -.playy, .pausee { - font-size:13px; - color:{color:music player color}; - cursor:pointer; -} - -.pausee { - display:none; - margin-right:1.5px; -} - -.sonata { - margin-left:10px; - color:{color:music player color}; -} - -.labeltext { - margin-left:8px; - font-family:courier new; - font-size:9px; - color:{color:music player color}; -} - -.labeltext a { - padding-bottom:1px; - border-bottom:1px solid rgba({RGBcolor:music player color},0.25); -} - -svg { - pointer-events:none; -} @@ -1186,19 +1312,21 @@ svg { {block:ifmusicplayer} -
-
-
►
 -
❚❚
 -
- -
♫
-
{text:music name}
+
+
+ + + + + {text:music name} + + + + +
{/block:ifmusicplayer} - -
@@ -1268,7 +1396,7 @@ svg {
{block:ifdescriptiontitle} - {text:description title} + {text:desc title} {/block:ifdescriptiontitle} {block:ifnotdescriptiontitle}