[feature] improve initial background colour

This commit is contained in:
zombieFox 2020-07-24 13:01:03 +01:00
parent 8caa9bbeee
commit dbfa3b4e75
8 changed files with 46 additions and 11 deletions

View File

@ -154,6 +154,10 @@ const build = {
.pipe(dest(path.build + '/js', {
sourcemaps: '.'
}))
},
initialBackground: function() {
return src(path.src + '/js/initial-background.js')
.pipe(dest(path.build + '/js'))
}
}
@ -209,8 +213,16 @@ const dev = {
return src(jsFiles)
.pipe(dest(path.dev + '/js'))
})
},
initialBackground: function() {
watch(path.src + '/js/initial-background.js', {
ignoreInitial: false
}, function() {
return src(path.src + '/js/initial-background.js')
.pipe(dest(path.dev + '/js'))
})
}
}
exports.dev = parallel(dev.manifest, dev.html, dev.fonts, dev.icons, dev.css, dev.js)
exports.build = parallel(build.manifest, build.html, build.fonts, build.icons, build.css, build.js)
exports.dev = parallel(dev.manifest, dev.html, dev.fonts, dev.icons, dev.css, dev.js, dev.initialBackground)
exports.build = parallel(build.manifest, build.html, build.fonts, build.icons, build.css, build.js, build.initialBackground)

2
package-lock.json generated
View File

@ -1,6 +1,6 @@
{
"name": "nightTab",
"version": "5.65.0",
"version": "5.67.0",
"lockfileVersion": 1,
"requires": true,
"dependencies": {

View File

@ -1,6 +1,6 @@
{
"name": "nightTab",
"version": "5.65.0",
"version": "5.67.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": {

View File

@ -4,16 +4,22 @@
</div>
<div class="menu-item-form">
<div class="form-wrap">
<input id="control-theme-style-dark" class="control-theme-style-dark" type="radio" name="control-theme-style" value="dark" tabindex="-1">
<label for="control-theme-style-dark"><span class="label-icon"></span> Dark</label>
<input id="control-theme-style-light" class="control-theme-style-light" type="radio" name="control-theme-style" value="light" tabindex="-1">
<label for="control-theme-style-light"><span class="label-icon"></span> Light mode</label>
</div>
<div class="form-wrap">
<input id="control-theme-style-light" class="control-theme-style-light" type="radio" name="control-theme-style" value="light" tabindex="-1">
<label for="control-theme-style-light"><span class="label-icon"></span> Light</label>
<input id="control-theme-style-dark" class="control-theme-style-dark" type="radio" name="control-theme-style" value="dark" tabindex="-1">
<label for="control-theme-style-dark"><span class="label-icon"></span> Dark mode</label>
</div>
<div class="form-wrap">
<input id="control-theme-style-system" class="control-theme-style-system" type="radio" name="control-theme-style" value="system" tabindex="-1">
<label for="control-theme-style-system"><span class="label-icon"></span> Follow system light or dark</label>
<label for="control-theme-style-system">
<span class="label-icon"></span>
<span class="label-block">
<span class="label-block-item">Automatic</span>
<span class="label-block-item small muted">Follow the system Light or Dark mode.</span>
</span>
</label>
</div>
<div class="form-wrap">
<p class="control-theme-style-helper form-helper-item">Flip the colour shades defined by the primary Colour.</p>

View File

@ -24,6 +24,8 @@
}
</style>
<script src="js/initial-background.js" async></script>
@@include("./html/link-css.html")
</head>

View File

@ -0,0 +1,15 @@
// inital check for systems which do not have light or dark mode
var data = JSON.parse(localStorage.getItem("nightTab"));
if (window.matchMedia("(prefers-color-scheme:light)").matches) {
if (data) {
if (data.state.theme.style == "dark") {
document.querySelector("html").setAttribute("style", "background-color:rgb(0,0,0)");
};
};
} else if (window.matchMedia("(prefers-color-scheme:dark)").matches) {
if (data) {
if (data.state.theme.style == "light") {
document.querySelector("html").setAttribute("style", "background-color:rgb(255,255,255)");
};
};
};

View File

@ -1,6 +1,6 @@
var version = (function() {
var current = "5.65.0";
var current = "5.67.0";
var name = "Jaded Raven";

View File

@ -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": "5.65.0",
"version": "5.67.0",
"manifest_version": 2,
"chrome_url_overrides": {
"newtab": "index.html"