From 5e3eadf941d98914ae304ea70933db5c4e73ee73 Mon Sep 17 00:00:00 2001
From: Ax333l <main@axelen.xyz>
Date: Wed, 8 Feb 2023 17:39:34 +0100
Subject: [PATCH] no more a tags

---
 src/lib/components/atoms/Button.svelte    | 16 +++-----
 src/lib/components/atoms/NavButton.svelte | 49 -----------------------
 2 files changed, 6 insertions(+), 59 deletions(-)
 delete mode 100644 src/lib/components/atoms/NavButton.svelte

diff --git a/src/lib/components/atoms/Button.svelte b/src/lib/components/atoms/Button.svelte
index 9cab3de..9d89b47 100644
--- a/src/lib/components/atoms/Button.svelte
+++ b/src/lib/components/atoms/Button.svelte
@@ -1,25 +1,21 @@
 <script>
 	export let kind = 'secondary';
 	$: type = 'button-' + kind;
-	export let href = '';
 	export let maxWidth = false;
 	export let icon = '';
   export let alt = '';
-	export let target = '';
 	export let unclickable = false;
 </script>
 
-<a {href} {target} on:click class:unclickable>
-	<div class={type} style="width: {maxWidth ? '100%' : 'max-content'}">
+	<button class={type} class:unclickable on:click style="width: {maxWidth ? '100%' : 'max-content'}">
 		{#if icon}
 			<img src={icon} {alt} />
 		{/if}
 		<slot />
-	</div>
-</a>
+	</button>
 
 <style>
-	a {
+	button {
 		text-decoration: none;
 		border-radius: 16px;
 		transition: all 0.2s var(--bezier-one);
@@ -29,7 +25,7 @@
 		cursor: not-allowed;
 		opacity: 0.4;
 	}
-	div,
+	button,
 	.button-secondary {
 		min-width: max-content;
 		font-size: 1rem;
@@ -50,11 +46,11 @@
 		color: #65002F;
 	}
 
-	div:hover {
+	button:hover {
 		filter: brightness(85%);
 	}
 
-	div,
+	button,
 	.button-secondary {
 		display: flex;
 		justify-content: center;
diff --git a/src/lib/components/atoms/NavButton.svelte b/src/lib/components/atoms/NavButton.svelte
deleted file mode 100644
index f24a44d..0000000
--- a/src/lib/components/atoms/NavButton.svelte
+++ /dev/null
@@ -1,49 +0,0 @@
-<script>
-  import RouterEvents from '../../../data/RouterEvents';
-	export let href = '/';
-  export let is_selected = target_url => href === target_url;
-</script>
-
-<a data-sveltekit-prefetch {href}>
-	<li class:selected={is_selected($RouterEvents.target_url.pathname)}>
-		<slot />
-	</li>
-</a>
-
-<style>
-	li {
-		border: var(--grey-six);
-		text-align: center;
-		list-style: none;
-		position: relative;
-		font-weight: 500;
-		font-size: 0.9rem;
-		align-items: center;
-		border: var(--grey-six);
-		transition-timing-function: var(--bezier-one);
-		transition-duration: 0.25s;
-		padding: 10px 25px;
-		border-radius: 200px;
-		display: flex;
-		align-items: center;
-		justify-content: center;
-	}
-
-	a {
-		color: var(--grey-five);
-		text-decoration: none;
-		font-size: 1rem;
-		user-select: none;
-		border-radius: 200px;
-	}
-
-	li:hover {
-		color: var(--white);
-		background-color: var(--grey-one);
-	}
-
-	li.selected {
-		background-color: var(--grey-two);
-		color: var(--accent-color);
-	}
-</style>