diff --git a/src/app/layout/Menu.svelte b/src/app/layout/Menu.svelte index 00d7b34..0496737 100644 --- a/src/app/layout/Menu.svelte +++ b/src/app/layout/Menu.svelte @@ -12,11 +12,15 @@ import { navigate } from 'astro:transitions/client'; import { onMount } from 'svelte'; + // html bindings + let navElem: HTMLDivElement; + + // states let navPaths = $state([ { name: 'Startseite', sprite: MenuHome.src, - href: ``, + href: '', active: false }, { @@ -56,20 +60,22 @@ let isOpen = $state(false); let windowHeight = $state(0); + // lifecycle $effect(() => { localStorage.setItem('showMenuPermanent', `${showMenuPermanent}`); }); onMount(() => { - new MutationObserver(() => { - for (let i = 0; i < navPaths.length; i++) { - console.log(navPaths[i].href, window.location.pathname); - navPaths[i].active = new URL(navPaths[i].href).pathname === window.location.pathname; - } - }).observe(document.head, { childList: true }); + updateActiveNavPath(); + new MutationObserver(updateActiveNavPath).observe(document.head, { childList: true }); }); - let navElem: HTMLDivElement; + // functions + function updateActiveNavPath() { + for (let i = 0; i < navPaths.length; i++) { + navPaths[i].active = new URL(document.baseURI).pathname + navPaths[i].href === window.location.pathname; + } + }