初始化 React TypeScript 模板并实现 Mantine 响应式基础布局

- 使用 Vite、React 和 TypeScript 初始化项目，配置 pnpm、Oxlint 与 Mantine PostCSS
- 接入 React Router Data Mode，将页面路由、菜单标题和图标统一维护在路由配置中
- 添加首页、关于概览与关于我页面，使用 Nested NavLinks 根据路由生成多级菜单
- 实现桌面侧栏展开和图标模式、移动端全宽抽屉以及与品牌区对齐的顶栏
- 将布局自定义样式拆分为 CSS Modules，统一 xs 间距并固定菜单图标列位置
- 添加文档流页脚，展示自动更新年份的示例版权说明
- 配置 Mantine 默认圆角、项目说明及中文提交约定

验证：pnpm build、pnpm lint、git diff --cached --check 均通过。

1 files changed, 19 insertions, 0 deletions

diff --git a/src/About.tsx b/src/About.tsx
new file mode 100644
index 0000000..21b4c1e
--- /dev/null
+++ b/src/About.tsx
@@ -0,0 +1,19 @@
+import { ActionIcon, Button, Group, Stack, Text, Title } from '@mantine/core'
+import { SlidersHorizontalIcon } from '@phosphor-icons/react'
+
+function About() {
+  return (
+    <Stack>
+      <Title order={1}>关于</Title>
+      <Text c="dimmed">A React + TypeScript starter built with Vite.</Text>
+      <Group gap="xs">
+        <Button variant="filled">Button</Button>
+        <ActionIcon variant="filled" aria-label="Settings">
+          <SlidersHorizontalIcon />
+        </ActionIcon>
+      </Group>
+    </Stack>
+  )
+}
+
+export default About