Changed Navbar To Use Building Flag

silverlightning926 · Aug 30, 2024 · 08fa625 · 08fa625
1 parent ecb8411
commit 08fa625
Showing 1 changed file with 11 additions and 5 deletions.
diff --git a/src/components/NavBar.svelte b/src/components/NavBar.svelte
@@ -1,9 +1,15 @@
 <script lang="ts">
+	import { building } from "$app/environment";
+
 	let isMenuOpen: boolean = false;
 
 	function toggleMenu() {
 		isMenuOpen = !isMenuOpen;
 	}
+
+	function getLink(path: string) {
+		return !building ? `${path}.html` : path;
+	}
 </script>
 
 <nav class="navbar">
@@ -21,11 +27,11 @@
 		</button>
 		<ul class="navbar-menu" id="navbar-menu" class:show={isMenuOpen}>
 			<li><a href="/">Home</a></li>
-			<li><a href="/about.html">About</a></li>
-			<li><a href="/experience.html">Experience</a></li>
-			<li><a href="/projects.html">Projects</a></li>
-			<li><a href="/education.html">Education</a></li>
-			<li><a href="/contact.html">Contact</a></li>
+			<li><a href={getLink("/about")}>About</a></li>
+			<li><a href={getLink("/experience")}>Experience</a></li>
+			<li><a href={getLink("/projects")}>Projects</a></li>
+			<li><a href={getLink("/education")}>Education</a></li>
+			<li><a href={getLink("/contact")}>Contact</a></li>
 		</ul>
 	</div>
 </nav>