rewrite frontpage

kitsune-fe/package.json

@@ -13,9 +13,9 @@
 		"format": "prettier --write ."
 	},
 	"devDependencies": {
-		"@sveltejs/adapter-auto": "^3.0.0",
+		"@sveltejs/adapter-static": "^3.0.1",
 		"@sveltejs/kit": "^2.0.0",
-		"@sveltejs/vite-plugin-svelte": "^3.0.0",
+		"@sveltejs/vite-plugin-svelte": "^3.1.0",
 		"@types/eslint": "^8.56.0",
 		"@typescript-eslint/eslint-plugin": "^7.0.0",
 		"@typescript-eslint/parser": "^7.0.0",
@@ -24,16 +24,13 @@
 		"eslint-plugin-svelte": "^2.36.0-next.4",
 		"prettier": "^3.1.1",
 		"prettier-plugin-svelte": "^3.1.2",
+		"sass": "^1.76.0",
 		"svelte": "^5.0.0-next.1",
 		"svelte-check": "^3.6.0",
 		"tslib": "^2.4.1",
 		"typescript": "^5.0.0",
 		"vite": "^5.0.3",
 		"vitest": "^1.2.0"
 	},
-	"type": "module",
-	"dependencies": {
-		"@fortawesome/fontawesome-free": "^6.5.2",
-		"sass": "^1.75.0"
-	}
+	"type": "module"
 }

kitsune-fe/src/lib/components/Button.svelte

@@ -0,0 +1,38 @@
+<script lang="ts">
+	import { type Snippet } from 'svelte';
+
+	let {
+		children,
+		...rest
+	}:
+		| {
+				children: Snippet;
+		  }
+		| any = $props();
+</script>
+
+<button {...rest}>
+	{@render children()}
+</button>
+
+<style lang="scss">
+	@use '../../styles/colours' as *;
+
+	button {
+		transition: 0.5s;
+		cursor: pointer;
+
+		border: 0;
+		border-radius: 5px;
+
+		background-color: $shade1dark;
+
+		padding: 10px;
+		width: 100px;
+		font-size: 16px;
+
+		&:hover {
+			background-color: $shade2dark;
+		}
+	}
+</style>