diff --git a/apps/web/src/app/(authenticated)/not-found.tsx b/apps/web/src/app/(authenticated)/not-found.tsx new file mode 100644 index 0000000..b4d41af --- /dev/null +++ b/apps/web/src/app/(authenticated)/not-found.tsx @@ -0,0 +1,160 @@ +import type { ReactElement } from "react"; +import Link from "next/link"; + +export default function AuthenticatedNotFound(): ReactElement { + return ( +
+
+ {/* Compass icon in blue-tinted icon well */} +
+ +
+ + {/* 404 badge pill */} + + 404 + + + {/* Heading + description */} +
+

+ Page not found +

+

+ This page doesn't exist or you may not have permission to view it. +

+
+ + {/* Action buttons */} +
+ {/* Primary: Dashboard */} + + Dashboard + + + {/* Ghost: Settings */} + + Settings + +
+
+
+ ); +} diff --git a/apps/web/src/app/not-found.tsx b/apps/web/src/app/not-found.tsx new file mode 100644 index 0000000..31930ba --- /dev/null +++ b/apps/web/src/app/not-found.tsx @@ -0,0 +1,175 @@ +import type { Metadata } from "next"; +import type { ReactElement } from "react"; +import Link from "next/link"; + +export const metadata: Metadata = { + title: "404 — Page Not Found | Mosaic Stack", +}; + +export default function NotFound(): ReactElement { + return ( +
+ {/* Mosaic logo mark — inline spans replicating the 5-element logo */} +
+ {/* Top-left: blue */} + + {/* Top-right: purple */} + + {/* Bottom-right: teal */} + + {/* Bottom-left: amber */} + + {/* Center: pink circle */} + +
+ + {/* 404 gradient text */} +

+ 404 +

+ + {/* Heading + description */} +
+

+ Page not found +

+

+ The page you're looking for doesn't exist or has been moved. +

+
+ + {/* Dashboard link styled as button */} + + Go to Dashboard + + + {/* Subtle status footer */} +

+ HTTP 404 — Not Found +

+
+ ); +}