feat(ui): Use Prefer Color Scheme to decide to use night modefeat/night-mode-follow-system

Uses the proposal here: https://drafts.csswg.org/mediaqueries-5/#descdef-media-prefers-color-scheme

Seems to be decently supported: https://caniuse.com/?search=prefers-color-scheme

1 files changed, 18 insertions, 0 deletions

diff --git a/web/js/nms-nightmode.js b/web/js/nms-nightmode.js
new file mode 100644
index 0000000..310ec01
--- /dev/null
+++ b/web/js/nms-nightmode.js
@@ -0,0 +1,18 @@
+"use strict";
+
+var nmsNightMode = nmsNightMode || {
+
+}
+
+var prefersColorSchemeMediaQuery = "(prefers-color-scheme: dark)";
+
+nmsNightMode.toggle = function() {
+	var active = window.matchMedia(prefersColorSchemeMediaQuery).matches;
+	nms.nightMode = active;
+}
+
+nmsNightMode.init = function() {
+	var preferColorScheme = window.matchMedia(prefersColorSchemeMediaQuery);
+	preferColorScheme.addListener(() => nmsNightMode.toggle());
+	nmsNightMode.toggle(); // trigger initial
+}