From 0a08ba075c4270e84b53e449fbe627a030f00aec Mon Sep 17 00:00:00 2001
From: Dustin Chavez <dustin_chavez@csu.fullerton.edu>
Date: Thu, 28 Oct 2021 08:45:17 -0700
Subject: [PATCH] Fixed navigation tab bug

---
 package-lock.json                         |  1 +
 src/lib/components/sections/navbar.svelte | 21 +++++++++++----------
 2 files changed, 12 insertions(+), 10 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index 651855ce3..d7f90d09e 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -5,6 +5,7 @@
 	"requires": true,
 	"packages": {
 		"": {
+			"name": "acmcsuf.com",
 			"version": "1.1.0",
 			"dependencies": {
 				"rfs": "^9.0.6"
diff --git a/src/lib/components/sections/navbar.svelte b/src/lib/components/sections/navbar.svelte
index b3038a747..444a63ec5 100644
--- a/src/lib/components/sections/navbar.svelte
+++ b/src/lib/components/sections/navbar.svelte
@@ -1,17 +1,18 @@
 <script lang="ts">
-	export let segment: string;
+	import { page } from '$app/stores';
+
 	let menu: HTMLUListElement;
 	let checkbox: HTMLInputElement;
 
 	const menuItems = [
-		{ title: 'about', slug: 'about' },
-		{ title: 'events', slug: 'events' },
-		{ title: 'paths', slug: 'paths' },
+		{ title: 'about', path: '/about' },
+		{ title: 'events', path: '/events' },
+		{ title: 'paths', path: '/paths' },
 		{
 			title: '<span class="headers">node</span>Buds',
-			slug: 'nodebuds',
+			path: '/nodebuds',
 		},
-		{ title: 'connect', slug: 'connect' },
+		{ title: 'connect', path: '/connect' },
 	];
 
 	const handleClose = () => {
@@ -30,14 +31,14 @@
 		</a>
 
 		<ul class="pages" bind:this={menu}>
-			{#each menuItems as { title, slug } (slug)}
+			{#each menuItems as { title, path } (path)}
 				<li>
 					<a
 						on:click={() => handleClose()}
-						href={`/${slug}`}
-						class="{`page page-${slug}`} headers"
+						href={path}
+						class="{`page page-${path.replace(/^\//, "")}`} headers"
 						rel="prefetch"
-						aria-current={segment === slug}>
+						aria-current={path === $page.path }>
 						{@html title}
 					</a>
 				</li>