re-add theme as ptrs broken fixed ipad theme

2026-09-07 18:06:45 +01:00
parent c6b7510f05
commit d0f72ac8a4
8 changed files with 304 additions and 80 deletions
@@ -66,4 +66,55 @@
    $viteAssets = array_values(array_unique($viteAssets));
@endphp
@vite($viteAssets)
-@fluxAppearance
+@fluxAppearance
+<script>
+(function () {
+    var root = document.documentElement;
+    var key = 'hd.appearance';
+    var media = window.matchMedia ? window.matchMedia('(prefers-color-scheme: dark)') : null;
+
+    function stored() {
+        try { return localStorage.getItem(key) || 'system'; } catch (e) { return 'system'; }
+    }
+
+    function isDark(mode) {
+        return mode === 'dark' || (mode === 'system' && media && media.matches);
+    }
+
+    function syncButtons(mode) {
+        var buttons = document.querySelectorAll('[data-hd-appearance-value]');
+        for (var i = 0; i < buttons.length; i++) {
+            var active = buttons[i].getAttribute('data-hd-appearance-value') === mode;
+            buttons[i].setAttribute('aria-pressed', active ? 'true' : 'false');
+            if (active) buttons[i].classList.add('is-active');
+            else buttons[i].classList.remove('is-active');
+        }
+    }
+
+    function apply(mode) {
+        if (isDark(mode)) root.classList.add('dark');
+        else root.classList.remove('dark');
+        root.setAttribute('data-hd-appearance', mode);
+        syncButtons(mode);
+    }
+
+    window.HDTheme = {
+        get: stored,
+        set: function (mode) {
+            if (mode !== 'light' && mode !== 'dark' && mode !== 'system') return;
+            try { localStorage.setItem(key, mode); } catch (e) {}
+            apply(mode);
+        },
+        apply: function () { apply(stored()); }
+    };
+
+    apply(stored());
+    if (media) {
+        var onChange = function () { if (stored() === 'system') apply('system'); };
+        if (media.addListener) media.addListener(onChange);
+        else if (media.addEventListener) media.addEventListener('change', onChange);
+    }
+    document.addEventListener('DOMContentLoaded', function () { apply(stored()); });
+    document.addEventListener('livewire:navigated', function () { apply(stored()); });
+}());
+</script>