Element Bug Fixes

src/routes/+error.svelte

@@ -1,9 +1,9 @@
 <script lang="ts">
 	import { page } from "$app/stores";
-	import { goto } from "$app/navigation";
+
 	import TerminalTUI from "$lib/components/TerminalTUI.svelte";
 	import type { TerminalLine } from "$lib/components/tui/types";
-	import { user, site } from "$lib/config";
+	import { user } from "$lib/config";
 
 	// Fun 404 messages
 	const notFoundMessages = [
@@ -60,11 +60,11 @@
 		// 404: Page Not Found (Pink)
 		if (status === 404) {
 			return [
-				"(&pink) █ █  ███  █ █  (&)",
-				"(&pink) █ █ █   █ █ █  (&)",
-				"(&pink) ███ █   █ ███  (&)",
-				"(&pink)   █ █   █   █  (&)",
-				"(&pink)   █  ███    █  (&)",
+				"(&pink) █  █  ███  █  █  (&)",
+				"(&pink) █  █ █   █ █  █  (&)",
+				"(&pink) ████ █   █ ████  (&)",
+				"(&pink)    █ █   █    █  (&)",
+				"(&pink)    █  ███     █  (&)",
 			];
 		}
 
@@ -89,8 +89,8 @@
 		];
 	}
 
-	const funMessage = getFunMessage();
-	const asciiLines = getAsciiArt();
+	const funMessage = $derived(getFunMessage());
+	const asciiLines = $derived(getAsciiArt());
 
 	// Build the terminal lines for the error page (derived to capture reactive values)
 	const lines = $derived<TerminalLine[]>([
@@ -99,7 +99,7 @@
 		{ type: "blank", content: "" },
 
 		// ASCII art
-		...asciiLines.map((line) => ({ type: "output" as const, content: line })),
+		...asciiLines.map((line: string) => ({ type: "output" as const, content: line })),
 		{ type: "blank", content: "" },
 
 		// Error status (styled with leading X like the screenshot)
@@ -107,25 +107,15 @@
 			type: "error",
 			content: `(&error,bold)X Error ${status}: ${errorMessage}(&)`,
 		},
-		{ type: "blank", content: "" },
-
-		// Fun message as a comment
 		{ type: "output", content: `(&muted,italic)# ${funMessage}(&)` },
-		{ type: "blank", content: "" },
-
 		{ type: "divider", content: "SUGGESTIONS" },
-		{ type: "blank", content: "" },
-
 		// Suggestions
 		{ type: "command", content: "cat suggestions.txt" },
 		{ type: "info", content: "Check if the URL is correct" },
 		{ type: "info", content: "Try refreshing the page" },
 		{ type: "info", content: "Contact me if the problem persists" },
-		{ type: "blank", content: "" },
 
 		{ type: "divider", content: "ACTIONS" },
-		{ type: "blank", content: "" },
-
 		// Navigation buttons
 		{
 			type: "button",
@@ -141,6 +131,7 @@
 			style: "accent",
 			action: () => history.back(),
 		},
+		{ type: "blank", content: "" },
 	]);
 </script>