From df67f55ad95dc7e3babbe039b1dbbe7dd9269362 Mon Sep 17 00:00:00 2001
From: DutchEllie <personal@quenten.nl>
Date: Sat, 2 Jul 2022 18:19:16 +0200
Subject: [PATCH] more easily visible navbar

---
 src/components/navbutton.svelte | 13 ++++++++++++-
 1 file changed, 12 insertions(+), 1 deletion(-)

diff --git a/src/components/navbutton.svelte b/src/components/navbutton.svelte
index 730ee9f..2a7e10e 100644
--- a/src/components/navbutton.svelte
+++ b/src/components/navbutton.svelte
@@ -1,15 +1,26 @@
 <script>
+	import {page} from '$app/stores';
 	export let link = '';
 	export let text = '';
 </script>
 
 <a href="{link}">
-<button class="text-slate-50 py-2 px-4 font-montserrat font-light link-underline">
+<button class="{$page.url.pathname == link ? "active-now" : ""} text-violet-50 py-2 px-4 font-montserrat font-light link-underline">
 	{text}
 </button>
 </a>
 
 <style>
+	.active-now:before {
+		content: '';
+		position: absolute;
+		width: 100%;
+		transform: scaleX(1);
+		height: 2px;
+		bottom: 0;
+		left: 0;
+		background-color: #638CF6;
+	}
 	.link-underline {
 		display: inline-block;
 		position: relative;