feat: add 404 page

Author: TheComputerM

src/components/Footer.astro

@@ -4,8 +4,8 @@ import { Container } from "styled-system/jsx";
 ---
 
 <footer>
-  <Container>
-    <HStack borderTopWidth="normal" py="4" justify="space-between">
+  <Container borderTopWidth="normal">
+    <HStack height="12" justify="space-between">
       <span class="caret-blink">TheComputerM</span>
       {new Date().getFullYear()}
     </HStack>

src/pages/404.astro

@@ -0,0 +1,10 @@
+---
+import { Center } from "styled-system/jsx";
+import BaseLayout from "~/layouts/BaseLayout.astro";
+---
+
+<BaseLayout title="404 | Not Found">
+  <Center position="relative" style={{ height: "calc(100svh - 7rem)" }}>
+    <h1>404</h1>
+  </Center>
+</BaseLayout>

src/pages/index.astro

@@ -32,7 +32,8 @@ const { Content } = await render(entry);
 		color: #9d00ff;
 		text-shadow:
 			4px 0 6px #ff0000,
-			-4px 0 6px #0000ff;
+			-4px 0 6px #0000ff,
+			0 0 2rem currentColor;
 	}
 
 	.banner {
@@ -46,7 +47,7 @@ const { Content } = await render(entry);
 		inset: 0;
 		z-index: 2;
 		pointer-events: none;
-
+		mix-blend-mode: color-burn;
 		background: linear-gradient(
 				rgba(18, 16, 16, 0) 50%,
 				rgba(0, 0, 0, 0.25) 50%
@@ -57,6 +58,7 @@ const { Content } = await render(entry);
 				rgba(0, 255, 0, 0.02),
 				rgba(0, 0, 255, 0.06)
 			);
+
 		background-size:
 			100% 2px,
 			3px 100%;