YourSelfHosted/memos
1
0
Fork 0
mirror of https://github.com/usememos/memos.git synced 2025-02-19 04:40:40 +01:00
Code Issues Packages Projects Releases Wiki Activity

chore: update not found page

Browse Source
This commit is contained in:
Steven 2023-09-23 20:39:01 +08:00
parent 0d803bf45f
commit 89c24415a6
2 changed files with 11 additions and 27 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

18
web/src/less/not-found.less
View File

@ -1,18 +0,0 @@
.page-wrapper.not-found {
@apply w-full h-full overflow-y-auto overflow-x-hidden bg-zinc-100 dark:bg-zinc-800;
> .page-container {
@apply relative w-full min-h-full mx-auto flex flex-col justify-center items-center;
> .title-text {
@apply text-xl sm:text-4xl text-gray-700 dark:text-gray-200;
}
> .action-button-container {
> .link-btn {
@apply block text-gray-600 dark:text-gray-200 dark:border-gray-600 font-mono text-base py-1 border px-3 leading-8 rounded-xl hover:opacity-80 my-3;
}
}
}
}

20
web/src/pages/NotFound.tsx
View File

@ -1,19 +1,21 @@
import { Button } from "@mui/joy";
import { Link } from "react-router-dom";
import Icon from "@/components/Icon";
import { useTranslate } from "@/utils/i18n";
import "@/less/not-found.less";
const NotFound = () => {
const t = useTranslate();
return (
<div className="page-wrapper not-found">
<div className="page-container">
<p className="title-text">{t("message.page-not-found")}</p>
<div className="action-button-container">
<Link to="/" className="link-btn">
<span>🏠</span> {t("router.back-to-home")}
</Link>
</div>
<div className="w-full h-full overflow-y-auto overflow-x-hidden bg-zinc-100 dark:bg-zinc-800">
<div className="w-full h-full flex flex-col justify-center items-center">
<Icon.Meh strokeWidth={1} className="w-20 h-auto opacity-80 dark:text-gray-300" />
<p className="mt-4 text-5xl font-mono dark:text-gray-300">404</p>
<Link className="mt-4" to="/">
<Button variant="outlined" startDecorator={<Icon.Home className="w-4 h-auto" />}>
{t("router.back-to-home")}
</Button>
</Link>
</div>
</div>
);