Update to proper 404

404/index.page.tsx → 404.tsx

@@ -1,6 +1,6 @@
 export const layout = "raw.tsx";
-export const url = "/404";
-import { sidebar } from "../runtime/_data.ts";
+export const url = "/404.html";
+import { sidebar } from "./runtime/_data.ts";
 
 const styles = /*css*/ `
 #content nav {
@@ -42,13 +42,7 @@ export default function Page(props: Lume.Data, helpers: Lume.Helpers) {
         <h1 class="text-2xl font-semibold sm:text-3xl md:text-4xl">
           Sorry, couldn’t find that page.
         </h1>
-        <p class="text-sm mt-3">
-          Failed to match route{" "}
-          <code class="p-1 rounded bg-foreground-tertiary" id="tried-path">
-            404
-          </code>
-        </p>
-        <p class="md:text-lg mt-6">
+        <p class="md:text-lg mt-4">
           Maybe one of these links has what you're looking for?
         </p>
       </div>

_config.ts

@@ -144,9 +144,9 @@ site.process([".html"], (pages) => {
     const document = page.document!;
     if (!document.querySelector(".ddoc")) {
       document.body.classList.add("apply-prism");
-      document.querySelectorAll("body.apply-prism pre code").forEach((
-        element,
-      ) => Prism.highlightElement(element));
+      document
+        .querySelectorAll("body.apply-prism pre code")
+        .forEach((element) => Prism.highlightElement(element));
     }
   }
 });

middleware/redirects.ts

@@ -46,15 +46,6 @@ export default async function redirectsMiddleware(
       res = await next(req);
     }
 
-    if (res.status === 404) {
-      res = new Response(null, {
-        headers: {
-          location: "/404" + "?path=" + encodeURIComponent(url.pathname)
-        },
-        status: 303,
-      });
-    }
-
     return res;
   } catch (e) {
     res = new Response("Internal Server Error", {