src/routes/Navbar.svelte

@@ -1,6 +1,7 @@
 <script lang="ts">
 	import { page } from '$app/stores';
 	import { routes } from "$lib/sitemap.ts"
+	import { name } from '$content/metadata.json';
 
 	function isCurrentLink(pathname, route) {
 		return route != "/" && pathname.startsWith(route)
@@ -9,6 +10,7 @@
 </script>
 
 <div id="navbar" class="h-5 space-x-4">
+	<p id="bio-name">{name}</p>
 	{#each routes as item}
 		<a
 			class="nav-link"
@@ -19,6 +21,12 @@
 </div>
 
 <style>
+	#bio-name {
+		font-family: serif;
+		font-size: 3rem;
+		font-weight: normal;
+		color: theme('colors.java.800');
+	}
 	#navbar {
 		display: flex;
 		flex-direction: column;