Completed dark mode and about page changes

src/app.scss

@@ -36,18 +36,18 @@
 	--fg: hsl(0, 0%, 10%);
 	--fg-muted: hsl(0, 0%, 50%);
 	--fg-muted-alt: hsl(0, 0%, 75%);
-	--fg-highlight: hsl(303, 52%, 42%);
+	--fg-highlight: hsl(303, 61%, 47%);
 	--fg-failure: hsl(0, 67%, 49%);
 }
 
 @mixin dark {
-	--accent-bg: hsl(303, 73%, 35%);
+	--accent-bg: hsl(304, 41%, 21%);
-	--accent-fg: hsl(0, 0%, 90%);
+	--accent-fg: hsl(303, 73%, 81%);
-	--bg: hsl(0, 0%, 10%);
+	--bg: hsl(0, 0%, 8%);
 	--fg: hsl(0, 0%, 90%);
-	--fg-muted: hsl(0, 0%, 65%);
+	--fg-muted: hsl(0, 0%, 50%);
-	--fg-muted-alt: hsl(0, 0%, 50%);
+	--fg-muted-alt: hsl(0, 0%, 25%);
-	--fg-highlight: hsl(303, 52%, 60%);
+	--fg-highlight: hsl(303, 64%, 65%);
 	--fg-failure: hsl(0, 67%, 80%);
 }
 

src/lib/components/functional/FancyMenu.svelte

@@ -38,7 +38,7 @@
 	{/if}
 	{#each links as { name, url } (url)}
 		<a
-			class="w-1/2 px-2 h-[calc(100%-16px)] mt-2 flex items-center justify-center rounded-xl relative font-display overflow-hidden"
+			class="w-1/2 px-2 h-[calc(100%-16px)] mt-2 flex items-center justify-center rounded-xl relative overflow-hidden font-medium"
 			href={url}
 			onclick={() => {
 				if (shouldGoBack) {

src/routes/+layout.svelte

@@ -88,7 +88,7 @@
 	<div class="flex justify-center mb-5 lg:hidden">
 		<a
 			href="/"
-			class="px-6 relative h-16 mr-3 justify-center items-center bg-accent-background fill-accent-foreground rounded-xl md:hidden flex"
+			class="px-4 relative h-14 mr-3 justify-center items-center bg-accent-background fill-accent-foreground rounded-xl md:hidden flex"
 		>
 			<div class="h-6 w-24 items-center flex justify-center">
 				<Logo />

src/routes/about/+page.svelte

@@ -63,18 +63,28 @@
 		class="font-display text-3xl mt-12 text-transition"
 		style="--delay: {5 * multiplier}ms"
 	>
-		👨‍💻 source code
+		🔗 resources
 	</h2>
-	<p class="mt-6 text-transition" style="--delay: {6 * multiplier}ms">
+	<ul class="list-disc list-inside mt-6">
-		VERT is licensed under AGPL-3.0, and the source code can be found on <a
+		<li class="text-transition" style="--delay: {6 * multiplier}ms">
-			class="hover:underline font-medium text-foreground-highlight"
+			<a
-			href="https://github.com/not-nullptr/VERT">GitHub</a
+				href="https://github.com/notnullptr/VERT"
-		>.
+				class="text-foreground-highlight hover:underline">Source code</a
-	</p>
+			> (hosted on GitHub, licensed under AGPL-3.0)
+		</li>
+
+		<li class="text-transition" style="--delay: {7 * multiplier}ms">
+			<a
+				href="https://discord.gg/8XXZ7TFFrK"
+				class="text-foreground-highlight hover:underline"
+				>Discord server</a
+			> (for chit-chat, suggestions, and support)
+		</li>
+	</ul>
 
 	<h2
 		class="font-display text-3xl mt-12 text-transition"
-		style="--delay: {7 * multiplier}ms"
+		style="--delay: {8 * multiplier}ms"
 	>
 		🎨 credits
 	</h2>
@@ -83,7 +93,7 @@
 			<div class="hover:scale-105 w-56 transition-transform">
 				<div
 					class="border-2 credit-transition border-solid border-foreground-muted-alt rounded-2xl overflow-hidden"
-					style="--delay: {i * 50 + multiplier * 8}ms;"
+					style="--delay: {i * 50 + multiplier * 9}ms;"
 				>
 					<a class="w-48" href={credit.url} target="_blank">
 						<img src={credit.avatar} alt="{credit.name}'s avatar" />
@@ -101,7 +111,7 @@
 
 	<p
 		class="text-foreground-muted text-base mt-10 text-transition"
-		style="--delay: {9 * multiplier}ms"
+		style="--delay: {10 * multiplier}ms"
 	>
 		(obviously inspired by <a
 			href="https://cobalt.tools"