From b84267f3e714fd77ea2b1204c34144bcf224c028 Mon Sep 17 00:00:00 2001
From: JackDevilGod <jack.jh666@gmail.com>
Date: Sun, 18 Jan 2026 22:55:35 +0100
Subject: [PATCH 1/4] list dissappears when link is clicked

---
 src/lib/components/nav component/mobile navbar.svelte | 9 ++++++++-
 1 file changed, 8 insertions(+), 1 deletion(-)

diff --git a/src/lib/components/nav component/mobile navbar.svelte b/src/lib/components/nav component/mobile navbar.svelte
index 2a5d6d9..114954d 100644
--- a/src/lib/components/nav component/mobile navbar.svelte	
+++ b/src/lib/components/nav component/mobile navbar.svelte	
@@ -8,6 +8,10 @@
 		transformY = '-20px'
 	} = $props();
 	let open = $state(false);
+
+	const onClick = () => {
+		open = !open;
+	};
 </script>
 
 <nav id="mobile_navbar">
@@ -16,7 +20,10 @@
 	{#if open}
 		<ul style="transform: translateX({transformX}) translateY({transformY});">
 			{#each pages as { route, name } (route)}
-				<li><a href={resolve(route)}>{name}</a></li>
+				<li><a 
+					href={resolve(route)}
+					onclick={onClick}
+					>{name}</a></li>
 			{/each}
 		</ul>
 	{/if}

From 7850d451db0b0dde1bc68cf434fcb384a7f59e07 Mon Sep 17 00:00:00 2001
From: JackDevilGod <jack.jh666@gmail.com>
Date: Sun, 18 Jan 2026 23:08:39 +0100
Subject: [PATCH 2/4] it works now

---
 src/lib/components/nav component/burger_icon.svelte   | 10 ++++------
 src/lib/components/nav component/mobile navbar.svelte |  2 +-
 2 files changed, 5 insertions(+), 7 deletions(-)

diff --git a/src/lib/components/nav component/burger_icon.svelte b/src/lib/components/nav component/burger_icon.svelte
index 624de2f..d70867b 100644
--- a/src/lib/components/nav component/burger_icon.svelte	
+++ b/src/lib/components/nav component/burger_icon.svelte	
@@ -6,13 +6,11 @@
 
 	const onClick = () => {
 		open = !open;
-
-		if (open) {
-			state_class = 'open';
-		} else {
-			state_class = '';
-		}
 	};
+
+	$effect(() => {
+		state_class = open ? 'open' : '';
+	});
 </script>
 
 <button
diff --git a/src/lib/components/nav component/mobile navbar.svelte b/src/lib/components/nav component/mobile navbar.svelte
index 114954d..4c594f7 100644
--- a/src/lib/components/nav component/mobile navbar.svelte	
+++ b/src/lib/components/nav component/mobile navbar.svelte	
@@ -10,7 +10,7 @@
 	let open = $state(false);
 
 	const onClick = () => {
-		open = !open;
+		open = false;
 	};
 </script>
 

From 2b2a60719e051e2d5650c3ae4d284e83798470a8 Mon Sep 17 00:00:00 2001
From: JackDevilGod <jack.jh666@gmail.com>
Date: Sun, 18 Jan 2026 23:10:31 +0100
Subject: [PATCH 3/4] format

---
 src/lib/components/nav component/mobile navbar.svelte | 5 +----
 1 file changed, 1 insertion(+), 4 deletions(-)

diff --git a/src/lib/components/nav component/mobile navbar.svelte b/src/lib/components/nav component/mobile navbar.svelte
index 4c594f7..a6df4c9 100644
--- a/src/lib/components/nav component/mobile navbar.svelte	
+++ b/src/lib/components/nav component/mobile navbar.svelte	
@@ -20,10 +20,7 @@
 	{#if open}
 		<ul style="transform: translateX({transformX}) translateY({transformY});">
 			{#each pages as { route, name } (route)}
-				<li><a 
-					href={resolve(route)}
-					onclick={onClick}
-					>{name}</a></li>
+				<li><a href={resolve(route)} onclick={onClick}>{name}</a></li>
 			{/each}
 		</ul>
 	{/if}

From 41252cc6649d5ba092fc84edbbe670f6f8c1e2dd Mon Sep 17 00:00:00 2001
From: JackDevilGod <jack.jh666@gmail.com>
Date: Sun, 18 Jan 2026 23:13:49 +0100
Subject: [PATCH 4/4] lint

---
 src/lib/components/nav component/burger_icon.svelte   | 7 ++-----
 src/lib/components/nav component/mobile navbar.svelte | 2 +-
 2 files changed, 3 insertions(+), 6 deletions(-)

diff --git a/src/lib/components/nav component/burger_icon.svelte b/src/lib/components/nav component/burger_icon.svelte
index d70867b..3e37d29 100644
--- a/src/lib/components/nav component/burger_icon.svelte	
+++ b/src/lib/components/nav component/burger_icon.svelte	
@@ -1,16 +1,13 @@
 <script>
 	const amount = [1, 2, 3];
-	let state_class = $state('');
 
 	let { open = $bindable(false), arialabel = 'toggle menu' } = $props();
 
+	let state_class = $derived(open ? 'open' : '');
+
 	const onClick = () => {
 		open = !open;
 	};
-
-	$effect(() => {
-		state_class = open ? 'open' : '';
-	});
 </script>
 
 <button
diff --git a/src/lib/components/nav component/mobile navbar.svelte b/src/lib/components/nav component/mobile navbar.svelte
index a6df4c9..238eced 100644
--- a/src/lib/components/nav component/mobile navbar.svelte	
+++ b/src/lib/components/nav component/mobile navbar.svelte	
@@ -7,7 +7,7 @@
 		transformX = '-50%',
 		transformY = '-20px'
 	} = $props();
-	let open = $state(false);
+	let open = $derived(false);
 
 	const onClick = () => {
 		open = false;