netlify.toml redirects for 404; sticky header

netlify.toml

@@ -62,8 +62,23 @@ from = "/discord"
 to = "https://discord.com/users/297930621760831488"
 status = 301
 
-# Redirect unknown paths to home
+# 404 redirects
 [[redirects]]
-from = "/*"
-to = "/index.html"
-status = 200
+from = "/:path"
+to = "/"
+status = 301
+
+[[redirects]]
+from = "/:path/"
+to = "/"
+status = 301
+
+[[redirects]]
+from = "/:path/*"
+to = "/"
+status = 301
+
+[[redirects]]
+from = "/index.html"
+to = "/"
+status = 301

src/components/Header/header.module.scss

@@ -8,6 +8,9 @@
     background-color: var(--header-color);
     padding: 0.5rem 1rem;
     box-shadow: 0 4px 6px rgba(0, 0, 0, 0.2);
+    position: sticky;
+    top: 0;
+    z-index: 10;
     a h1 {
         text-decoration: none;
     }

src/root.tsx

@@ -34,6 +34,7 @@ export const Layout = ({
                     name="viewport"
                 />
                 <meta content="#383838" name="theme-color" />
+                <meta content="dark" name="color-scheme" />
                 <meta content="index, follow" name="robots" />
                 <meta content="piech.dev" name="apple-mobile-web-app-title" />
                 <meta content="telephone=no" name="format-detection"></meta>

src/styles/global.scss

@@ -3,6 +3,7 @@
 html,
 #root,
 body {
+    color-scheme: dark;
     font-size: 1rem;
     background-color: var(--background-color);
     color: var(--text-color);