I think i forgot to include this file lol

src/routes/+layout.svelte

@@ -1,8 +1,8 @@
 <!-- If url contains "hideOnPrint" param, then detect if start printing then hide elements -->
 <script lang="ts">
     import "../app.css";
-  import { fly } from "svelte/transition";
+    import { fly } from 'svelte/transition';
-  import MediaQuery from "svelte-media-queries";
+    import MediaQuery from 'svelte-media-queries';
     import { Dices } from "@lucide/svelte";
     let hideOnPrint: boolean;
 
@@ -11,76 +11,65 @@
     import DeprivedLogo from "$lib/images/DeprivedLogo.svelte";
     import HamburgerMenuIcon from "$lib/images/HamburgerMenuIcon.svelte";
 
-  const footerCollapseThreshold: string = "1000px";
+    const footerCollapseThreshold : string = '1000px';
-  const headerCollapseThreshold: string = "1000px";
+    const headerCollapseThreshold : string = '1000px';
-  let footerCollapse: boolean;
+    let footerCollapse : boolean;
-  let isMobile: boolean = $state(false);
+    let isMobile : boolean = $state(false);
 
-  let navbarHidden: boolean = $state(true);
+    let navbarHidden : boolean = $state(true);
 
     function resetNavBar() {
         navbarHidden = true;
     }
 
-  import { afterNavigate } from "$app/navigation";
+    import { afterNavigate } from '$app/navigation';
     afterNavigate(() => {
         const params = new URLSearchParams(window.location.search);
-    hideOnPrint = params.get("hideOnPrint") === "1";
+        hideOnPrint = params.get('hideOnPrint') === '1';
         //console.log(hideOnPrint);
     });
 
-  import { onMount } from "svelte";
+    import { onMount } from 'svelte';
     import Zooter from "./comps/Zooter.svelte";
     
     onMount(async () => {
-    const lock = document.createElement("meta");
+        const lock = document.createElement('meta');
-    lock.name = "darkreader-lock";
+        lock.name = 'darkreader-lock';
         document.head.appendChild(lock);
     });
 
