From c5f0bb32aaa98185be9016ddb3a0b9de4814778a Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E5=BE=90=E6=B6=9B?= <midnite@outlook.com>
Date: Wed, 25 Dec 2024 17:22:34 +0800
Subject: [PATCH] =?UTF-8?q?=E5=A2=9E=E5=8A=A0Scheme=E6=97=A0=E6=B3=95?=
 =?UTF-8?q?=E6=89=BE=E5=88=B0=E7=9A=84=E8=AD=A6=E5=91=8A=E9=A1=B5=E9=9D=A2?=
 =?UTF-8?q?=E3=80=82?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/App.tsx                         |  2 ++
 src/pages/SchemeNotFound.module.css |  6 ++++++
 src/pages/SchemeNotFound.tsx        | 11 +++++++++++
 3 files changed, 19 insertions(+)
 create mode 100644 src/pages/SchemeNotFound.module.css
 create mode 100644 src/pages/SchemeNotFound.tsx

diff --git a/src/App.tsx b/src/App.tsx
index f827b3e..03b54f3 100644
--- a/src/App.tsx
+++ b/src/App.tsx
@@ -4,6 +4,7 @@ import { Home } from './pages/Home';
 import { MainLayout } from './pages/MainLayout';
 import { NewScheme } from './pages/NewScheme';
 import { SchemeDetail } from './pages/SchemeDetail';
+import { SchemeNotFound } from './pages/SchemeNotFound';
 import { Schemes } from './pages/Schemes';
 
 const routes = createBrowserRouter([
@@ -17,6 +18,7 @@ const routes = createBrowserRouter([
         element: <Schemes />,
         children: [
           { path: 'new', element: <NewScheme /> },
+          { path: 'not-found', element: <SchemeNotFound /> },
           { path: ':id', element: <SchemeDetail /> },
         ],
       },
diff --git a/src/pages/SchemeNotFound.module.css b/src/pages/SchemeNotFound.module.css
new file mode 100644
index 0000000..a5e4be2
--- /dev/null
+++ b/src/pages/SchemeNotFound.module.css
@@ -0,0 +1,6 @@
+@layer pages {
+  .unexists {
+    font-size: var(--font-size-xl);
+    color: var(--color-danger);
+  }
+}
diff --git a/src/pages/SchemeNotFound.tsx b/src/pages/SchemeNotFound.tsx
new file mode 100644
index 0000000..c48720f
--- /dev/null
+++ b/src/pages/SchemeNotFound.tsx
@@ -0,0 +1,11 @@
+import styles from './SchemeNotFound.module.css';
+
+export function SchemeNotFound() {
+  return (
+    <div className="center">
+      <div className={styles.unexists}>
+        Request scheme is <strong>NOT</strong> exists.
+      </div>
+    </div>
+  );
+}