From 34acda78cea86c6cca0a08c5c8a4ce403ed7dd79 Mon Sep 17 00:00:00 2001
From: Michael Long <mlong@bizjournals.com>
Date: Wed, 6 Jan 2021 09:13:36 -0500
Subject: [PATCH] darkmode can be disabled in modopts.ini, and darkmode will
use macos preferences if not set previously
---
ctrl/modopts.ini | 2 ++
webv4/components/navbar.xjs | 2 ++
webv4/root/index.xjs | 2 ++
webv4/root/js/common.js | 17 +++++++++++------
4 files changed, 17 insertions(+), 6 deletions(-)
diff --git a/ctrl/modopts.ini b/ctrl/modopts.ini
index e626bb2b1c..84d5f2129e 100644
--- a/ctrl/modopts.ini
+++ b/ctrl/modopts.ini
@@ -174,3 +174,5 @@
forum_extended_ascii=false
max_messages=0
nodelist_ibbs = true
+ darkmode_off=false
+
diff --git a/webv4/components/navbar.xjs b/webv4/components/navbar.xjs
index 149a76ef0a..63fc1bedbb 100644
--- a/webv4/components/navbar.xjs
+++ b/webv4/components/navbar.xjs
@@ -49,6 +49,7 @@
</ul>
<ul class="nav navbar-nav navbar-right">
+<?xjs if (!settings.darkmode_off) { ?>
<li class="nav-item dark-switch">
<div class="form-group">
<div class="checkbox checbox-switch darkswitchbox">
@@ -59,6 +60,7 @@
</div>
</div>
</li>
+<?xjs } ?>
<?xjs if (user.alias === settings.guest || user.number < 1) { ?>
<?xjs if (settings.user_registration) { ?>
<li>
diff --git a/webv4/root/index.xjs b/webv4/root/index.xjs
index cf4714de44..b6a1f93a47 100644
--- a/webv4/root/index.xjs
+++ b/webv4/root/index.xjs
@@ -56,7 +56,9 @@
<link href="./bootstrap/css/bootstrap.min.css" rel="stylesheet">
<link href="./css/offcanvas.css" rel="stylesheet">
<link href="./css/style.css" rel="stylesheet">
+<?xjs if (!settings.darkmode_off) { ?>
<link href="./css/checkbox.css" rel="stylesheet">
+<?xjs } ?>
<? if (file_exists(settings.web_root + 'css/custom.css')) { ?>
<link href="./css/custom.css" rel="stylesheet">
<? } ?>
diff --git a/webv4/root/js/common.js b/webv4/root/js/common.js
index fa41de293e..fde6594bd8 100644
--- a/webv4/root/js/common.js
+++ b/webv4/root/js/common.js
@@ -91,18 +91,22 @@ function registerEventListener(scope, callback, params) {
};
}
-document.addEventListener("DOMContentLoaded", function(){
+document.addEventListener("DOMContentLoaded", function () {
// originally based on dark-mode-switch by Christian Oliff
var darkSwitch = document.getElementById("darkSwitch");
if (darkSwitch) {
initTheme();
- darkSwitch.addEventListener("change", function(event) {
+ darkSwitch.addEventListener("change", function (event) {
resetTheme();
});
+
function initTheme() {
- var darkThemeSelected =
- localStorage.getItem("darkSwitch") !== null &&
- localStorage.getItem("darkSwitch") === "dark";
+ var darkThemeSelected;
+ if (localStorage.getItem("darkSwitch") !== null) {
+ darkThemeSelected = localStorage.getItem("darkSwitch") === "dark";
+ } else {
+ darkThemeSelected = window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches;
+ }
darkSwitch.checked = darkThemeSelected;
if (darkThemeSelected) {
jQuery("body").addClass("dark")
@@ -110,13 +114,14 @@ document.addEventListener("DOMContentLoaded", function(){
jQuery("body").removeClass("dark");
}
}
+
function resetTheme() {
if (darkSwitch.checked) {
jQuery("body").addClass("dark");
localStorage.setItem("darkSwitch", "dark");
} else {
jQuery("body").removeClass("dark");
- localStorage.removeItem("darkSwitch");
+ localStorage.setItem("darkSwitch", "light");
}
}
}
--
GitLab