-  function nextTheme() {
+    function nextTheme(){
         let theme: string | null = null;
 
-    if (typeof localStorage !== "undefined") {
+        if (typeof localStorage !== 'undefined') {
-      theme = localStorage.getItem("theme");
+            theme = localStorage.getItem('theme');
         }
 
         const themesArr = (window as any).AvailableThemes;
         let nextTheme = "dark";
-    if (
+        if (theme == "null" || theme == "undefined" || theme == undefined || theme == null){
-      theme == "null" ||
+
-      theme == "undefined" ||
-      theme == undefined ||
-      theme == null
-    ) {
         } else {
             nextTheme = themesArr[(1 - -themesArr.indexOf(theme)) % themesArr.length];
         }
 
         console.log("Slecting: " + nextTheme);
-    document.documentElement.setAttribute("data-theme", nextTheme);
+        document.documentElement.setAttribute('data-theme', nextTheme);
-    localStorage.setItem("theme", nextTheme);
+        localStorage.setItem('theme', nextTheme);
     }
+
+    
 </script>
 
 {#snippet SwitchThemeButton()}
-  <div
+<div class="tooltip tooltip-bottom grid place-content-center" data-tip="Switch theme">
-    class="tooltip tooltip-bottom grid place-content-center"
+    <button class="cursor-pointer" onclick={nextTheme}> <Dices/></button>
-    data-tip="Switch theme"
+</div>
-  >
-    <button class="cursor-pointer" onclick={nextTheme}> <Dices /></button>
-  </div>
 {/snippet}
 
 <!-- Detect mobile -->
-<MediaQuery
+<MediaQuery query='(max-width: {footerCollapseThreshold})' bind:matches={footerCollapse} />
-  query="(max-width: {footerCollapseThreshold})"
+<MediaQuery query='(max-width: {headerCollapseThreshold})' bind:matches={isMobile} />
-  bind:matches={footerCollapse}
-/>
-<MediaQuery
-  query="(max-width: {headerCollapseThreshold})"
-  bind:matches={isMobile}
-/>
 
 <!-- Nav bar -->
 <div class="bg-base-200 p-0">
@@ -89,10 +78,7 @@
             {#if !isMobile}
                 <div class="desktop">
                     <a href="/" class="nav-head">
-            <DeprivedLogo
+                        <DeprivedLogo Class="fill-base-content p-2" Style="width: 3.5rem; height: auto;"/>
-              Class="fill-base-content p-2"
-              Style="width: 3.5rem; height: auto;"
-            />
                         <!-- <h3 id="logo-text">The Deprived Devs</h3> -->
                     </a>
                     <div class="nav-spacer" />
@@ -102,11 +88,7 @@
 
                     {@render SwitchThemeButton()}
                     
-          <a
+                    <a href="/zhen/cv/rev2?hideOnPrint=1" target="_blank" style="width: 7.5rem;">Zhen CV</a>
-            href="/zhen/cv/rev2?hideOnPrint=1"
-            target="_blank"
-            style="width: 7.5rem;">Zhen CV</a
-          >
                     <a href="/tools" style="width: 7.5rem;">Tools</a>
                     <a href="https://botalex.itch.io/" target="_blank">Games</a>
                     <!-- <a href="/posts">Blog</a>
@@ -115,33 +97,20 @@
             {:else}
                 <div class="collapsed shadow-xl">
                     <a onclick={resetNavBar} href="/" class="nav-head">
-            <DeprivedLogo
+                        <DeprivedLogo Class="fill-base-content p-2" Style="width: 3.5rem; height: auto;"/>
-              Class="fill-base-content p-2"
-              Style="width: 3.5rem; height: auto;"
-            />
                         <!-- <h3 id="logo-text">The Deprived Devs</h3> -->
                     </a>
                     <div class="nav-spacer" />
                     {@render SwitchThemeButton()}
                     <div class="px-1"></div>
-          <button
+                    <button id="toggle-nav" onclick={() => {navbarHidden = !navbarHidden; console.log(navbarHidden);}}>
-            id="toggle-nav"
+                        <HamburgerMenuIcon Class="fill-base-content"/>
-            onclick={() => {
-              navbarHidden = !navbarHidden;
-              console.log(navbarHidden);
-            }}
-          >
-            <HamburgerMenuIcon Class="fill-base-content" />
                     </button>
                 </div>
                 {#if !navbarHidden}
                 <div class="nav-list" transition:fly={{ y: -25, duration: 350 }}>
                     <!-- <a onclick={resetNavBar} href="/">Home</a> -->
-            <a
+                    <a onclick={resetNavBar} href="https://botalex.itch.io/" target="_blank">Games</a>
-              onclick={resetNavBar}
-              href="https://botalex.itch.io/"
-              target="_blank">Games</a
-            >
                     <a href="/zhen/cv/rev2?hideOnPrint=1" target="_blank">Zhen's CV</a>
                         <!-- <a onclick={resetNavBar} href="/posts">Blog</a>
                         <a onclick={resetNavBar} href="/about">About</a> -->
@@ -154,23 +123,9 @@
     <!-- Page content -->
     {@render children?.()}
 
-  <Zooter bind:hideOnPrint />
+    <Zooter bind:hideOnPrint/>
 </div>
 
-{#if footerCollapse}
-  <style>
-    .about-container {
-      flex-direction: column;
-      justify-content: center !important;
-      gap: 25px;
-    }
-  </style>
-{/if}
-
-{#if isMobile}
-  <style>
-  </style>
-{/if}
 
 <style lang="scss">
     /* Nav bar. */
@@ -204,6 +159,7 @@
         border: none;
     }
 
+
     .nav-list {
         display: flex;
         flex-direction: column;
@@ -315,5 +271,21 @@
     .hide-on-print {
         display: none;
     }
-  }
+}
 </style>
+
+{#if footerCollapse}
+    <style>
+        .about-container {
+            flex-direction: column;
+            justify-content: center !important;
+            gap: 25px;
+        }
+    </style>
+{/if}
+
+{#if isMobile}
+    <style>
+
+    </style>
+{/if}