diff --git a/.changeset/slimy-beers-chew.md b/.changeset/slimy-beers-chew.md new file mode 100644 index 000000000..475932a52 --- /dev/null +++ b/.changeset/slimy-beers-chew.md @@ -0,0 +1,5 @@ +--- +"nostrudel": minor +--- + +Add 404 page diff --git a/src/app.tsx b/src/app.tsx index faa47441d..040f7c544 100644 --- a/src/app.tsx +++ b/src/app.tsx @@ -12,6 +12,7 @@ import useSetColorMode from "./hooks/use-set-color-mode"; import TaskManagerProvider from "./views/task-manager/provider"; // one off views +import NoteFoundView from "./views/404"; import NostrLinkView from "./views/link"; import HomeView from "./views/home"; import ThreadView from "./views/thread"; @@ -75,6 +76,7 @@ const NoLayoutPage = () => { const router = createBrowserRouter( [ + { path: "*", Component: NoteFoundView }, { path: "signin", Component: NoLayoutPage, diff --git a/src/views/404/index.tsx b/src/views/404/index.tsx new file mode 100644 index 000000000..4f96b3b1a --- /dev/null +++ b/src/views/404/index.tsx @@ -0,0 +1,45 @@ +import { Button, Flex, Heading, Image, Text } from "@chakra-ui/react"; +import VerticalPageLayout from "../../components/vertical-page-layout"; +import styled from "@emotion/styled"; +import RouterLink from "../../components/router-link"; + +const ImageContainer = styled.div` + border-width: 1rem; + border-color: red; + border-style: solid; + box-sizing: content-box; + position: relative; + border-radius: 50%; + overflow: hidden; + + :after { + content: ""; + display: block; + position: absolute; + top: calc(50% - 0.75rem); + left: -10%; + transform: rotateZ(-45deg); + width: 120%; + height: 1.5rem; + background: red; + } +`; + +export default function NoteFoundView() { + return ( + + + + + + 404 + + + Looks like that page does not exist + + + + ); +}