Browse Source

fix darkmode toggle

FreddleSpl0it 2 years ago
parent
commit
f1bb23ba2a
3 changed files with 6 additions and 6 deletions
  1. 2 2
      data/web/js/build/015-mailcow.js
  2. 2 2
      data/web/js/site/index.js
  3. 2 2
      data/web/templates/base.twig

+ 2 - 2
data/web/js/build/015-mailcow.js

@@ -304,13 +304,13 @@ $(document).ready(function() {
       $('#dark-mode-toggle').prop('checked', false);
       $('#dark-mode-toggle').prop('checked', false);
       if ($('#rspamd_logo').length) $('#rspamd_logo').attr('src', '/img/rspamd_logo_dark.png');
       if ($('#rspamd_logo').length) $('#rspamd_logo').attr('src', '/img/rspamd_logo_dark.png');
       if ($('#rspamd_logo_sm').length) $('#rspamd_logo_sm').attr('src', '/img/rspamd_logo_dark.png');
       if ($('#rspamd_logo_sm').length) $('#rspamd_logo_sm').attr('src', '/img/rspamd_logo_dark.png');
-      localStorage.setItem('darkmode', 'false');
+      localStorage.setItem('theme', 'light');
     }else{
     }else{
       $('head').append('<link id="dark-mode-theme" rel="stylesheet" type="text/css" href="/css/themes/mailcow-darkmode.css">');
       $('head').append('<link id="dark-mode-theme" rel="stylesheet" type="text/css" href="/css/themes/mailcow-darkmode.css">');
       $('#dark-mode-toggle').prop('checked', true);
       $('#dark-mode-toggle').prop('checked', true);
       if ($('#rspamd_logo').length) $('#rspamd_logo').attr('src', '/img/rspamd_logo_light.png');
       if ($('#rspamd_logo').length) $('#rspamd_logo').attr('src', '/img/rspamd_logo_light.png');
       if ($('#rspamd_logo_sm').length) $('#rspamd_logo_sm').attr('src', '/img/rspamd_logo_light.png');
       if ($('#rspamd_logo_sm').length) $('#rspamd_logo_sm').attr('src', '/img/rspamd_logo_light.png');
-      localStorage.setItem('darkmode', 'true');
+      localStorage.setItem('theme', 'dark');
     }
     }
   }
   }
 });
 });

+ 2 - 2
data/web/js/site/index.js

@@ -1,5 +1,5 @@
 $(document).ready(function() {
 $(document).ready(function() {
-  var darkmode = localStorage.getItem("darkmode");
+  var theme = localStorage.getItem("theme");
   localStorage.clear();
   localStorage.clear();
-  localStorage.setItem("darkmode", darkmode);
+  localStorage.setItem("theme", theme);
 });
 });

+ 2 - 2
data/web/templates/base.twig

@@ -11,8 +11,8 @@
   <link rel="stylesheet" href="{{ css_path }}">
   <link rel="stylesheet" href="{{ css_path }}">
   <script>
   <script>
     // check if darkmode is preferred by OS or set by localStorage
     // check if darkmode is preferred by OS or set by localStorage
-    if (window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches ||
-        JSON.parse(localStorage.getItem("darkmode")) === true) {
+    if (window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches && localStorage.getItem("theme") !== "light" ||
+        localStorage.getItem("theme") === "dark") {
       var head  = document.getElementsByTagName('head')[0];
       var head  = document.getElementsByTagName('head')[0];
       var link  = document.createElement('link');
       var link  = document.createElement('link');
       link.id   = 'dark-mode-theme';
       link.id   = 'dark-mode-theme';