[refactor] improve overscroll background colour

Author: zombieFox

package.json

@@ -1,6 +1,6 @@
 {
 "name": "nighttab",
-"version": "3.76.0",
+"version": "3.77.0",
 "description": "A neutral new tab page accented with a chosen colour. Customise the layout, style, background and bookmarks in nightTab.",
 "main": "index.js",
 "scripts":{

src/css/base.css

@@ -21,10 +21,12 @@ body{
 /* transition: background-color var(--layout-timing-extra-fast); */
 }
 
+html.is-background-color-by-theme,
 .is-background-color-by-themebody{
 background-color:rgb(var(--background-color-theme));
 }
 
+html.is-background-color-by-custom,
 .is-background-color-by-custombody{
 background-color:rgb(var(--background-color-custom));
 }

src/css/variables.css

@@ -46,7 +46,7 @@
 --link-item-display-icon-size:2.5em;
 --link-item-name-size:0.9em;
 /* layout */
---layout-line-width:0.2em;
+--layout-line-width:0.2rem;
 --layout-gutter:0.5rem;
 --layout-width:80%;
 --layout-padding-multiplier:4;

src/js/background.js

@@ -69,10 +69,13 @@ var background = (function(){
 
 varrender={};
 
-render.color=function(){
-varhtml=helper.e("html");
-html.style.backgroundColor="rgb("+state.get().background.color.custom.r+", "+state.get().background.color.custom.g+", "+state.get().background.color.custom.b+")";
-html.style.setProperty("--background-color-custom",state.get().background.color.custom.r+", "+state.get().background.color.custom.g+", "+state.get().background.color.custom.b);
+render.color={
+custom: function(){
+helper.e("html").style.setProperty("--background-color-custom",state.get().background.color.custom.r+", "+state.get().background.color.custom.g+", "+state.get().background.color.custom.b);
+},
+clearHTML: function(){
+helper.e("html").style.backgroundColor="";
+}
 };
 
 render.image=function(){
@@ -220,7 +223,8 @@ var background = (function(){
 };
 
 varinit=function(){
-render.color();
+render.color.clearHTML();
+render.color.custom();
 render.image();
 render.blur();
 render.grayscale();

src/js/control.js

@@ -2141,7 +2141,7 @@ var control = (function(){
 path: "background.color.custom",
 type: "color",
 func: function(){
-background.render.color();
+background.render.color.custom();
 background.render.input.hex();
 }
 },{
@@ -2150,7 +2150,7 @@ var control = (function(){
 type: "text",
 valueMod: ["hexTextString"],
 func: function(){
-background.render.color();
+background.render.color.custom();
 background.render.input.picker();
 }
 },{

src/js/version.js

@@ -1,6 +1,6 @@
 varversion=(function(){
 
-varcurrent="3.76.0";
+varcurrent="3.77.0";
 
 varcompare=function(a,b){
 varpa=a.split(".");

src/manifest.json

@@ -2,7 +2,7 @@
 "name": "nightTab",
 "short_name": "nightTab",
 "description": "A neutral new tab page accented with a chosen colour. Customise the layout, style, background and bookmarks in nightTab.",
-"version": "3.76.0",
+"version": "3.77.0",
 "manifest_version": 2,
 "chrome_url_overrides":{
 "newtab": "index.html"