Apply theme to login page

closes #1094

src_assets/common/assets/web/login.html

@@ -44,11 +44,14 @@
 </body>
 
 <script type="module">
-  import { createApp, ref } from "vue"
+  import { createApp, ref, onMounted } from "vue"
+  import { loadAutoTheme } from './theme'
   import { initApp } from './init'
 
   let app = createApp({
     setup() {
+      loadAutoTheme()
+
       const error = ref('');
       const success = ref(false);
       const loading = ref(false);

src_assets/common/assets/web/theme.js

@@ -65,20 +65,16 @@ export function setupThemeToggleListener() {
 }
 
 export function loadAutoTheme() {
-    (() => {
+    setTheme(getPreferredTheme())
-        'use strict'
 
-        setTheme(getPreferredTheme())
+    window.matchMedia('(prefers-color-scheme: dark)').addEventListener('change', () => {
+        const storedTheme = getStoredTheme()
+        if (storedTheme !== 'light' && storedTheme !== 'dark') {
+            setTheme(getPreferredTheme())
+        }
+    })
 
-        window.matchMedia('(prefers-color-scheme: dark)').addEventListener('change', () => {
+    window.addEventListener('DOMContentLoaded', () => {
-            const storedTheme = getStoredTheme()
+        showActiveTheme(getPreferredTheme())
-            if (storedTheme !== 'light' && storedTheme !== 'dark') {
+    })
-                setTheme(getPreferredTheme())
-            }
-        })
-
-        window.addEventListener('DOMContentLoaded', () => {
-            showActiveTheme(getPreferredTheme())
-        })
-    })()
 }