export themes as js file in lib, and use footer/header seperatly

web/src/lib/themes.json → web/src/lib/themes.js

@@ -1,5 +1,5 @@
-[
+export default [
     "auto",
     "dark",
     "light"
-]
+];

web/src/routes/+layout.server.js

@@ -1,11 +1,13 @@
+import themesList from "$lib/themes"
+
 export async function load({ cookies }) {
     let theme = "auto";
-    if (cookies.theme !== undefined && themes.includes(cookies.theme)) {
+    let themeCookie = cookies.get("theme");
+    if (themeCookie !== undefined && themesList.includes(themeCookie)) {
         theme = cookies.theme;
     }
-    let themeCss = `/themes/ehui-${theme}.min.css`;
     return {
         theme: theme,
-        themeCss: themeCss
+        themeCCSSHref: `/themes/ehui-${theme}.min.css`
     }
 }

web/src/routes/+layout.svelte

@@ -1,11 +1,9 @@
 <script>
     let { children, data } = $props();
-    import Footer from "$lib/components/Footer.svelte";
 </script>
 
 <svelte:head>
-    <link rel="stylesheet" href={ data.themeCss } />
+    <link rel="stylesheet" href={ data.themeCSSHref } />
 </svelte:head>
 
 {@render children()}
-<Footer />

web/src/routes/dashboard/Dashboard.svelte

@@ -1,10 +1,17 @@
 <script>
     import Header from "$lib/components/Header.svelte";
     import Noscript from "$lib/components/Noscript.svelte";
+    import Footer from "$lib/components/Footer.svelte";
     let authed = false;
-    let data = {};
+    let { data } = $props();
+
+    import { onMount } from "svelte";
+    onMount(function () {
+      
+    })
 </script>
 
+<Header />
 <Noscript />
 <main>
   <div class="grid page">
@@ -91,6 +98,8 @@
     </div>
   </div>
 </main>
+<Footer />
+
 <script src="/assets/js/fancyTimestamp.js"></script>
 <script>
   if (window.localStorage && (localStorage.getItem("settingTimeHour") == "24h")) {