Feat/new UI (#153)

* wip

* feat: make forms functional

* feat: finalize pages

* chore: remove unused translations

* feat: app context

* feat: user context

* feat: finalize username login

* fix: use correct tab order in login form

* feat: add oauth logic

* chore: update readme and assets

* chore: rename docs back to assets

* feat: favicons

* feat: custom background image config option

* chore: add acknowledgements for background image

* feat: sanitize redirect URL

* feat: sanitize redirect URL on check

* chore: fix dependabot config

* refactor: bot suggestions

* fix: correctly redirect to app and check for untrusted redirects

* fix: run oauth auto redirect only when there is a redirect URI

* refactor: change select color

* fix: fix dockerfiles

* fix: fix hook rendering

* chore: remove translations cdn

* chore: formatting

* feat: validate api response against zod schema

* fix: use axios error instead of generic error in login page

frontend/src/pages/not-found-page.tsx

@@ -1,20 +1,27 @@
-import { Button, Paper, Text } from "@mantine/core";
-import { Layout } from "../components/layouts/layout";
+import { Button } from "@/components/ui/button";
+import {
+  Card,
+  CardDescription,
+  CardFooter,
+  CardHeader,
+  CardTitle,
+} from "@/components/ui/card";
 import { useTranslation } from "react-i18next";
+import { useNavigate } from "react-router";
 
 export const NotFoundPage = () => {
   const { t } = useTranslation();
+  const navigate = useNavigate();
+
   return (
-    <Layout>
-      <Paper shadow="md" p={30} mt={30} radius="md" withBorder>
-        <Text size="xl" fw={700}>
-          {t("notFoundTitle")}
-        </Text>
-        <Text>{t("notFoundSubtitle")}</Text>
-        <Button fullWidth mt="xl" onClick={() => window.location.replace("/")}>
-          {t("notFoundButton")}
-        </Button>
-      </Paper>
-    </Layout>
+    <Card className="min-w-xs sm:min-w-sm">
+      <CardHeader>
+        <CardTitle className="text-3xl">{t("notFoundTitle")}</CardTitle>
+        <CardDescription>{t("notFoundSubtitle")}</CardDescription>
+      </CardHeader>
+      <CardFooter className="flex flex-col items-stretch">
+        <Button onClick={() => navigate("/")}>{t("notFoundButton")}</Button>
+      </CardFooter>
+    </Card>
   );
 };