Merge pull request 'ci: use node 24 in build workflow' (#4) from develop into main

Reviewed-on: #4

.gitea/workflows/build.yml

@@ -0,0 +1,95 @@
+name: Build and Deploy
+
+on:
+  release:
+    types: [published]
+
+jobs:
+  build:
+    name: Build release archive
+    runs-on: ubuntu-latest
+
+    steps:
+      - name: Checkout code
+        uses: actions/checkout@v4
+
+      - name: Setup Node
+        uses: actions/setup-node@v4
+        with:
+          node-version: 24
+          cache: pnpm
+
+      - name: Setup pnpm
+        uses: pnpm/action-setup@v4
+        with:
+          version: 11
+
+      - name: Install dependencies
+        run: pnpm install --frozen-lockfile
+
+      - name: Build release archive
+        run: pnpm build:tar
+
+      - name: Upload build artifact
+        uses: actions/upload-artifact@v4
+        with:
+          name: dist-archive
+          path: dist.tar.gz
+          retention-days: 1
+
+  upload-release-asset:
+    name: Upload to Gitea Release
+    needs: build
+    runs-on: ubuntu-latest
+
+    steps:
+      - name: Download build artifact
+        uses: actions/download-artifact@v4
+        with:
+          name: dist-archive
+
+      - name: Upload release asset
+        uses: https://gitea.com/actions/forgejo-release@v1
+        with:
+          direction: upload
+          files: dist.tar.gz
+        env:
+          FORGEJO_TOKEN: ${{ secrets.GITEA_TOKEN }}
+
+  deploy-to-server:
+    name: Deploy to onixbyte.cn
+    needs: build
+    runs-on: ubuntu-latest
+
+    steps:
+      - name: Download build artifact
+        uses: actions/download-artifact@v4
+        with:
+          name: dist-archive
+
+      - name: Upload archive to server
+        uses: appleboy/scp-action@v0.1.7
+        with:
+          host: ${{ vars.DEPLOY_HOST }}
+          username: ${{ vars.DEPLOY_USER }}
+          port: ${{ vars.DEPLOY_PORT }}
+          key: ${{ secrets.DEPLOY_SSH_KEY }}
+          source: "dist.tar.gz"
+          target: "/tmp/"
+
+      - name: Extract archive and set ownership
+        uses: appleboy/ssh-action@v1.0.3
+        with:
+          host: ${{ vars.DEPLOY_HOST }}
+          username: ${{ vars.DEPLOY_USER }}
+          port: ${{ vars.DEPLOY_PORT }}
+          key: ${{ secrets.DEPLOY_SSH_KEY }}
+          script_stop: true
+          script: |
+            set -e
+            DEPLOY_PATH="${{ vars.DEPLOY_PATH }}"
+            mkdir -p "$DEPLOY_PATH"
+            rm -rf "$DEPLOY_PATH"/*
+            tar -xzf /tmp/dist.tar.gz -C "$DEPLOY_PATH" --strip-components=1
+            chown -R caddy:caddy "$DEPLOY_PATH"
+            rm -f /tmp/dist.tar.gz

.github/dependabot.yml

@@ -1,27 +0,0 @@
-# To get started with Dependabot version updates, you'll need to specify which
-# package ecosystems to update and where the package manifests are located.
-# Please see the documentation for all configuration options:
-# https://docs.github.com/code-security/dependabot/dependabot-version-updates/configuration-options-for-the-dependabot.yml-file
-
-version: 2
-updates:
-  - package-ecosystem: "npm"
-    directory: "/"
-    schedule:
-      interval: "weekly"
-    commit-message:
-      prefix: "chore: "
-
-    groups:
-      dependency-updates:
-        patterns: ["*"]
-        update-types: ["minor", "patch"]
-
-    ignore:
-      - dependency-name: "@types/node"
-        update-types: ["version-update:semver-major"]
-
-  - package-ecosystem: "github-actions"
-    directory: "/"
-    schedule:
-      interval: "daily"

.github/workflows/build.yml

@@ -1,30 +0,0 @@
-name: Upload Release Assets
-
-on:
-  release:
-    types: [created] # 仅当创建 Release 之后触发
-
-jobs:
-  build-and-upload:
-    runs-on: ubuntu-latest
-
-    # 必须授予权限以允许 Action 修改 Release
-    permissions:
-      contents: write
-
-    steps:
-      - name: Checkout code
-        uses: actions/checkout@v4
-
-      - name: Create archive
-        run: |
-          TAG_NAME=${{ github.event.release.tag_name }}
-          tar -czvf "website-dist-${TAG_NAME}.tar.gz" --exclude=".git*" --exclude=".github*" .
-
-      - name: Upload Release Asset
-        uses: softprops/action-gh-release@v2
-        with:
-          # 上传刚才生成的 tar.gz 文件
-          files: dist-${{ github.event.release.tag_name }}.tar.gz
-        env:
-          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}

.gitlab-ci.yml

@@ -0,0 +1,33 @@
+image: node:24.15-trixie-slim
+
+stages:
+  - build
+  - deploy
+
+build:
+  stage: build
+  rules:
+    - if: $CI_RELEASE_DESCRIPTION
+  script:
+    - corepack enable
+    - corepack prepare pnpm --activate
+    - pnpm install --frozen-lockfile
+    - pnpm build
+  artifacts:
+    paths:
+      - dist/
+    expire_in: 7 days
+
+deploy:
+  stage: deploy
+  rules:
+    - if: $CI_RELEASE_DESCRIPTION
+  needs:
+    - build
+  script:
+    - apt-get update -qq && apt-get install -y -qq openssh-client rsync
+    - mkdir -p ~/.ssh
+    - echo "$SSH_PRIVATE_KEY_BASE64" | base64 -d > ~/.ssh/id_rsa
+    - chmod 600 ~/.ssh/id_rsa
+    - ssh-keyscan -H "$DEPLOY_HOST" >> ~/.ssh/known_hosts
+    - rsync -avz --delete dist/ "${SSH_USER}@${DEPLOY_HOST}:${DEPLOY_PATH}"

.vscode/launch.json

@@ -1,7 +1,4 @@
 {
-    // Use IntelliSense to learn about possible attributes.
-    // Hover to view descriptions of existing attributes.
-    // For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
   "version": "0.2.0",
   "configurations": [
     {

CLAUDE.md

@@ -0,0 +1,56 @@
+# CLAUDE.md
+
+This file provides guidance to Claude Code (claude.ai/code) when working with code in this repository.
+
+## Commands
+
+```bash
+pnpm install          # Install dependencies (pnpm required)
+pnpm dev              # Start Vite dev server
+pnpm build            # TypeScript check + Vite production build
+pnpm build:tar        # Build + tar.gz archive (used by CI)
+pnpm preview          # Preview production build locally
+pnpm lint             # ESLint
+```
+
+No test suite exists in this project.
+
+## Architecture
+
+This is a Chinese-language SPA for browsing and managing Delta Force guide ("《三角洲》指南"). The frontend talks to a Spring Boot backend via REST APIs.
+
+**App shell** (`src/main.tsx`): React 19 + React Router 7 + Redux Toolkit + Ant Design 6 + Tailwind CSS 4. Wraps the router in Redux `Provider` → `PersistGate` (Redux Persist) → Ant Design `StyleProvider`/`ConfigProvider` (locale `zh_CN`).
+
+**Routing** (`src/router/index.tsx`): Two layout groups:
+- `HeroLayout` (nav header + footer) for `/`, `/firearms`, `/mod-codes`
+- `EmptyLayout` (minimal) for `/login`
+All page components are lazy-loaded via `createBrowserRouter` + `lazy()`.
+
+**State** (`src/store/`): Redux Toolkit with two slices — `auth` (current user) and `firearms` (paginated firearm list). State is persisted to `localStorage` or `sessionStorage` based on the `VITE_REDUX_STORAGE` env var. Use typed hooks from `src/hooks/store.ts` (`useAppDispatch`, `useAppSelector`).
+
+**API layer** (`src/api/`): Axios instance (`src/shared/web-client/`) with base URL from `VITE_API_BASE_URL`, 10s timeout, and credentials. API modules: `FirearmApi`, `ModificationApi`, `TagApi`, `AuthApi`.
+
+**Pages**:
+- `FirearmsPage` — paginated card grid with type filter, create/edit modals (admin-only), delete with popconfirm
+- `ModCodesPage` — paginated list with tag multi-select and firearmId query param filter, create/edit modals with nested accessory/tuning form lists
+- `LoginPage` — simple username/password form, dispatches `setCurrentUser` on success
+
+**Shared form components**: `FirearmForm` and `ModificationForm` are reused by both create and edit modals. `ModificationForm` fetches all firearms for its weapon selector and supports a `lockFirearmId` prop that disables the selector (used when navigating from a specific firearm).
+
+**Type system** (`src/types/`): `Firearm` with weapon stats, `Modification` with nested `Accessory[]` → `Tuning[]`, `Page<T>` for paginated API responses, `User` for auth.
+
+**Vite config**: Alias `@` → `./src`. Plugins: React, Tailwind CSS 4, port checker. Build uses rolldown with manual chunk splitting for React, Redux, Ant Design, React Router, and rc-* packages.
+
+**Styling**: Tailwind CSS 4 with CSS layers (`theme, base, antd, components, utilities`). Responsive grid for mod code cards (1→2→3→4 columns). Prettier: 100 print width, no semicolons, double quotes, trailing commas ES5.
+
+## Environment variables
+
+```
+VITE_API_BASE_URL=/api        # Backend API base URL
+VITE_REDUX_STORAGE=local      # "local" or "session" for Redux persistence
+```
+
+## Contributing conventions
+
+- User-facing copy, documentation, and code comments in British English
+- Commit messages use `chore:` prefix for dependency updates (per Dependabot config)

index.html

@@ -4,7 +4,7 @@
     <meta charset="UTF-8" />
     <link rel="icon" type="image/svg+xml" href="/onixbyte.svg" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-    <title>三角洲行动改枪码库</title>
+    <title>《三角洲》指南</title>
   </head>
   <body>
     <div id="root"></div>

package-lock.json

@@ -9,29 +9,33 @@
       "version": "0.0.0",
       "dependencies": {
         "@ant-design/cssinjs": "^2.1.2",
+        "@ant-design/icons": "^6.2.2",
         "@reduxjs/toolkit": "^2.11.2",
         "@tailwindcss/vite": "^4.2.4",
         "@tanstack/react-virtual": "^3.13.24",
         "antd": "^6.3.7",
-        "axios": "^1.15.2",
+        "axios": "^1.16.0",
         "dayjs": "^1.11.20",
-        "react": "^19.2.5",
+        "react": "^19.2.6",
-        "react-dom": "^19.2.5",
+        "react-dom": "^19.2.6",
         "react-redux": "^9.2.0",
-        "react-router": "^7.14.2",
+        "react-router": "^7.15.0",
-        "react-router-dom": "^7.14.2",
+        "react-router-dom": "^7.15.0",
         "redux-persist": "^6.0.0",
         "tailwindcss": "^4.2.4"
       },
       "devDependencies": {
+        "@tailwindcss/typography": "^0.5.19",
         "@types/node": "^22.19.17",
         "@types/react": "^19.2.14",
         "@types/react-dom": "^19.2.3",
         "@vitejs/plugin-react": "^6.0.1",
-        "globals": "^17.5.0",
+        "globals": "^17.6.0",
         "prettier": "^3.8.3",
         "typescript": "~6.0.3",
-        "vite": "^8.0.10"
+        "vite": "^8.0.11",
+        "vite-plugin-markdown": "^2.2.0",
+        "vite-plugin-port-checker": "^1.0.1"
       }
     },
     "node_modules/@ant-design/colors": {
@@ -243,9 +247,9 @@
       }
     },
     "node_modules/@oxc-project/types": {
-      "version": "0.127.0",
+      "version": "0.132.0",
-      "resolved": "https://registry.npmjs.org/@oxc-project/types/-/types-0.127.0.tgz",
+      "resolved": "https://registry.npmjs.org/@oxc-project/types/-/types-0.132.0.tgz",
-      "integrity": "sha512-aIYXQBo4lCbO4z0R3FHeucQHpF46l2LbMdxRvqvuRuW2OxdnSkcng5B8+K12spgLDj93rtN3+J2Vac/TIO+ciQ==",
+      "integrity": "sha512-FESMOxil5Se014ui/Eq8fT5uHJo6nIRwH0PfJrZJXs6Gek3ZVFOrpUv3YIZT20m+extU98Hg1Ym72U58rlsxUQ==",
       "license": "MIT",
       "funding": {
         "url": "https://github.com/sponsors/Boshen"
@@ -991,9 +995,9 @@
       }
     },
     "node_modules/@rolldown/binding-android-arm64": {
-      "version": "1.0.0-rc.17",
+      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/@rolldown/binding-android-arm64/-/binding-android-arm64-1.0.0-rc.17.tgz",
+      "resolved": "https://registry.npmjs.org/@rolldown/binding-android-arm64/-/binding-android-arm64-1.0.2.tgz",
-      "integrity": "sha512-s70pVGhw4zqGeFnXWvAzJDlvxhlRollagdCCKRgOsgUOH3N1l0LIxf83AtGzmb5SiVM4Hjl5HyarMRfdfj3DaQ==",
+      "integrity": "sha512-ZS4D1JPGn/MYQN/SYDWftIE/nVsM8j/AFOYEzAoOE2O3NktQOZru+/vYXGbR/qtdLdIfGCP0lcoJiYVzsEz+iQ==",
       "cpu": [
         "arm64"
       ],
@@ -1007,9 +1011,9 @@
       }
     },
     "node_modules/@rolldown/binding-darwin-arm64": {
-      "version": "1.0.0-rc.17",
+      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/@rolldown/binding-darwin-arm64/-/binding-darwin-arm64-1.0.0-rc.17.tgz",
+      "resolved": "https://registry.npmjs.org/@rolldown/binding-darwin-arm64/-/binding-darwin-arm64-1.0.2.tgz",
-      "integrity": "sha512-4ksWc9n0mhlZpZ9PMZgTGjeOPRu8MB1Z3Tz0Mo02eWfWCHMW1zN82Qz/pL/rC+yQa+8ZnutMF0JjJe7PjwasYw==",
+      "integrity": "sha512-vdFA9+C/rekyGce7WqHs/xoT0ioZEWaOFyZLIV1mEeNFaFDUQrPIo8Vs2GvJ6eetb3rzDUtUBgzto3ExpXJB3w==",
       "cpu": [
         "arm64"
       ],
@@ -1023,9 +1027,9 @@
       }
     },
     "node_modules/@rolldown/binding-darwin-x64": {
-      "version": "1.0.0-rc.17",
+      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/@rolldown/binding-darwin-x64/-/binding-darwin-x64-1.0.0-rc.17.tgz",
+      "resolved": "https://registry.npmjs.org/@rolldown/binding-darwin-x64/-/binding-darwin-x64-1.0.2.tgz",
-      "integrity": "sha512-SUSDOI6WwUVNcWxd02QEBjLdY1VPHvlEkw6T/8nYG322iYWCTxRb1vzk4E+mWWYehTp7ERibq54LSJGjmouOsw==",
+      "integrity": "sha512-BewSOwTHazv77DTYiAZXSqqKZ4KP/KonFisDMVU7PImxoWfB2aepnPhd2E4SWz3zDzYgDNbs6jBmTdgNnF02GA==",
       "cpu": [
         "x64"
       ],
@@ -1039,9 +1043,9 @@
       }
     },
     "node_modules/@rolldown/binding-freebsd-x64": {
-      "version": "1.0.0-rc.17",
+      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/@rolldown/binding-freebsd-x64/-/binding-freebsd-x64-1.0.0-rc.17.tgz",
+      "resolved": "https://registry.npmjs.org/@rolldown/binding-freebsd-x64/-/binding-freebsd-x64-1.0.2.tgz",
-      "integrity": "sha512-hwnz3nw9dbJ05EDO/PvcjaaewqqDy7Y1rn1UO81l8iIK1GjenME75dl16ajbvSSMfv66WXSRCYKIqfgq2KCfxw==",
+      "integrity": "sha512-m41o7M0YWtUdqk61Tb+jnKb2rN++iRdIASlExkUoKfIAH30DOHCB8fVLzSUpbWHHU8esmEioY62PxzexE8MBuA==",
       "cpu": [
         "x64"
       ],
@@ -1055,9 +1059,9 @@
       }
     },
     "node_modules/@rolldown/binding-linux-arm-gnueabihf": {
-      "version": "1.0.0-rc.17",
+      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/@rolldown/binding-linux-arm-gnueabihf/-/binding-linux-arm-gnueabihf-1.0.0-rc.17.tgz",
+      "resolved": "https://registry.npmjs.org/@rolldown/binding-linux-arm-gnueabihf/-/binding-linux-arm-gnueabihf-1.0.2.tgz",
-      "integrity": "sha512-IS+W7epTcwANmFSQFrS1SivEXHtl1JtuQA9wlxrZTcNi6mx+FDOYrakGevvvTwgj2JvWiK8B29/qD9BELZPyXQ==",
+      "integrity": "sha512-jcojB9H7W/jS29pMKWAK1N+fU99vXodHDTatS3b3y/XSOCiHo0kkA74pL3jJmkoQtYpOCxDvaKs1fo2Ij/1X5w==",
       "cpu": [
         "arm"
       ],
@@ -1071,9 +1075,9 @@
       }
     },
     "node_modules/@rolldown/binding-linux-arm64-gnu": {
-      "version": "1.0.0-rc.17",
+      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/@rolldown/binding-linux-arm64-gnu/-/binding-linux-arm64-gnu-1.0.0-rc.17.tgz",
+      "resolved": "https://registry.npmjs.org/@rolldown/binding-linux-arm64-gnu/-/binding-linux-arm64-gnu-1.0.2.tgz",
-      "integrity": "sha512-e6usGaHKW5BMNZOymS1UcEYGowQMWcgZ71Z17Sl/h2+ZziNJ1a9n3Zvcz6LdRyIW5572wBCTH/Z+bKuZouGk9Q==",
+      "integrity": "sha512-1jn6qDU5iiOgFgygDzKUuKP0maTi0/f1+sBLgvij/76C77Nm3ts6ufz9Bjg5q5dduxiUIxtq86JIoBvo1xQ4Ig==",
       "cpu": [
         "arm64"
       ],
@@ -1087,9 +1091,9 @@
       }
     },
     "node_modules/@rolldown/binding-linux-arm64-musl": {
-      "version": "1.0.0-rc.17",
+      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/@rolldown/binding-linux-arm64-musl/-/binding-linux-arm64-musl-1.0.0-rc.17.tgz",
+      "resolved": "https://registry.npmjs.org/@rolldown/binding-linux-arm64-musl/-/binding-linux-arm64-musl-1.0.2.tgz",
-      "integrity": "sha512-b/CgbwAJpmrRLp02RPfhbudf5tZnN9nsPWK82znefso832etkem8H7FSZwxrOI9djcdTP7U6YfNhbRnh7djErg==",
+      "integrity": "sha512-QVLO/czFMdoMFSqlX3bcswcJNm/23r+qoa/jgtmFc/qEp6/jXmIkDjF/XIo8dPfGaiwy1xfQn8o77L79GeXFgw==",
       "cpu": [
         "arm64"
       ],
@@ -1103,9 +1107,9 @@
       }
     },
     "node_modules/@rolldown/binding-linux-ppc64-gnu": {
-      "version": "1.0.0-rc.17",
+      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/@rolldown/binding-linux-ppc64-gnu/-/binding-linux-ppc64-gnu-1.0.0-rc.17.tgz",
+      "resolved": "https://registry.npmjs.org/@rolldown/binding-linux-ppc64-gnu/-/binding-linux-ppc64-gnu-1.0.2.tgz",
-      "integrity": "sha512-4EII1iNGRUN5WwGbF/kOh/EIkoDN9HsupgLQoXfY+D1oyJm7/F4t5PYU5n8SWZgG0FEwakyM8pGgwcBYruGTlA==",
+      "integrity": "sha512-hgO5Abm0w5UL6FEa2iFnZqo2KlK7TQ5QhV5x09hujBf7t5KzHQ1VmfPuTpqRy/rNlSxua3eWH374xxiVrP+lcA==",
       "cpu": [
         "ppc64"
       ],
@@ -1119,9 +1123,9 @@
       }
     },
     "node_modules/@rolldown/binding-linux-s390x-gnu": {
-      "version": "1.0.0-rc.17",
+      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/@rolldown/binding-linux-s390x-gnu/-/binding-linux-s390x-gnu-1.0.0-rc.17.tgz",
+      "resolved": "https://registry.npmjs.org/@rolldown/binding-linux-s390x-gnu/-/binding-linux-s390x-gnu-1.0.2.tgz",
-      "integrity": "sha512-AH8oq3XqQo4IibpVXvPeLDI5pzkpYn0WiZAfT05kFzoJ6tQNzwRdDYQ45M8I/gslbodRZwW8uxLhbSBbkv96rA==",
+      "integrity": "sha512-fy8rXxuYEu602abC8MUNaPjYLIFzReOaEIEMKMUa0rFEUxNpVXhs15KSSQ4qlqSaM7B6rcj9rDZgADh/IGDzLQ==",
       "cpu": [
         "s390x"
       ],
@@ -1135,9 +1139,9 @@
       }
     },
     "node_modules/@rolldown/binding-linux-x64-gnu": {
-      "version": "1.0.0-rc.17",
+      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/@rolldown/binding-linux-x64-gnu/-/binding-linux-x64-gnu-1.0.0-rc.17.tgz",
+      "resolved": "https://registry.npmjs.org/@rolldown/binding-linux-x64-gnu/-/binding-linux-x64-gnu-1.0.2.tgz",
-      "integrity": "sha512-cLnjV3xfo7KslbU41Z7z8BH/E1y5mzUYzAqih1d1MDaIGZRCMqTijqLv76/P7fyHuvUcfGsIpqCdddbxLLK9rA==",
+      "integrity": "sha512-0+bOkiQ779+r1WpoHOWHqncvyySci0vKph+myNDYb+im6meJAzHQXay6oEgnkHuUGouM1LKTZwqKpBow6Kj7CQ==",
       "cpu": [
         "x64"
       ],
@@ -1151,9 +1155,9 @@
       }
     },
     "node_modules/@rolldown/binding-linux-x64-musl": {
-      "version": "1.0.0-rc.17",
+      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/@rolldown/binding-linux-x64-musl/-/binding-linux-x64-musl-1.0.0-rc.17.tgz",
+      "resolved": "https://registry.npmjs.org/@rolldown/binding-linux-x64-musl/-/binding-linux-x64-musl-1.0.2.tgz",
-      "integrity": "sha512-0phclDw1spsL7dUB37sIARuis2tAgomCJXAHZlpt8PXZ4Ba0dRP1e+66lsRqrfhISeN9bEGNjQs+T/Fbd7oYGw==",
+      "integrity": "sha512-mjSkrzZK5Qsl0a9d1JgILOiuZOSDTVdKENcSXBoqbzSrspLR/4/IRVDo5wd2GgZjNss/viBFJdeq+j7qH2nypw==",
       "cpu": [
         "x64"
       ],
@@ -1167,9 +1171,9 @@
       }
     },
     "node_modules/@rolldown/binding-openharmony-arm64": {
-      "version": "1.0.0-rc.17",
+      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/@rolldown/binding-openharmony-arm64/-/binding-openharmony-arm64-1.0.0-rc.17.tgz",
+      "resolved": "https://registry.npmjs.org/@rolldown/binding-openharmony-arm64/-/binding-openharmony-arm64-1.0.2.tgz",
-      "integrity": "sha512-0ag/hEgXOwgw4t8QyQvUCxvEg+V0KBcA6YuOx9g0r02MprutRF5dyljgm3EmR02O292UX7UeS6HzWHAl6KgyhA==",
+      "integrity": "sha512-1v5vHasdfQAZoEHakBV72LIFAC9JjnymsiKxp+GEr/ma3+NJCPSaYK+qavInOovJkgwFrs7GccX2d6IgDA3Z5w==",
       "cpu": [
         "arm64"
       ],
@@ -1183,9 +1187,9 @@
       }
     },
     "node_modules/@rolldown/binding-wasm32-wasi": {
-      "version": "1.0.0-rc.17",
+      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/@rolldown/binding-wasm32-wasi/-/binding-wasm32-wasi-1.0.0-rc.17.tgz",
+      "resolved": "https://registry.npmjs.org/@rolldown/binding-wasm32-wasi/-/binding-wasm32-wasi-1.0.2.tgz",
-      "integrity": "sha512-LEXei6vo0E5wTGwpkJ4KoT3OZJRnglwldt5ziLzOlc6qqb55z4tWNq2A+PFqCJuvWWdP53CVhG1Z9NtToDPJrA==",
+      "integrity": "sha512-mb1VobWn6NheziTk5/WEaR6AKVbrwT5sOi6C7zk3gy/pD1qtJfU1j4PgTo2NJnOtbL9Dl3Aeei8w9jJ7qC2jZQ==",
       "cpu": [
         "wasm32"
       ],
@@ -1201,9 +1205,9 @@
       }
     },
     "node_modules/@rolldown/binding-win32-arm64-msvc": {
-      "version": "1.0.0-rc.17",
+      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/@rolldown/binding-win32-arm64-msvc/-/binding-win32-arm64-msvc-1.0.0-rc.17.tgz",
+      "resolved": "https://registry.npmjs.org/@rolldown/binding-win32-arm64-msvc/-/binding-win32-arm64-msvc-1.0.2.tgz",
-      "integrity": "sha512-gUmyzBl3SPMa6hrqFUth9sVfcLBlYsbMzBx5PlexMroZStgzGqlZ26pYG89rBb45Mnia+oil6YAIFeEWGWhoZA==",
+      "integrity": "sha512-SqKonF56vA/L2yHwHYcEp2P34URpOZ7d1fS635cTkpDnUtEGdUbhI6NzsPdqeSWvAAeGDrxjWjNmibDIdFf9/A==",
       "cpu": [
         "arm64"
       ],
@@ -1217,9 +1221,9 @@
       }
     },
     "node_modules/@rolldown/binding-win32-x64-msvc": {
-      "version": "1.0.0-rc.17",
+      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/@rolldown/binding-win32-x64-msvc/-/binding-win32-x64-msvc-1.0.0-rc.17.tgz",
+      "resolved": "https://registry.npmjs.org/@rolldown/binding-win32-x64-msvc/-/binding-win32-x64-msvc-1.0.2.tgz",
-      "integrity": "sha512-3hkiolcUAvPB9FLb3UZdfjVVNWherN1f/skkGWJP/fgSQhYUZpSIRr0/I8ZK9TkF3F7kxvJAk0+IcKvPHk9qQg==",
+      "integrity": "sha512-v7qRI7gXLRINcOGXt+7YmAZ6iFuyZVMIoXAxhd8oP+DR9dLfL9GfNIx7PLMxmhZdvq8waUJBQiWN9EKNy+TRBQ==",
       "cpu": [
         "x64"
       ],
@@ -1494,6 +1498,19 @@
         "node": ">= 20"
       }
     },
+    "node_modules/@tailwindcss/typography": {
+      "version": "0.5.19",
+      "resolved": "https://registry.npmjs.org/@tailwindcss/typography/-/typography-0.5.19.tgz",
+      "integrity": "sha512-w31dd8HOx3k9vPtcQh5QHP9GwKcgbMp87j58qi6xgiBnFFtKEAgCWnDw4qUT8aHwkCp8bKvb/KGKWWHedP0AAg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "postcss-selector-parser": "6.0.10"
+      },
+      "peerDependencies": {
+        "tailwindcss": ">=3.0.0 || insiders || >=4.0.0-alpha.20 || >=4.0.0-beta.1"
+      }
+    },
     "node_modules/@tailwindcss/vite": {
       "version": "4.2.4",
       "resolved": "https://registry.npmjs.org/@tailwindcss/vite/-/vite-4.2.4.tgz",
@@ -1671,6 +1688,16 @@
         "react-dom": ">=18.0.0"
       }
     },
+    "node_modules/argparse": {
+      "version": "1.0.10",
+      "resolved": "https://registry.npmjs.org/argparse/-/argparse-1.0.10.tgz",
+      "integrity": "sha512-o5Roy6tNG4SL/FOkCAN6RzjiakZS25RLYFrcMttJqbdd8BWrnA+fGz57iN5Pb06pvBGvl5gQ0B48dJlslXvoTg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "sprintf-js": "~1.0.2"
+      }
+    },
     "node_modules/asynckit": {
       "version": "0.4.0",
       "resolved": "https://registry.npmjs.org/asynckit/-/asynckit-0.4.0.tgz",
@@ -1741,6 +1768,19 @@
         "url": "https://opencollective.com/express"
       }
     },
+    "node_modules/cssesc": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/cssesc/-/cssesc-3.0.0.tgz",
+      "integrity": "sha512-/Tb/JcjK111nNScGob5MNtsntNM1aCNUDipB/TkwZFhyDrrE47SOx/18wF2bbjgc3ZzCSKW1T5nt5EbFoAz/Vg==",
+      "dev": true,
+      "license": "MIT",
+      "bin": {
+        "cssesc": "bin/cssesc"
+      },
+      "engines": {
+        "node": ">=4"
+      }
+    },
     "node_modules/csstype": {
       "version": "3.2.3",
       "resolved": "https://registry.npmjs.org/csstype/-/csstype-3.2.3.tgz",
@@ -1771,6 +1811,65 @@
         "node": ">=8"
       }
     },
+    "node_modules/dom-serializer": {
+      "version": "1.4.1",
+      "resolved": "https://registry.npmjs.org/dom-serializer/-/dom-serializer-1.4.1.tgz",
+      "integrity": "sha512-VHwB3KfrcOOkelEG2ZOfxqLZdfkil8PtJi4P8N2MMXucZq2yLp75ClViUlOVwyoHEDjYU433Aq+5zWP61+RGag==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "domelementtype": "^2.0.1",
+        "domhandler": "^4.2.0",
+        "entities": "^2.0.0"
+      },
+      "funding": {
+        "url": "https://github.com/cheeriojs/dom-serializer?sponsor=1"
+      }
+    },
+    "node_modules/domelementtype": {
+      "version": "2.3.0",
+      "resolved": "https://registry.npmjs.org/domelementtype/-/domelementtype-2.3.0.tgz",
+      "integrity": "sha512-OLETBj6w0OsagBwdXnPdN0cnMfF9opN69co+7ZrbfPGrdpPVNBUj02spi6B1N7wChLQiPn4CSH/zJvXw56gmHw==",
+      "dev": true,
+      "funding": [
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/fb55"
+        }
+      ],
+      "license": "BSD-2-Clause"
+    },
+    "node_modules/domhandler": {
+      "version": "4.3.1",
+      "resolved": "https://registry.npmjs.org/domhandler/-/domhandler-4.3.1.tgz",
+      "integrity": "sha512-GrwoxYN+uWlzO8uhUXRl0P+kHE4GtVPfYzVLcUxPL7KNdHKj66vvlhiweIHqYYXWlw+T8iLMp42Lm67ghw4WMQ==",
+      "dev": true,
+      "license": "BSD-2-Clause",
+      "dependencies": {
+        "domelementtype": "^2.2.0"
+      },
+      "engines": {
+        "node": ">= 4"
+      },
+      "funding": {
+        "url": "https://github.com/fb55/domhandler?sponsor=1"
+      }
+    },
+    "node_modules/domutils": {
+      "version": "2.8.0",
+      "resolved": "https://registry.npmjs.org/domutils/-/domutils-2.8.0.tgz",
+      "integrity": "sha512-w96Cjofp72M5IIhpjgobBimYEfoPjx1Vx0BSX9P30WBdZW2WIKU0T1Bd0kz2eNZ9ikjKgHbEyKx8BB6H1L3h3A==",
+      "dev": true,
+      "license": "BSD-2-Clause",
+      "dependencies": {
+        "dom-serializer": "^1.0.1",
+        "domelementtype": "^2.2.0",
+        "domhandler": "^4.2.0"
+      },
+      "funding": {
+        "url": "https://github.com/fb55/domutils?sponsor=1"
+      }
+    },
     "node_modules/dunder-proto": {
       "version": "1.0.1",
       "resolved": "https://registry.npmjs.org/dunder-proto/-/dunder-proto-1.0.1.tgz",
@@ -1798,6 +1897,16 @@
         "node": ">=10.13.0"
       }
     },
+    "node_modules/entities": {
+      "version": "2.2.0",
+      "resolved": "https://registry.npmjs.org/entities/-/entities-2.2.0.tgz",
+      "integrity": "sha512-p92if5Nz619I0w+akJrLZH0MX0Pb5DX39XOwQTtXSdQQOaYH03S1uIQp4mhOZtAXrxq4ViO67YTiLBo2638o9A==",
+      "dev": true,
+      "license": "BSD-2-Clause",
+      "funding": {
+        "url": "https://github.com/fb55/entities?sponsor=1"
+      }
+    },
     "node_modules/es-define-property": {
       "version": "1.0.1",
       "resolved": "https://registry.npmjs.org/es-define-property/-/es-define-property-1.0.1.tgz",
@@ -1843,6 +1952,20 @@
         "node": ">= 0.4"
       }
     },
+    "node_modules/esprima": {
+      "version": "4.0.1",
+      "resolved": "https://registry.npmjs.org/esprima/-/esprima-4.0.1.tgz",
+      "integrity": "sha512-eGuFFw7Upda+g4p+QHvnW0RyTX/SVeJBDM/gCtMARO0cLuT2HcEKnTPvhjV6aGeqrCB/sbNop0Kszm0jsaWU4A==",
+      "dev": true,
+      "license": "BSD-2-Clause",
+      "bin": {
+        "esparse": "bin/esparse.js",
+        "esvalidate": "bin/esvalidate.js"
+      },
+      "engines": {
+        "node": ">=4"
+      }
+    },
     "node_modules/fdir": {
       "version": "6.5.0",
       "resolved": "https://registry.npmjs.org/fdir/-/fdir-6.5.0.tgz",
@@ -1896,6 +2019,16 @@
         "node": ">= 6"
       }
     },
+    "node_modules/front-matter": {
+      "version": "4.0.2",
+      "resolved": "https://registry.npmjs.org/front-matter/-/front-matter-4.0.2.tgz",
+      "integrity": "sha512-I8ZuJ/qG92NWX8i5x1Y8qyj3vizhXS31OxjKDu3LKP+7/qBgfIKValiZIEwoVoJKUHlhWtYrktkxV1XsX+pPlg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "js-yaml": "^3.13.1"
+      }
+    },
     "node_modules/fsevents": {
       "version": "2.3.3",
       "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-2.3.3.tgz",
@@ -2026,6 +2159,26 @@
         "node": ">= 0.4"
       }
     },
+    "node_modules/htmlparser2": {
+      "version": "6.1.0",
+      "resolved": "https://registry.npmjs.org/htmlparser2/-/htmlparser2-6.1.0.tgz",
+      "integrity": "sha512-gyyPk6rgonLFEDGoeRgQNaEUvdJ4ktTmmUh/h2t7s+M8oPpIPxgNACWa+6ESR57kXstwqPiCut0V8NRpcwgU7A==",
+      "dev": true,
+      "funding": [
+        "https://github.com/fb55/htmlparser2?sponsor=1",
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/fb55"
+        }
+      ],
+      "license": "MIT",
+      "dependencies": {
+        "domelementtype": "^2.0.1",
+        "domhandler": "^4.0.0",
+        "domutils": "^2.5.2",
+        "entities": "^2.0.0"
+      }
+    },
     "node_modules/immer": {
       "version": "11.1.6",
       "resolved": "https://registry.npmjs.org/immer/-/immer-11.1.6.tgz",
@@ -2051,6 +2204,20 @@
         "jiti": "lib/jiti-cli.mjs"
       }
     },
+    "node_modules/js-yaml": {
+      "version": "3.14.2",
+      "resolved": "https://registry.npmjs.org/js-yaml/-/js-yaml-3.14.2.tgz",
+      "integrity": "sha512-PMSmkqxr106Xa156c2M265Z+FTrPl+oxd/rgOQy2tijQeK5TxQ43psO1ZCwhVOSdnn+RzkzlRz/eY4BgJBYVpg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "argparse": "^1.0.7",
+        "esprima": "^4.0.0"
+      },
+      "bin": {
+        "js-yaml": "bin/js-yaml.js"
+      }
+    },
     "node_modules/json2mq": {
       "version": "0.2.0",
       "resolved": "https://registry.npmjs.org/json2mq/-/json2mq-0.2.0.tgz",
@@ -2309,6 +2476,16 @@
         "url": "https://opencollective.com/parcel"
       }
     },
+    "node_modules/linkify-it": {
+      "version": "3.0.3",
+      "resolved": "https://registry.npmjs.org/linkify-it/-/linkify-it-3.0.3.tgz",
+      "integrity": "sha512-ynTsyrFSdE5oZ/O9GEf00kPngmOfVwazR5GKDq6EYfhlpFug3J2zybX56a2PRRpc9P+FuSoGNAwjlbDs9jJBPQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "uc.micro": "^1.0.1"
+      }
+    },
     "node_modules/magic-string": {
       "version": "0.30.21",
       "resolved": "https://registry.npmjs.org/magic-string/-/magic-string-0.30.21.tgz",
@@ -2318,6 +2495,40 @@
         "@jridgewell/sourcemap-codec": "^1.5.5"
       }
     },
+    "node_modules/markdown-it": {
+      "version": "12.3.2",
+      "resolved": "https://registry.npmjs.org/markdown-it/-/markdown-it-12.3.2.tgz",
+      "integrity": "sha512-TchMembfxfNVpHkbtriWltGWc+m3xszaRD0CZup7GFFhzIgQqxIfn3eGj1yZpfuflzPvfkt611B2Q/Bsk1YnGg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "argparse": "^2.0.1",
+        "entities": "~2.1.0",
+        "linkify-it": "^3.0.1",
+        "mdurl": "^1.0.1",
+        "uc.micro": "^1.0.5"
+      },
+      "bin": {
+        "markdown-it": "bin/markdown-it.js"
+      }
+    },
+    "node_modules/markdown-it/node_modules/argparse": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/argparse/-/argparse-2.0.1.tgz",
+      "integrity": "sha512-8+9WqebbFzpX9OR+Wa6O29asIogeRMzcGtAINdpMHHyAg10f05aSFVBbcEqGf/PXw1EjAZ+q2/bEBg3DvurK3Q==",
+      "dev": true,
+      "license": "Python-2.0"
+    },
+    "node_modules/markdown-it/node_modules/entities": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/entities/-/entities-2.1.0.tgz",
+      "integrity": "sha512-hCx1oky9PFrJ611mf0ifBLBRW8lUUVRlFolb5gWRfIELabBlbp9xZvrqZLZAs+NxFnbfQoeGd8wDkygjg7U85w==",
+      "dev": true,
+      "license": "BSD-2-Clause",
+      "funding": {
+        "url": "https://github.com/fb55/entities?sponsor=1"
+      }
+    },
     "node_modules/math-intrinsics": {
       "version": "1.1.0",
       "resolved": "https://registry.npmjs.org/math-intrinsics/-/math-intrinsics-1.1.0.tgz",
@@ -2327,6 +2538,13 @@
         "node": ">= 0.4"
       }
     },
+    "node_modules/mdurl": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/mdurl/-/mdurl-1.0.1.tgz",
+      "integrity": "sha512-/sKlQJCBYVY9Ers9hqzKou4H6V5UWc/M59TH2dvkt+84itfnq7uFOMLpOiOS4ujvHP4etln18fmIxA5R5fll0g==",
+      "dev": true,
+      "license": "MIT"
+    },
     "node_modules/mime-db": {
       "version": "1.52.0",
       "resolved": "https://registry.npmjs.org/mime-db/-/mime-db-1.52.0.tgz",
@@ -2385,9 +2603,9 @@
       }
     },
     "node_modules/postcss": {
-      "version": "8.5.14",
+      "version": "8.5.15",
-      "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.5.14.tgz",
+      "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.5.15.tgz",
-      "integrity": "sha512-SoSL4+OSEtR99LHFZQiJLkT59C5B1amGO1NzTwj7TT1qCUgUO6hxOvzkOYxD+vMrXBM3XJIKzokoERdqQq/Zmg==",
+      "integrity": "sha512-FfR8sjd4em2T6fb3I2MwAJU7HWVMr9zba+enmQeeWFfCbm+UOC/0X4DS8XtpUTMwWMGbjKYP7xjfNekzyGmB3A==",
       "funding": [
         {
           "type": "opencollective",
@@ -2404,7 +2622,7 @@
       ],
       "license": "MIT",
       "dependencies": {
-        "nanoid": "^3.3.11",
+        "nanoid": "^3.3.12",
         "picocolors": "^1.1.1",
         "source-map-js": "^1.2.1"
       },
@@ -2412,6 +2630,20 @@
         "node": "^10 || ^12 || >=14"
       }
     },
+    "node_modules/postcss-selector-parser": {
+      "version": "6.0.10",
+      "resolved": "https://registry.npmjs.org/postcss-selector-parser/-/postcss-selector-parser-6.0.10.tgz",
+      "integrity": "sha512-IQ7TZdoaqbT+LCpShg46jnZVlhWD2w6iQYAcYXfHARZ7X1t/UGhhceQDs5X0cGqKvYlHNOuv7Oa1xmb0oQuA3w==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "cssesc": "^3.0.0",
+        "util-deprecate": "^1.0.2"
+      },
+      "engines": {
+        "node": ">=4"
+      }
+    },
     "node_modules/prettier": {
       "version": "3.8.3",
       "resolved": "https://registry.npmjs.org/prettier/-/prettier-3.8.3.tgz",
@@ -2438,24 +2670,24 @@
       }
     },
     "node_modules/react": {
-      "version": "19.2.5",
+      "version": "19.2.6",
-      "resolved": "https://registry.npmjs.org/react/-/react-19.2.5.tgz",
+      "resolved": "https://registry.npmjs.org/react/-/react-19.2.6.tgz",
-      "integrity": "sha512-llUJLzz1zTUBrskt2pwZgLq59AemifIftw4aB7JxOqf1HY2FDaGDxgwpAPVzHU1kdWabH7FauP4i1oEeer2WCA==",
+      "integrity": "sha512-sfWGGfavi0xr8Pg0sVsyHMAOziVYKgPLNrS7ig+ivMNb3wbCBw3KxtflsGBAwD3gYQlE/AEZsTLgToRrSCjb0Q==",
       "license": "MIT",
       "engines": {
         "node": ">=0.10.0"
       }
     },
     "node_modules/react-dom": {
-      "version": "19.2.5",
+      "version": "19.2.6",
-      "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-19.2.5.tgz",
+      "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-19.2.6.tgz",
-      "integrity": "sha512-J5bAZz+DXMMwW/wV3xzKke59Af6CHY7G4uYLN1OvBcKEsWOs4pQExj86BBKamxl/Ik5bx9whOrvBlSDfWzgSag==",
+      "integrity": "sha512-0prMI+hvBbPjsWnxDLxlCGyM8PN6UuWjEUCYmZhO67xIV9Xasa/r/vDnq+Xyq4Lo27g8QSbO5YzARu0D1Sps3g==",
       "license": "MIT",
       "dependencies": {
         "scheduler": "^0.27.0"
       },
       "peerDependencies": {
-        "react": "^19.2.5"
+        "react": "^19.2.6"
       }
     },
     "node_modules/react-is": {
@@ -2556,13 +2788,13 @@
       "license": "MIT"
     },
     "node_modules/rolldown": {
-      "version": "1.0.0-rc.17",
+      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/rolldown/-/rolldown-1.0.0-rc.17.tgz",
+      "resolved": "https://registry.npmjs.org/rolldown/-/rolldown-1.0.2.tgz",
-      "integrity": "sha512-ZrT53oAKrtA4+YtBWPQbtPOxIbVDbxT0orcYERKd63VJTF13zPcgXTvD4843L8pcsI7M6MErt8QtON6lrB9tyA==",
+      "integrity": "sha512-oZx5zVDtVB44AW3eaifgDml1gWRDZGvjcfdxonE4swNPG98PrrXjaO/KrnUjzlMnztCCRVlUueA1kCXhARGk6g==",
       "license": "MIT",
       "dependencies": {
-        "@oxc-project/types": "=0.127.0",
+        "@oxc-project/types": "=0.132.0",
-        "@rolldown/pluginutils": "1.0.0-rc.17"
+        "@rolldown/pluginutils": "^1.0.0"
       },
       "bin": {
         "rolldown": "bin/cli.mjs"
@@ -2571,27 +2803,27 @@
         "node": "^20.19.0 || >=22.12.0"
       },
       "optionalDependencies": {
-        "@rolldown/binding-android-arm64": "1.0.0-rc.17",
+        "@rolldown/binding-android-arm64": "1.0.2",
-        "@rolldown/binding-darwin-arm64": "1.0.0-rc.17",
+        "@rolldown/binding-darwin-arm64": "1.0.2",
-        "@rolldown/binding-darwin-x64": "1.0.0-rc.17",
+        "@rolldown/binding-darwin-x64": "1.0.2",
-        "@rolldown/binding-freebsd-x64": "1.0.0-rc.17",
+        "@rolldown/binding-freebsd-x64": "1.0.2",
-        "@rolldown/binding-linux-arm-gnueabihf": "1.0.0-rc.17",
+        "@rolldown/binding-linux-arm-gnueabihf": "1.0.2",
-        "@rolldown/binding-linux-arm64-gnu": "1.0.0-rc.17",
+        "@rolldown/binding-linux-arm64-gnu": "1.0.2",
-        "@rolldown/binding-linux-arm64-musl": "1.0.0-rc.17",
+        "@rolldown/binding-linux-arm64-musl": "1.0.2",
-        "@rolldown/binding-linux-ppc64-gnu": "1.0.0-rc.17",
+        "@rolldown/binding-linux-ppc64-gnu": "1.0.2",
-        "@rolldown/binding-linux-s390x-gnu": "1.0.0-rc.17",
+        "@rolldown/binding-linux-s390x-gnu": "1.0.2",
-        "@rolldown/binding-linux-x64-gnu": "1.0.0-rc.17",
+        "@rolldown/binding-linux-x64-gnu": "1.0.2",
-        "@rolldown/binding-linux-x64-musl": "1.0.0-rc.17",
+        "@rolldown/binding-linux-x64-musl": "1.0.2",
-        "@rolldown/binding-openharmony-arm64": "1.0.0-rc.17",
+        "@rolldown/binding-openharmony-arm64": "1.0.2",
-        "@rolldown/binding-wasm32-wasi": "1.0.0-rc.17",
+        "@rolldown/binding-wasm32-wasi": "1.0.2",
-        "@rolldown/binding-win32-arm64-msvc": "1.0.0-rc.17",
+        "@rolldown/binding-win32-arm64-msvc": "1.0.2",
-        "@rolldown/binding-win32-x64-msvc": "1.0.0-rc.17"
+        "@rolldown/binding-win32-x64-msvc": "1.0.2"
       }
     },
     "node_modules/rolldown/node_modules/@rolldown/pluginutils": {
-      "version": "1.0.0-rc.17",
+      "version": "1.0.1",
-      "resolved": "https://registry.npmjs.org/@rolldown/pluginutils/-/pluginutils-1.0.0-rc.17.tgz",
+      "resolved": "https://registry.npmjs.org/@rolldown/pluginutils/-/pluginutils-1.0.1.tgz",
-      "integrity": "sha512-n8iosDOt6Ig1UhJ2AYqoIhHWh/isz0xpicHTzpKBeotdVsTEcxsSA/i3EVM7gQAj0rU27OLAxCjzlj15IWY7bg==",
+      "integrity": "sha512-2j9bGt5Jh8hj+vPtgzPtl72j0yRxHAyumoo6TNfAjsLB04UtpSvPbPcDcBMxz7n+9CYB0c1GxQFxYRg2jimqGw==",
       "license": "MIT"
     },
     "node_modules/scheduler": {
@@ -2624,6 +2856,13 @@
         "node": ">=0.10.0"
       }
     },
+    "node_modules/sprintf-js": {
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/sprintf-js/-/sprintf-js-1.0.3.tgz",
+      "integrity": "sha512-D9cPgkvLlV3t3IzL0D0YLvGA9Ahk4PcvVwUbN0dSGr1aP0Nrt4AEnTUbuGvquEC0mA64Gqt1fzirlRs5ibXx8g==",
+      "dev": true,
+      "license": "BSD-3-Clause"
+    },
     "node_modules/string-convert": {
       "version": "0.2.1",
       "resolved": "https://registry.npmjs.org/string-convert/-/string-convert-0.2.1.tgz",
@@ -2701,6 +2940,13 @@
         "node": ">=14.17"
       }
     },
+    "node_modules/uc.micro": {
+      "version": "1.0.6",
+      "resolved": "https://registry.npmjs.org/uc.micro/-/uc.micro-1.0.6.tgz",
+      "integrity": "sha512-8Y75pvTYkLJW2hWQHXxoqRgV7qb9B+9vFEtidML+7koHUFapnVJAZ6cKs+Qjz5Aw3aZWHMC6u0wJE3At+nSGwA==",
+      "dev": true,
+      "license": "MIT"
+    },
     "node_modules/undici-types": {
       "version": "6.21.0",
       "resolved": "https://registry.npmjs.org/undici-types/-/undici-types-6.21.0.tgz",
@@ -2717,16 +2963,23 @@
         "react": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0"
       }
     },
+    "node_modules/util-deprecate": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/util-deprecate/-/util-deprecate-1.0.2.tgz",
+      "integrity": "sha512-EPD5q1uXyFxJpCrLnCc1nHnq3gOa6DZBocAIiI2TaSCA7VCJ1UJDMagCzIkXNsUYfD1daK//LTEQ8xiIbrHtcw==",
+      "dev": true,
+      "license": "MIT"
+    },
     "node_modules/vite": {
-      "version": "8.0.10",
+      "version": "8.0.14",
-      "resolved": "https://registry.npmjs.org/vite/-/vite-8.0.10.tgz",
+      "resolved": "https://registry.npmjs.org/vite/-/vite-8.0.14.tgz",
-      "integrity": "sha512-rZuUu9j6J5uotLDs+cAA4O5H4K1SfPliUlQwqa6YEwSrWDZzP4rhm00oJR5snMewjxF5V/K3D4kctsUTsIU9Mw==",
+      "integrity": "sha512-s4BJJ+5y1pYL6Otw51FHhVJQhPnuRinKig64g/1+EUNaJsd3gCKdD31IPFvswUgW9/60QT9oFHbZHbQK5imcxw==",
       "license": "MIT",
       "dependencies": {
         "lightningcss": "^1.32.0",
         "picomatch": "^4.0.4",
-        "postcss": "^8.5.10",
+        "postcss": "^8.5.15",
-        "rolldown": "1.0.0-rc.17",
+        "rolldown": "1.0.2",
         "tinyglobby": "^0.2.16"
       },
       "bin": {
@@ -2743,7 +2996,7 @@
       },
       "peerDependencies": {
         "@types/node": "^20.19.0 || >=22.12.0",
-        "@vitejs/devtools": "^0.1.0",
+        "@vitejs/devtools": "^0.1.18",
         "esbuild": "^0.27.0 || ^0.28.0",
         "jiti": ">=1.21.0",
         "less": "^4.0.0",
@@ -2793,6 +3046,32 @@
           "optional": true
         }
       }
+    },
+    "node_modules/vite-plugin-markdown": {
+      "version": "2.2.0",
+      "resolved": "https://registry.npmjs.org/vite-plugin-markdown/-/vite-plugin-markdown-2.2.0.tgz",
+      "integrity": "sha512-eH2tXMZcx3EHb5okd+/0VIyoR8Gp9pGe24UXitOOcGkzObbJ1vl48aGOAbakoT88FBdzC8MXNkMfBIB9VK0Ndg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "domhandler": "^4.0.0",
+        "front-matter": "^4.0.0",
+        "htmlparser2": "^6.0.0",
+        "markdown-it": "^12.0.0"
+      },
+      "peerDependencies": {
+        "vite": ">= 2.0.0"
+      }
+    },
+    "node_modules/vite-plugin-port-checker": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/vite-plugin-port-checker/-/vite-plugin-port-checker-1.0.1.tgz",
+      "integrity": "sha512-Mx/Pj5zyu4oak+SKGwQyRLGAvnp9zx0nqjCLhaJoGJeZk2t4EarZojTcHGG0gPMJWj9X6c0MIfzaZDslg80/GA==",
+      "dev": true,
+      "license": "MIT",
+      "peerDependencies": {
+        "vite": ">=3.0.0"
+      }
     }
   }
 }

package.json

@@ -12,6 +12,7 @@
   },
   "dependencies": {
     "@ant-design/cssinjs": "^2.1.2",
+    "@ant-design/icons": "^6.2.2",
     "@reduxjs/toolkit": "^2.11.2",
     "@tailwindcss/vite": "^4.2.4",
     "@tanstack/react-virtual": "^3.13.24",
@@ -27,6 +28,7 @@
     "tailwindcss": "^4.2.4"
   },
   "devDependencies": {
+    "@tailwindcss/typography": "^0.5.19",
     "@types/node": "^22.19.17",
     "@types/react": "^19.2.14",
     "@types/react-dom": "^19.2.3",
@@ -35,6 +37,7 @@
     "prettier": "^3.8.3",
     "typescript": "~6.0.3",
     "vite": "^8.0.11",
+    "vite-plugin-markdown": "^2.2.0",
     "vite-plugin-port-checker": "^1.0.1"
   },
   "pnpm": {

pnpm-lock.yaml

@@ -11,6 +11,9 @@ importers:
       '@ant-design/cssinjs':
         specifier: ^2.1.2
         version: 2.1.2(react-dom@19.2.6(react@19.2.6))(react@19.2.6)
+      '@ant-design/icons':
+        specifier: ^6.2.2
+        version: 6.2.2(react-dom@19.2.6(react@19.2.6))(react@19.2.6)
       '@reduxjs/toolkit':
         specifier: ^2.11.2
         version: 2.11.2(react-redux@9.2.0(@types/react@19.2.14)(react@19.2.6)(redux@5.0.1))(react@19.2.6)
@@ -51,6 +54,9 @@ importers:
         specifier: ^4.2.4
         version: 4.2.4
     devDependencies:
+      '@tailwindcss/typography':
+        specifier: ^0.5.19
+        version: 0.5.19(tailwindcss@4.2.4)
       '@types/node':
         specifier: ^22.19.17
         version: 22.19.17
@@ -75,6 +81,9 @@ importers:
       vite:
         specifier: ^8.0.11
         version: 8.0.11(@types/node@22.19.17)(jiti@2.6.1)
+      vite-plugin-markdown:
+        specifier: ^2.2.0
+        version: 2.2.0(vite@8.0.11(@types/node@22.19.17)(jiti@2.6.1))
       vite-plugin-port-checker:
         specifier: ^1.0.1
         version: 1.0.1(vite@8.0.11(@types/node@22.19.17)(jiti@2.6.1))
@@ -656,6 +665,11 @@ packages:
     resolution: {integrity: sha512-9El/iI069DKDSXwTvB9J4BwdO5JhRrOweGaK25taBAvBXyXqJAX+Jqdvs8r8gKpsI/1m0LeJLyQYTf/WLrBT1Q==}
     engines: {node: '>= 20'}
 
+  '@tailwindcss/typography@0.5.19':
+    resolution: {integrity: sha512-w31dd8HOx3k9vPtcQh5QHP9GwKcgbMp87j58qi6xgiBnFFtKEAgCWnDw4qUT8aHwkCp8bKvb/KGKWWHedP0AAg==}
+    peerDependencies:
+      tailwindcss: '>=3.0.0 || insiders || >=4.0.0-alpha.20 || >=4.0.0-beta.1'
+
   '@tailwindcss/vite@4.2.4':
     resolution: {integrity: sha512-pCvohwOCspk3ZFn6eJzrrX3g4n2JY73H6MmYC87XfGPyTty4YsCjYTMArRZm/zOI8dIt3+EcrLHAFPe5A4bgtw==}
     peerDependencies:
@@ -706,6 +720,12 @@ packages:
       react: '>=18.0.0'
       react-dom: '>=18.0.0'
 
+  argparse@1.0.10:
+    resolution: {integrity: sha512-o5Roy6tNG4SL/FOkCAN6RzjiakZS25RLYFrcMttJqbdd8BWrnA+fGz57iN5Pb06pvBGvl5gQ0B48dJlslXvoTg==}
+
+  argparse@2.0.1:
+    resolution: {integrity: sha512-8+9WqebbFzpX9OR+Wa6O29asIogeRMzcGtAINdpMHHyAg10f05aSFVBbcEqGf/PXw1EjAZ+q2/bEBg3DvurK3Q==}
+
   asynckit@0.4.0:
     resolution: {integrity: sha512-Oei9OH4tRh0YqU3GxhX79dM/mwVgvbZJaSNaRk+bshkj0S5cfHcgYakreBjrHwatXKbz+IoIdYLxrKim2MjW0Q==}
 
@@ -731,6 +751,11 @@ packages:
     resolution: {integrity: sha512-ei8Aos7ja0weRpFzJnEA9UHJ/7XQmqglbRwnf2ATjcB9Wq874VKH9kfjjirM6UhU2/E5fFYadylyhFldcqSidQ==}
     engines: {node: '>=18'}
 
+  cssesc@3.0.0:
+    resolution: {integrity: sha512-/Tb/JcjK111nNScGob5MNtsntNM1aCNUDipB/TkwZFhyDrrE47SOx/18wF2bbjgc3ZzCSKW1T5nt5EbFoAz/Vg==}
+    engines: {node: '>=4'}
+    hasBin: true
+
   csstype@3.2.3:
     resolution: {integrity: sha512-z1HGKcYy2xA8AGQfwrn0PAy+PB7X/GSj3UVJW9qKyn43xWa+gl5nXmU4qqLMRzWVLFC8KusUX8T/0kCiOYpAIQ==}
 
@@ -745,6 +770,19 @@ packages:
     resolution: {integrity: sha512-Btj2BOOO83o3WyH59e8MgXsxEQVcarkUOpEYrubB0urwnN10yQ364rsiByU11nZlqWYZm05i/of7io4mzihBtQ==}
     engines: {node: '>=8'}
 
+  dom-serializer@1.4.1:
+    resolution: {integrity: sha512-VHwB3KfrcOOkelEG2ZOfxqLZdfkil8PtJi4P8N2MMXucZq2yLp75ClViUlOVwyoHEDjYU433Aq+5zWP61+RGag==}
+
+  domelementtype@2.3.0:
+    resolution: {integrity: sha512-OLETBj6w0OsagBwdXnPdN0cnMfF9opN69co+7ZrbfPGrdpPVNBUj02spi6B1N7wChLQiPn4CSH/zJvXw56gmHw==}
+
+  domhandler@4.3.1:
+    resolution: {integrity: sha512-GrwoxYN+uWlzO8uhUXRl0P+kHE4GtVPfYzVLcUxPL7KNdHKj66vvlhiweIHqYYXWlw+T8iLMp42Lm67ghw4WMQ==}
+    engines: {node: '>= 4'}
+
+  domutils@2.8.0:
+    resolution: {integrity: sha512-w96Cjofp72M5IIhpjgobBimYEfoPjx1Vx0BSX9P30WBdZW2WIKU0T1Bd0kz2eNZ9ikjKgHbEyKx8BB6H1L3h3A==}
+
   dunder-proto@1.0.1:
     resolution: {integrity: sha512-KIN/nDJBQRcXw0MLVhZE9iQHmG68qAVIBg9CqmUYjmQIhgij9U5MFvrqkUL5FbtyyzZuOeOt0zdeRe4UY7ct+A==}
     engines: {node: '>= 0.4'}
@@ -753,6 +791,12 @@ packages:
     resolution: {integrity: sha512-Qohcme7V1inbAfvjItgw0EaxVX5q2rdVEZHRBrEQdRZTssLDGsL8Lwrznl8oQ/6kuTJONLaDcGjkNP247XEhcA==}
     engines: {node: '>=10.13.0'}
 
+  entities@2.1.0:
+    resolution: {integrity: sha512-hCx1oky9PFrJ611mf0ifBLBRW8lUUVRlFolb5gWRfIELabBlbp9xZvrqZLZAs+NxFnbfQoeGd8wDkygjg7U85w==}
+
+  entities@2.2.0:
+    resolution: {integrity: sha512-p92if5Nz619I0w+akJrLZH0MX0Pb5DX39XOwQTtXSdQQOaYH03S1uIQp4mhOZtAXrxq4ViO67YTiLBo2638o9A==}
+
   es-define-property@1.0.1:
     resolution: {integrity: sha512-e3nRfgfUZ4rNGL232gUgX06QNyyez04KdjFrF+LTRoOXmrOgFKDg4BCdsjW8EnT69eqdYGmRpJwiPVYNrCaW3g==}
     engines: {node: '>= 0.4'}
@@ -769,6 +813,11 @@ packages:
     resolution: {integrity: sha512-j6vWzfrGVfyXxge+O0x5sh6cvxAog0a/4Rdd2K36zCMV5eJ+/+tOAngRO8cODMNWbVRdVlmGZQL2YS3yR8bIUA==}
     engines: {node: '>= 0.4'}
 
+  esprima@4.0.1:
+    resolution: {integrity: sha512-eGuFFw7Upda+g4p+QHvnW0RyTX/SVeJBDM/gCtMARO0cLuT2HcEKnTPvhjV6aGeqrCB/sbNop0Kszm0jsaWU4A==}
+    engines: {node: '>=4'}
+    hasBin: true
+
   fdir@6.5.0:
     resolution: {integrity: sha512-tIbYtZbucOs0BRGqPJkshJUYdL+SDH7dVM8gjy+ERp3WAUjLEFJE+02kanyHtwjWOnwrKYBiwAmM0p4kLJAnXg==}
     engines: {node: '>=12.0.0'}
@@ -791,6 +840,9 @@ packages:
     resolution: {integrity: sha512-8RipRLol37bNs2bhoV67fiTEvdTrbMUYcFTiy3+wuuOnUog2QBHCZWXDRijWQfAkhBj2Uf5UnVaiWwA5vdd82w==}
     engines: {node: '>= 6'}
 
+  front-matter@4.0.2:
+    resolution: {integrity: sha512-I8ZuJ/qG92NWX8i5x1Y8qyj3vizhXS31OxjKDu3LKP+7/qBgfIKValiZIEwoVoJKUHlhWtYrktkxV1XsX+pPlg==}
+
   fsevents@2.3.3:
     resolution: {integrity: sha512-5xoDfX+fL7faATnagmWPpbFtwh/R77WmMMqqHGS65C3vvB0YHrgF+B1YmZ3441tMj5n63k0212XNoJwzlhffQw==}
     engines: {node: ^8.16.0 || ^10.6.0 || >=11.0.0}
@@ -830,6 +882,9 @@ packages:
     resolution: {integrity: sha512-ej4AhfhfL2Q2zpMmLo7U1Uv9+PyhIZpgQLGT1F9miIGmiCJIoCgSmczFdrc97mWT4kVY72KA+WnnhJ5pghSvSg==}
     engines: {node: '>= 0.4'}
 
+  htmlparser2@6.1.0:
+    resolution: {integrity: sha512-gyyPk6rgonLFEDGoeRgQNaEUvdJ4ktTmmUh/h2t7s+M8oPpIPxgNACWa+6ESR57kXstwqPiCut0V8NRpcwgU7A==}
+
   immer@11.1.4:
     resolution: {integrity: sha512-XREFCPo6ksxVzP4E0ekD5aMdf8WMwmdNaz6vuvxgI40UaEiu6q3p8X52aU6GdyvLY3XXX/8R7JOTXStz/nBbRw==}
 
@@ -840,6 +895,10 @@ packages:
     resolution: {integrity: sha512-ekilCSN1jwRvIbgeg/57YFh8qQDNbwDb9xT/qu2DAHbFFZUicIl4ygVaAvzveMhMVr3LnpSKTNnwt8PoOfmKhQ==}
     hasBin: true
 
+  js-yaml@3.14.2:
+    resolution: {integrity: sha512-PMSmkqxr106Xa156c2M265Z+FTrPl+oxd/rgOQy2tijQeK5TxQ43psO1ZCwhVOSdnn+RzkzlRz/eY4BgJBYVpg==}
+    hasBin: true
+
   json2mq@0.2.0:
     resolution: {integrity: sha512-SzoRg7ux5DWTII9J2qkrZrqV1gt+rTaoufMxEzXbS26Uid0NwaJd123HcoB80TgubEppxxIGdNxCx50fEoEWQA==}
 
@@ -917,13 +976,23 @@ packages:
     resolution: {integrity: sha512-NXYBzinNrblfraPGyrbPoD19C1h9lfI/1mzgWYvXUTe414Gz/X1FD2XBZSZM7rRTrMA8JL3OtAaGifrIKhQ5yQ==}
     engines: {node: '>= 12.0.0'}
 
+  linkify-it@3.0.3:
+    resolution: {integrity: sha512-ynTsyrFSdE5oZ/O9GEf00kPngmOfVwazR5GKDq6EYfhlpFug3J2zybX56a2PRRpc9P+FuSoGNAwjlbDs9jJBPQ==}
+
   magic-string@0.30.21:
     resolution: {integrity: sha512-vd2F4YUyEXKGcLHoq+TEyCjxueSeHnFxyyjNp80yg0XV4vUhnDer/lvvlqM/arB5bXQN5K2/3oinyCRyx8T2CQ==}
 
+  markdown-it@12.3.2:
+    resolution: {integrity: sha512-TchMembfxfNVpHkbtriWltGWc+m3xszaRD0CZup7GFFhzIgQqxIfn3eGj1yZpfuflzPvfkt611B2Q/Bsk1YnGg==}
+    hasBin: true
+
   math-intrinsics@1.1.0:
     resolution: {integrity: sha512-/IXtbwEk5HTPyEwyKX6hGkYXxM9nbj64B+ilVJnC/R6B0pH5G4V3b0pVbL7DBj4tkhBAppbQUlf6F6Xl9LHu1g==}
     engines: {node: '>= 0.4'}
 
+  mdurl@1.0.1:
+    resolution: {integrity: sha512-/sKlQJCBYVY9Ers9hqzKou4H6V5UWc/M59TH2dvkt+84itfnq7uFOMLpOiOS4ujvHP4etln18fmIxA5R5fll0g==}
+
   mime-db@1.52.0:
     resolution: {integrity: sha512-sPU4uV7dYlvtWJxwwxHD0PuihVNiE7TyAbQ5SWxDCB9mUYvOgroQOwYQQOKPJ8CIbE+1ETVlOoK1UC2nU3gYvg==}
     engines: {node: '>= 0.6'}
@@ -944,6 +1013,10 @@ packages:
     resolution: {integrity: sha512-QP88BAKvMam/3NxH6vj2o21R6MjxZUAd6nlwAS/pnGvN9IVLocLHxGYIzFhg6fUQ+5th6P4dv4eW9jX3DSIj7A==}
     engines: {node: '>=12'}
 
+  postcss-selector-parser@6.0.10:
+    resolution: {integrity: sha512-IQ7TZdoaqbT+LCpShg46jnZVlhWD2w6iQYAcYXfHARZ7X1t/UGhhceQDs5X0cGqKvYlHNOuv7Oa1xmb0oQuA3w==}
+    engines: {node: '>=4'}
+
   postcss@8.5.14:
     resolution: {integrity: sha512-SoSL4+OSEtR99LHFZQiJLkT59C5B1amGO1NzTwj7TT1qCUgUO6hxOvzkOYxD+vMrXBM3XJIKzokoERdqQq/Zmg==}
     engines: {node: ^10 || ^12 || >=14}
@@ -1036,6 +1109,9 @@ packages:
     resolution: {integrity: sha512-UXWMKhLOwVKb728IUtQPXxfYU+usdybtUrK/8uGE8CQMvrhOpwvzDBwj0QhSL7MQc7vIsISBG8VQ8+IDQxpfQA==}
     engines: {node: '>=0.10.0'}
 
+  sprintf-js@1.0.3:
+    resolution: {integrity: sha512-D9cPgkvLlV3t3IzL0D0YLvGA9Ahk4PcvVwUbN0dSGr1aP0Nrt4AEnTUbuGvquEC0mA64Gqt1fzirlRs5ibXx8g==}
+
   string-convert@0.2.1:
     resolution: {integrity: sha512-u/1tdPl4yQnPBjnVrmdLo9gtuLvELKsAoRapekWggdiQNvvvum+jYF329d84NAa660KQw7pB2n36KrIKVoXa3A==}
 
@@ -1065,6 +1141,9 @@ packages:
     engines: {node: '>=14.17'}
     hasBin: true
 
+  uc.micro@1.0.6:
+    resolution: {integrity: sha512-8Y75pvTYkLJW2hWQHXxoqRgV7qb9B+9vFEtidML+7koHUFapnVJAZ6cKs+Qjz5Aw3aZWHMC6u0wJE3At+nSGwA==}
+
   undici-types@6.21.0:
     resolution: {integrity: sha512-iwDZqg0QAGrg9Rav5H4n0M64c3mkR59cJ6wQp+7C4nI0gsmExaedaYLNO44eT4AtBBwjbTiGPMlt2Md0T9H9JQ==}
 
@@ -1073,6 +1152,14 @@ packages:
     peerDependencies:
       react: ^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0
 
+  util-deprecate@1.0.2:
+    resolution: {integrity: sha512-EPD5q1uXyFxJpCrLnCc1nHnq3gOa6DZBocAIiI2TaSCA7VCJ1UJDMagCzIkXNsUYfD1daK//LTEQ8xiIbrHtcw==}
+
+  vite-plugin-markdown@2.2.0:
+    resolution: {integrity: sha512-eH2tXMZcx3EHb5okd+/0VIyoR8Gp9pGe24UXitOOcGkzObbJ1vl48aGOAbakoT88FBdzC8MXNkMfBIB9VK0Ndg==}
+    peerDependencies:
+      vite: '>= 2.0.0'
+
   vite-plugin-port-checker@1.0.1:
     resolution: {integrity: sha512-Mx/Pj5zyu4oak+SKGwQyRLGAvnp9zx0nqjCLhaJoGJeZk2t4EarZojTcHGG0gPMJWj9X6c0MIfzaZDslg80/GA==}
     peerDependencies:
@@ -1702,6 +1789,11 @@ snapshots:
       '@tailwindcss/oxide-win32-arm64-msvc': 4.2.4
       '@tailwindcss/oxide-win32-x64-msvc': 4.2.4
 
+  '@tailwindcss/typography@0.5.19(tailwindcss@4.2.4)':
+    dependencies:
+      postcss-selector-parser: 6.0.10
+      tailwindcss: 4.2.4
+
   '@tailwindcss/vite@4.2.4(vite@8.0.11(@types/node@22.19.17)(jiti@2.6.1))':
     dependencies:
       '@tailwindcss/node': 4.2.4
@@ -1798,6 +1890,12 @@ snapshots:
       - luxon
       - moment
 
+  argparse@1.0.10:
+    dependencies:
+      sprintf-js: 1.0.3
+
+  argparse@2.0.1: {}
+
   asynckit@0.4.0: {}
 
   axios@1.16.0:
@@ -1823,6 +1921,8 @@ snapshots:
 
   cookie@1.1.1: {}
 
+  cssesc@3.0.0: {}
+
   csstype@3.2.3: {}
 
   dayjs@1.11.20: {}
@@ -1831,6 +1931,24 @@ snapshots:
 
   detect-libc@2.1.2: {}
 
+  dom-serializer@1.4.1:
+    dependencies:
+      domelementtype: 2.3.0
+      domhandler: 4.3.1
+      entities: 2.2.0
+
+  domelementtype@2.3.0: {}
+
+  domhandler@4.3.1:
+    dependencies:
+      domelementtype: 2.3.0
+
+  domutils@2.8.0:
+    dependencies:
+      dom-serializer: 1.4.1
+      domelementtype: 2.3.0
+      domhandler: 4.3.1
+
   dunder-proto@1.0.1:
     dependencies:
       call-bind-apply-helpers: 1.0.2
@@ -1842,6 +1960,10 @@ snapshots:
       graceful-fs: 4.2.11
       tapable: 2.3.3
 
+  entities@2.1.0: {}
+
+  entities@2.2.0: {}
+
   es-define-property@1.0.1: {}
 
   es-errors@1.3.0: {}
@@ -1857,6 +1979,8 @@ snapshots:
       has-tostringtag: 1.0.2
       hasown: 2.0.3
 
+  esprima@4.0.1: {}
+
   fdir@6.5.0(picomatch@4.0.4):
     optionalDependencies:
       picomatch: 4.0.4
@@ -1871,6 +1995,10 @@ snapshots:
       hasown: 2.0.3
       mime-types: 2.1.35
 
+  front-matter@4.0.2:
+    dependencies:
+      js-yaml: 3.14.2
+
   fsevents@2.3.3:
     optional: true
 
@@ -1910,12 +2038,24 @@ snapshots:
     dependencies:
       function-bind: 1.1.2
 
+  htmlparser2@6.1.0:
+    dependencies:
+      domelementtype: 2.3.0
+      domhandler: 4.3.1
+      domutils: 2.8.0
+      entities: 2.2.0
+
   immer@11.1.4: {}
 
   is-mobile@5.0.0: {}
 
   jiti@2.6.1: {}
 
+  js-yaml@3.14.2:
+    dependencies:
+      argparse: 1.0.10
+      esprima: 4.0.1
+
   json2mq@0.2.0:
     dependencies:
       string-convert: 0.2.1
@@ -1969,12 +2109,26 @@ snapshots:
       lightningcss-win32-arm64-msvc: 1.32.0
       lightningcss-win32-x64-msvc: 1.32.0
 
+  linkify-it@3.0.3:
+    dependencies:
+      uc.micro: 1.0.6
+
   magic-string@0.30.21:
     dependencies:
       '@jridgewell/sourcemap-codec': 1.5.5
 
+  markdown-it@12.3.2:
+    dependencies:
+      argparse: 2.0.1
+      entities: 2.1.0
+      linkify-it: 3.0.3
+      mdurl: 1.0.1
+      uc.micro: 1.0.6
+
   math-intrinsics@1.1.0: {}
 
+  mdurl@1.0.1: {}
+
   mime-db@1.52.0: {}
 
   mime-types@2.1.35:
@@ -1987,6 +2141,11 @@ snapshots:
 
   picomatch@4.0.4: {}
 
+  postcss-selector-parser@6.0.10:
+    dependencies:
+      cssesc: 3.0.0
+      util-deprecate: 1.0.2
+
   postcss@8.5.14:
     dependencies:
       nanoid: 3.3.12
@@ -2074,6 +2233,8 @@ snapshots:
 
   source-map-js@1.2.1: {}
 
+  sprintf-js@1.0.3: {}
+
   string-convert@0.2.1: {}
 
   stylis@4.3.6: {}
@@ -2094,12 +2255,24 @@ snapshots:
 
   typescript@6.0.3: {}
 
+  uc.micro@1.0.6: {}
+
   undici-types@6.21.0: {}
 
   use-sync-external-store@1.6.0(react@19.2.6):
     dependencies:
       react: 19.2.6
 
+  util-deprecate@1.0.2: {}
+
+  vite-plugin-markdown@2.2.0(vite@8.0.11(@types/node@22.19.17)(jiti@2.6.1)):
+    dependencies:
+      domhandler: 4.3.1
+      front-matter: 4.0.2
+      htmlparser2: 6.1.0
+      markdown-it: 12.3.2
+      vite: 8.0.11(@types/node@22.19.17)(jiti@2.6.1)
+
   vite-plugin-port-checker@1.0.1(vite@8.0.11(@types/node@22.19.17)(jiti@2.6.1)):
     dependencies:
       vite: 8.0.11(@types/node@22.19.17)(jiti@2.6.1)

src/api/firearm-api.ts

@@ -7,9 +7,9 @@ interface FirearmParams extends PageQueryParams {
 }
 
 /**
- * 查询武器列表
+ * Fetch firearm list
  *
- * @param params 分页查询参数¬
+ * @param params Paged query parameters
  */
 export async function getFirearms(params?: FirearmParams): Promise<Page<Firearm>> {
   let uri = "/firearms"
@@ -28,9 +28,9 @@ export async function getFirearms(params?: FirearmParams): Promise<Page<Firearm>
 }
 
 /**
- * 根据 ID 查询武器
+ * Fetch firearm by ID
  *
- * @param id 武器 ID
+ * @param id Firearm ID
  */
 export async function getFirearm(id: number): Promise<Firearm> {
   const { data } = await WebClient.get<Firearm>(`/firearms/${id}`)
@@ -38,7 +38,7 @@ export async function getFirearm(id: number): Promise<Firearm> {
 }
 
 /**
- * 新建武器
+ * Create firearm
  * @param request
  */
 export async function addFirearm(request: AddFirearmRequest): Promise<Firearm> {

src/components/markdown-renderer/index.tsx

@@ -0,0 +1,17 @@
+import React from "react"
+
+interface MarkdownRendererProps {
+  /** HTML string processed by vite-plugin-markdown */
+  html: string
+  /** Optional custom class name */
+  className?: string
+}
+
+export default function MarkdownRenderer({ html, className = "" }: MarkdownRendererProps) {
+  return (
+    <article
+      className={`prose prose-slate max-w-none dark:prose-invert ${className}`}
+      dangerouslySetInnerHTML={{ __html: html }}
+    />
+  )
+}

src/components/mod-codes/index.tsx

@@ -0,0 +1,357 @@
+// ModCodes.tsx
+import { useEffect, useState, useCallback, useMemo } from "react";
+import { Card, Col, Pagination, Row, Tag, Typography, Button, Popconfirm, Space, Select, App } from "antd";
+import { Link } from "react-router-dom";
+import { ModificationApi, TagApi } from "@/api";
+import { Modification } from "@/types";
+import ModificationCreateModal from "@/components/modification-create-modal";
+import ModificationEditModal from "@/components/modification-edit-modal";
+import { useAppSelector } from "@/hooks/store";
+
+const pageSize = 10; // 常量，不需要 useState
+
+interface ModCodesProps {
+  firearmId: string; // 从父组件传入
+}
+
+export default function ModCodes({ firearmId }: ModCodesProps) {
+  const { message } = App.useApp();
+  const user = useAppSelector((state) => state.auth.user);
+
+  // ✅ 所有 useState 必须放在组件函数内部
+  const [createModalOpen, setCreateModalOpen] = useState(false);
+  const [editingModification, setEditingModification] = useState<Modification | null>(null);
+  const [loading, setLoading] = useState(false);
+  const [modifications, setModifications] = useState<Modification[]>([]);
+  const [tagOptions, setTagOptions] = useState<string[]>([]);
+  const [selectedTags, setSelectedTags] = useState<string[]>([]);
+  const [total, setTotal] = useState(0);
+  const [page, setPage] = useState(1);
+  const [deletingId, setDeletingId] = useState<number | null>(null);
+
+  // 获取标签选项
+  useEffect(() => {
+    const _firearmId = firearmId ? Number(firearmId) : undefined;
+    if (_firearmId) {
+      TagApi.getTags(_firearmId).then(setTagOptions);
+    }
+  }, [firearmId]);
+
+  // 加载改枪码列表
+  const loadModifications = useCallback(async () => {
+    const numericId = firearmId
+    if (!numericId) return;
+    setLoading(true);
+    try {
+      const pagedData = await ModificationApi.getModifications({
+        page: page - 1,
+        size: pageSize,
+        sortBy: "id",
+        direction: "ASC",
+        firearmId: numericId, // 使用数字类型
+        tags: selectedTags,
+      });
+      setModifications(pagedData.items);
+      setTotal(pagedData.totalElements);
+    } finally {
+      setLoading(false);
+    }
+  }, [firearmId, page, selectedTags]);
+
+  useEffect(() => {
+    loadModifications();
+  }, [loadModifications]);
+
+  const handleDelete = async (modification: Modification) => {
+    setDeletingId(modification.id);
+    try {
+      await ModificationApi.removeModification(modification.id);
+      message.success("删除成功");
+      if (modifications.length === 1 && page > 1) {
+        setPage(page - 1);
+      } else {
+        await loadModifications();
+      }
+    } catch {
+      message.error("删除失败");
+    } finally {
+      setDeletingId(null);
+    }
+  };
+
+  // 当 firearmId 或标签改变时重置分页
+  useEffect(() => {
+    setPage(1);
+  }, [firearmId, selectedTags]);
+
+  const parsedFirearmId = useMemo(() => {
+    const value = Number(firearmId);
+    return isNaN(value) ? undefined : value;
+  }, [firearmId]);
+
+  if (!parsedFirearmId) {
+    return <Typography.Text type="secondary">无效的武器 ID</Typography.Text>;
+  }
+const tagColors = [
+  '#e28010', // 青绿
+  '#0EA5E9', // 天蓝
+  '#8B5CF6', // 紫色
+  '#F59E0B', // 琥珀
+  '#EF4444', // 红色
+  '#EC4899', // 粉红
+];
+
+
+  return (
+    <div className="bg-#1e1e1e">
+      <div className="mb-4 flex items-start justify-between gap-4 bg-#1e1e1e">
+        <div className="flex flex-wrap items-center justify-end gap-3 bg-#1e1e1e">
+          <Space wrap>
+            <span>标签：</span>
+            <Select<string[]>
+              mode="multiple"
+              allowClear
+              placeholder="请选择标签"
+              className="w-64"
+              value={selectedTags}
+              options={tagOptions.map((tag) => ({ value: tag, label: tag }))}
+              onChange={(values) => {
+                setSelectedTags(values);
+              }}
+            />
+            {firearmId && <Tag color="geekblue">武器 ID: {firearmId}</Tag>}
+            {(firearmId || selectedTags.length > 0) && (
+              <Link to="/mod-codes">
+                <Button
+                  type="link"
+                  onClick={() => {
+                    setSelectedTags([]);
+                    setPage(1);
+                  }}
+                >
+                  清除筛选
+                </Button>
+              </Link>
+            )}
+          </Space>
+          {user && (
+            <Button type="primary" onClick={() => setCreateModalOpen(true)}>
+              添加改装
+            </Button>
+          )}
+        </div>
+      </div>
+
+      <div className="mb-6">
+        <Row gutter={[16, 16]}>
+          {modifications.map((modification) => (
+            <Col key={modification.id} span={24}>
+              <Card
+                title={modification.name}
+                extra={
+                  user ? (
+                    <div className="flex items-center gap-1">
+                      <Button type="link" size="small" onClick={() => setEditingModification(modification)}>
+                        编辑
+                      </Button>
+                      <Popconfirm
+                        title="确认删除改枪码"
+                        description={`确定要删除 ${modification.name} 吗？该操作不可撤销。`}
+                        okText="删除"
+                        cancelText="取消"
+                        okButtonProps={{ danger: true, loading: deletingId === modification.id }}
+                        onConfirm={() => handleDelete(modification)}
+                      >
+                        <Button type="link" danger size="small" loading={deletingId === modification.id}>
+                          删除
+                        </Button>
+                      </Popconfirm>
+                    </div>
+                  ) : null
+                }
+                variant="outlined"
+                styles={{
+                  root: {
+                    background: '#35333385'
+                  },
+                  header: { minHeight: 56 },
+                }}
+              >
+                <div className="flex flex-col gap-3">
+                  {/* 改枪码行 */}
+                  <div className="flex items-center justify-between gap-2">
+                    <span>
+                      <strong style={{
+                        color: '#10E28C',
+                        fontWeight:800
+                      }}>改枪码：</strong>
+                      <code className="rounded" style={{
+                          color: '#10E28C',
+                          fontWeight:600
+                      }}>
+                        {modification.code}
+                      </code>
+                    </span>
+                    <Button
+                      type="text"
+                      size="small"
+                      onClick={() => navigator.clipboard.writeText(modification.code)}
+                    >
+                      复制
+                    </Button>
+                  </div>
+
+                  {/* 作者 */}
+                  <div className="flex items-center justify-between gap-2">
+                    <Typography.Text style={{
+                        color:'#B59728',
+                        fontWeight:800
+                      }}>
+                      <strong>作者：</strong>
+                      {modification.author || "未知"}
+                    </Typography.Text>
+                  </div>
+                  {/* 标签列表 */}
+                  {(modification.tags?.length || 0) > 0 && (
+                    <div className="flex flex-wrap gap-2">
+                      {(modification.tags || []).map((tag,idx) => (
+                        <Tag key={`${modification.id}-${tag}`} style={{
+                          background: tagColors[idx % tagColors.length],
+                          font: '800'
+                        }}>{tag}</Tag>
+                      ))}
+                    </div>
+                  )}
+
+                  {/* 配件配置区域 */}
+                  <div>
+                    <div className="flex items-center justify-between gap-2">
+                      <Typography.Text strong>配件配置：</Typography.Text></div>
+                    {(modification.accessories?.length || 0) > 0 ? (
+                      <div className="mt-2 overflow-x-auto">
+                        <div className="grid min-w-[275px] grid-cols-6 gap-2">
+                          {(modification.accessories || []).map((accessory, accessoryIndex) => (
+                            <div
+                              key={`${modification.id}-accessory-${accessoryIndex}`}
+                              className="" style={{
+                                borderRadius: '0.25rem',
+                                border: '2px solid #10E28C',
+                                padding: '0.5rem',
+                                background: '#16343b96'
+
+                              }}
+                            >
+                              <div className="flex items-center justify-between gap-2 rounded px-2 py-1">
+                                <Typography.Text className="mr-0 text-cyan-400" style={{
+                                  color: '#10E28C',
+                                }}>
+                                  {accessory.slotName || "未填写槽位"}
+                                </Typography.Text>
+                                <Typography.Text className="mr-0 text-cyan-300" style={{
+                                  color: '#ffffff',
+                                }}>
+                                  {accessory.accessoryName || "未填写配件"}
+                                </Typography.Text>
+                              </div>
+                              {(accessory.tunings?.length || 0) > 0 ? (
+                                <div className="mt-2 flex flex-wrap gap-1">
+                                  {accessory.tunings.map((tuning, tuningIndex) => (
+                                    <Tag
+                                      key={`${modification.id}-${accessoryIndex}-tuning-${tuningIndex}`}
+                                      style={{
+                                        background: '#10E28C',
+                                      }}
+                                    >
+                                      {tuning.tuningName || "未命名"}: {tuning.tuningValue ?? "-"}
+                                    </Tag>
+                                  ))}
+                                </div>
+                              ) : null}
+                            </div>
+                          ))}
+                        </div>
+                      </div>
+                    ) : (
+                      <Typography.Text type="secondary" className="mt-1 block">
+                        暂无配件信息
+                      </Typography.Text>
+                    )}
+                  </div>
+
+                  {/* 备注 */}
+                  <div className="flex items-center justify-between gap-2">
+                    <Typography.Paragraph
+                      style={{ marginBottom: 0 }}
+                      type="secondary"
+                      ellipsis={{ rows: 3 }}
+                    >
+                      {modification.note || "暂无备注"}
+                    </Typography.Paragraph>
+                  </div>
+                  {/* 视频链接 */}
+                  <div className="flex items-center justify-between gap-2">
+                    {modification.videoUrl && (
+                      <div>
+                        <a
+                          href={modification.videoUrl}
+                          target="_blank"
+                          rel="noopener noreferrer"
+                          className="text-cyan-400 hover:text-cyan-300"
+                        >
+                          查看视频
+                        </a>
+                      </div>
+                    )}
+                  </div>
+                </div>
+              </Card>
+            </Col>
+          ))}
+
+          {modifications.length === 0 && (
+            <Col span={24}>
+              <Card>
+                <Typography.Text type="secondary">暂无改枪码数据</Typography.Text>
+              </Card>
+            </Col>
+          )}
+        </Row>
+      </div>
+
+      <div className="flex justify-end">
+        <Pagination
+          align="end"
+          current={page}
+          pageSize={pageSize}
+          total={total}
+          onChange={(nextPage) => {
+            setPage(nextPage);
+          }}
+          showSizeChanger={false}
+        />
+      </div>
+
+      <ModificationCreateModal
+        open={createModalOpen}
+        defaultFirearmId={parsedFirearmId}
+        lockedFirearmId={parsedFirearmId}
+        onCancel={() => setCreateModalOpen(false)}
+        onSuccess={() => {
+          setCreateModalOpen(false);
+          void loadModifications();
+        }}
+      />
+
+      <ModificationEditModal
+        open={!!editingModification}
+        modification={editingModification}
+        lockedFirearmId={parsedFirearmId}
+        onCancel={() => setEditingModification(null)}
+        onSuccess={() => {
+          setEditingModification(null);
+          void loadModifications();
+        }}
+      />
+    </div>
+  );
+}

src/hooks/store.ts

@@ -1,6 +1,5 @@
 import { useDispatch, useSelector } from "react-redux"
-import type { AppDispatch, RootState } from "./index"
+import type { AppDispatch, RootState } from "@/store"
 
 export const useAppDispatch = useDispatch.withTypes<AppDispatch>()
 export const useAppSelector = useSelector.withTypes<RootState>()
-

src/index.css

@@ -1,8 +1,10 @@
 @layer theme, base, antd, components, utilities;
 
 @import 'tailwindcss';
+@plugin "@tailwindcss/typography";
 
-html, body {
+html,
+body {
   margin: 0;
   padding: 0;
   width: 100%;
@@ -38,6 +40,7 @@ html, body {
 .nav-item {
   position: relative;
   overflow: hidden;
+  z-index: 1;
 }
 
 .nav-item::after {
@@ -51,15 +54,151 @@ html, body {
   transition: height 0.2s ease-in-out;
   opacity: 0.35;
   pointer-events: none;
+  z-index: -1;
 
 }
 
-.nav-item:hover::after,
+.nav-item:hover::after {
+  height: 30%;
+}
+
+/* 激活状态效果 */
 .nav-item.active::after {
-  height: 80%;  /* 向上打光的高度，可以调整 */
+  height: 30%;
+}
+
+/* 可选：激活+悬停效果 */
+.nav-item.active:hover::after {
+  opacity: 0.35;
+}
+
+.custom-btn-outlined {
+  --ant-color-solid: #10E28C;
+  /* 边框和文字颜色 */
+  --ant-color-solid-hover: #2ee59d;
+  --ant-color-solid-active: #0cb878;
+}
+
+
+.hex-bg {
+  background-color: #1E1E1E;
+  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' opacity='0.3' viewBox='0 0 100 100'%3E%3Cdefs%3E%3ClinearGradient id='fadeDown' x1='0%25' y1='0%25' x2='0%25' y2='100%25'%3E%3Cstop offset='0%25' stop-color='%2339ff14' stop-opacity='1' /%3E%3Cstop offset='100%25' stop-color='%2339ff14' stop-opacity='0' /%3E%3C/linearGradient%3E%3C/defs%3E%3Cg fill='none' stroke='url(%23fadeDown)' stroke-width='0.5'%3E%3Cpath d='M225 131.704L230.452 134.852 230.452 141.148 225 144.296 219.548 141.148 219.548 134.852Z' transform='matrix(0.52546041,-0.85081805,0.85081805,0.52546041,-203.01888079,130.22116071)'/%3E%3Cpath d='M225 131.704L230.452 134.852 230.452 141.148 225 144.296 219.548 141.148 219.548 134.852Z' transform='matrix(0.52546006,-0.85081827,0.85081827,0.52546006,-190.65208214,130.43446239)'/%3E%3Cpath d='M225 131.704L230.452 134.852 230.452 141.148 225 144.296 219.548 141.148 219.548 134.852Z' transform='matrix(0.52546006,-0.85081827,0.85081827,0.52546006,-197.04868859,141.09544261)'/%3E%3Cpath d='M225 131.704L230.452 134.852 230.452 141.148 225 144.296 219.548 141.148 219.548 134.852Z' transform='matrix(0.52546006,-0.85081827,0.85081827,0.52546006,-184.68192833,141.30866893)'/%3E%3Cpath d='M225 131.704L230.452 134.852 230.452 141.148 225 144.296 219.548 141.148 219.548 134.852Z' transform='matrix(0.52546006,-0.85081827,0.85081827,0.52546006,-178.2853524,130.6476887)'/%3E%3Cpath d='M225 131.704L230.452 134.852 230.452 141.148 225 144.296 219.548 141.148 219.548 134.852Z' transform='matrix(0.52546006,-0.85081827,0.85081827,0.52546006,-172.3151986,141.52187999)'/%3E%3Cpath d='M225 131.704L230.452 134.852 230.452 141.148 225 144.296 219.548 141.148 219.548 134.852Z' transform='matrix(0.52546006,-0.85081827,0.85081827,0.52546006,-190.86530846,152.18286021)'/%3E%3Cpath d='M225 131.704L230.452 134.852 230.452 141.148 225 144.296 219.548 141.148 219.548 134.852Z' transform='matrix(0.52546006,-0.85081827,0.85081827,0.52546006,-178.49857872,152.39608653)'/%3E%3Cpath d='M225 131.704L230.452 134.852 230.452 141.148 225 144.296 219.548 141.148 219.548 134.852Z' transform='matrix(0.52546006,-0.85081827,0.85081827,0.52546006,-203.44526451,151.88976939)'/%3E%3Cpath d='M225 131.704L230.452 134.852 230.452 141.148 225 144.296 219.548 141.148 219.548 134.852Z' transform='matrix(0.52546006,-0.85081827,0.85081827,0.52546006,-165.94457787,152.72932323)'/%3E%3Cpath d='M225 131.704L230.452 134.852 230.452 141.148 225 144.296 219.548 141.148 219.548 134.852Z' transform='matrix(0.52546006,-0.85081827,0.85081827,0.52546006,-197.30770653,163.1089619)'/%3E%3Cpath d='M225 131.704L230.452 134.852 230.452 141.148 225 144.296 219.548 141.148 219.548 134.852Z' transform='matrix(0.52546006,-0.85081827,0.85081827,0.52546006,-184.99694603,163.40205272)'/%3E%3Cpath d='M225 131.704L230.452 134.852 230.452 141.148 225 144.296 219.548 141.148 219.548 134.852Z' transform='matrix(0.52546006,-0.85081827,0.85081827,0.52546006,-172.3930642,163.69517406)'/%3E%3Cpath d='M225 131.704L230.452 134.852 230.452 141.148 225 144.296 219.548 141.148 219.548 134.852Z' transform='matrix(0.52546006,-0.85081827,0.85081827,0.52546006,-165.94457787,130.86648448)'/%3E%3Cpath d='M225 131.704L230.452 134.852 230.452 141.148 225 144.296 219.548 141.148 219.548 134.852Z' transform='matrix(0.52546006,-0.85081827,0.85081827,0.52546006,-178.84158104,174.24726756)'/%3E%3Cpath d='M225 131.704L230.452 134.852 230.452 141.148 225 144.296 219.548 141.148 219.548 134.852Z' transform='matrix(0.52546006,-0.85081827,0.85081827,0.52546006,-166.23769921,174.68691905)'/%3E%3Cpath d='M225 131.704L230.452 134.852 230.452 141.148 225 144.296 219.548 141.148 219.548 134.852Z' transform='matrix(0.52546006,-0.85081827,0.85081827,0.52546006,-160.08231896,163.69518931)'/%3E%3Cpath d='M225 131.704L230.452 134.852 230.452 141.148 225 144.296 219.548 141.148 219.548 134.852Z' transform='matrix(0.52546006,-0.85081827,0.85081827,0.52546006,-159.78921288,141.71168407)'/%3E%3Cpath d='M225 131.704L230.452 134.852 230.452 141.148 225 144.296 219.548 141.148 219.548 134.852Z' transform='matrix(0.52546006,-0.85081827,0.85081827,0.52546006,-160.37542504,185.6786793)'/%3E%3Cpath d='M225 131.704L230.452 134.852 230.452 141.148 225 144.296 219.548 141.148 219.548 134.852Z' transform='matrix(0.52546006,-0.85081827,0.85081827,0.52546006,-172.68620079,185.53211864)'/%3E%3Cpath d='M225 131.704L230.452 134.852 230.452 141.148 225 144.296 219.548 141.148 219.548 134.852Z' transform='matrix(0.52546006,-0.85081827,0.85081827,0.52546006,-209.32536095,140.83235057)'/%3E%3Cpath d='M225 131.704L230.452 134.852 230.452 141.148 225 144.296 219.548 141.148 219.548 134.852Z' transform='matrix(0.52546006,-0.85081827,0.85081827,0.52546006,-215.48072594,129.98715098)'/%3E%3C/g%3E%3C/svg%3E");
+  background-size: 350px 350px;
+  background-position: right -90px top -40px;
+  background-repeat: no-repeat;
+  margin: 0;
+
 }
 
 .nav-item:hover,
 .nav-item.active {
   color: white;
 }
+
+
+/* LeftMiddleRightBox.css */
+.lmr-container {
+  display: flex;
+  width: 100%;
+  /* 可根据需要调整 */
+  overflow: hidden;
+  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
+  background: '#555555';
+  color: 'white';
+  padding: '4px 12px';
+  border-radius: '4px';
+  font-size: '14px';
+  font-weight: '500';
+  letter-spacing: '0.5px';
+}
+
+
+.lmr-left,
+.lmr-middle,
+.lmr-right {
+  padding: 20px;
+  transition: all 0.2s ease;
+  height: 100%;
+}
+
+
+.lmr-left {
+  flex: 1;
+  background-color: '#555555';
+  color: 'white';
+  padding: '4px 12px';
+  border-radius: '4px';
+  font-size: '14px';
+  font-weight: '500';
+  letter-spacing: '0.5px';
+  margin: auto;
+}
+
+.lmr-middle {
+  flex: 3;
+  background-color: '#555555';
+  color: 'white';
+  padding: '4px 12px';
+  border-radius: '4px';
+  font-size: '14px';
+  font-weight: '500';
+  letter-spacing: '0.5px';
+}
+
+.lmr-right {
+  flex: 2;
+  background-color: '#555555';
+  color: 'white';
+  padding: '4px 12px';
+  border-radius: '4px';
+  font-size: '14px';
+  font-weight: '500';
+  letter-spacing: '0.5px';
+}
+
+.content-placeholder {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  text-align: center;
+  justify-content: center;
+  height: 100%;
+  border-radius: 12px;
+  padding: 16px;
+}
+
+
+
+@media (max-width: 768px) {
+  .lmr-container {
+    flex-direction: column;
+    min-height: auto;
+  }
+
+  .lmr-left,
+  .lmr-middle,
+  .lmr-right {
+    border-right: none;
+
+  }
+
+  .lmr-right {
+    border-bottom: none;
+  }
+
+  .content-placeholder {
+    min-height: 100px;
+  }
+}
+
+.css-var-_r_1_.ant-collapse{
+  --ant-collapse-header-bg:#1e1e1e;
+  width: 90%;
+  border: 0;
+  margin-left: auto;
+  margin-right: auto;
+}
+
+.ant-collapse-body{
+  background: #1e1e1e;
+}

src/layout/hero-layout/index.tsx

@@ -2,10 +2,16 @@ import { Outlet, Link, NavLink } from "react-router-dom"
 import { useMemo } from "react"
 import dayjs from "dayjs"
 import { Dropdown } from "antd"
+import {
+  FileTextOutlined,
+  GithubOutlined,
+  LockOutlined,
+  LoginOutlined,
+} from "@ant-design/icons"
 import { AuthApi } from "@/api"
-import { useAppDispatch, useAppSelector } from "@/store/hooks"
+import { useAppDispatch, useAppSelector } from "@/hooks/store"
 import { clearCurrentUser } from "@/store/auth-slice"
-import { useState } from 'react';
+import { useState } from "react"
 
 /**
  * Main application component that serves as the root layout.
@@ -15,7 +21,7 @@ export default function HeroLayout() {
   const today = useMemo(() => dayjs(), [])
   const user = useAppSelector((state) => state.auth.user)
   const dispatch = useAppDispatch()
-  const [isDropdownOpen, setIsDropdownOpen] = useState(false);
+  const [isDropdownOpen, setIsDropdownOpen] = useState(false)
 
   async function handleLogout() {
     try {
@@ -26,9 +32,9 @@ export default function HeroLayout() {
   }
 
   return (
-    <div className="bg-gray-50 ">
+    <div className="bg-[#1b252a] ">
       {/* Navigation Header */}
-      <header className="bg-white shadow-sm border-b bg-[url('/nav_bg.png')] bg-cover bg-center">
+      <header className="bg-[#0b0f14] shadow-sm border-b">
         <div className="max-w-screen-2xl mx-auto px-4 sm:px-6 lg:px-10 h-full">
           <div className="flex justify-between items-center h-20">
             <div className="flex items-center">
@@ -38,62 +44,28 @@ export default function HeroLayout() {
               <NavLink
                 to="/firearms"
                 className={({ isActive }) =>
-                  `nav-item inline-flex items-center px-10 h-full text-base font-medium transition-all duration-200 ${isActive ? 'active' : ''
+                  `nav-item inline-flex items-center px-10 h-full text-base font-medium transition-all duration-200 ${
+                    isActive ? "active" : ""
                   } text-gray-500 hover:text-white`
-                }
+                }>
-              >
                 武器列表
               </NavLink>
-              <NavLink
+              {/* <NavLink
                 to="/mod-codes"
                 className={({ isActive }) =>
-                  `nav-item inline-flex items-center px-10 h-full text-base font-medium transition-all duration-200 ${isActive ? 'active' : ''
+                  `nav-item inline-flex items-center px-10 h-full text-base font-medium transition-all duration-200 ${
+                    isActive ? "active" : ""
                   } text-gray-500 hover:text-white`
-                }
+                }>
-              >
                 改枪码
-              </NavLink>
+              </NavLink> */}
-              {/* {user ? (
-                <Dropdown
-                  trigger={["hover"]}
-                  menu={{
-                    items: [
-                      {
-                        key: "logout",
-                        label: "退出登录",
-                        danger: true,
-                        onClick: handleLogout,
-                      },
-                    ],
-                  }}
-                >
-                  <span className="nav-item inline-flex items-center px-10 h-full text-base font-medium text-gray-500 hover:text-white cursor-pointer">
-                    {user.username}
-                  </span>
-                </Dropdown>
-              ) : (
-                <Link
-                  to="/login"
-                  className="nav-item inline-flex items-center px-10 h-full text-base font-medium transition-all duration-200 text-gray-500 hover:text-white"
-                >
-                  登录
-                </Link>
-              )}
-              <a
-                href="https://github.com/zihluwang/delta-force-firearm-modification-codes"
-                target="_blank"
-                rel="noopener noreferrer"
-                className="nav-item inline-flex items-center px-10 h-full text-lg font-medium transition-all duration-200 text-gray-500 hover:text-white"
-              >
-                GitHub
-              </a> */}
             </nav>
           </div>
         </div>
       </header>
 
       {/* Main Content Area */}
-      <main className="max-w-screen-2xl mx-auto py-6 sm:px-6 lg:px-10">
+      <main className=" max-w-screen-2xl mx-auto py-6 sm:px-6 lg:px-10">
         <div className="px-4 py-6 sm:px-0">
           <Outlet />
         </div>
@@ -102,52 +74,44 @@ export default function HeroLayout() {
       {/* Footer */}
       <footer className="bg-black border-t border-gray-800">
         <div className="max-w-screen-2xl mx-auto px-4 sm:px-6 lg:px-10 py-8">
-
-
-
           <div className="flex flex-wrap justify-center items-center gap-x-6 gap-y-10 text-sm">
-
             <div
               className="relative"
               onMouseEnter={() => setIsDropdownOpen(true)}
-            onMouseLeave={() => setIsDropdownOpen(false)}
+              onMouseLeave={() => setIsDropdownOpen(false)}>
-          >
               <button
                 className="flex items-center gap-1.5 text-gray-400 hover:text-white transition-colors duration-200 focus:outline-none"
-              aria-label="GitHub 仓库"
+                aria-label="GitHub 仓库">
-            >
+                <GithubOutlined className="text-base opacity-80" />
-              <img
-                src="/github-logo.png"  
-                alt=""
-                className="w-5 h-5 opacity-80"
-              />
                 <span>GitHub</span>
                 <svg
-                className={`w-3 h-3 transition-transform duration-200 ${isDropdownOpen ? 'rotate-180' : ''}`}
+                  className={`w-3 h-3 transition-transform duration-200 ${isDropdownOpen ? "rotate-180" : ""}`}
                   fill="none"
                   stroke="currentColor"
-                viewBox="0 0 24 24"
+                  viewBox="0 0 24 24">
-              >
+                  <path
-                <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M19 9l-7 7-7-7" />
+                    strokeLinecap="round"
+                    strokeLinejoin="round"
+                    strokeWidth={2}
+                    d="M19 9l-7 7-7-7"
+                  />
                 </svg>
               </button>
               {isDropdownOpen && (
                 <div className="absolute top-full left-2/3 -translate-x-1/2 w-18 bg-gray-950 border border-gray-700 rounded-lg shadow-xl py-1 z-20 opacity-60">
                   <a
-                  href="https://github.com/zihluwang/frontend-repo"
+                    href="https://github.com/zihluwang/delta-force-guide-web"
                     target="_blank"
                     rel="noopener noreferrer"
-                  className="block px-4 py-2 text-sm text-gray-300 hover:bg-gray-800 hover:text-white transition-colors"
+                    className="block px-4 py-2 text-sm text-gray-300 hover:bg-gray-800 hover:text-white transition-colors">
-                >
+                    Web
-                  前端
                   </a>
                   <a
-                  href="https://github.com/zihluwang/backend-repo"
+                    href="https://github.com/zihluwang/delta-force-guide-server"
                     target="_blank"
                     rel="noopener noreferrer"
-                  className="block px-4 py-2 text-sm text-gray-300 hover:bg-gray-800 hover:text-white transition-colors"
+                    className="block px-4 py-2 text-sm text-gray-300 hover:bg-gray-800 hover:text-white transition-colors">
-                >
+                    Server
-                  后端
                   </a>
                 </div>
               )}
@@ -155,18 +119,16 @@ export default function HeroLayout() {
 
             <span className="text-gray-700 select-none">•</span>
             <Link
-              to="/"
+              to="/legal?tab=eula"
-              className="flex items-center gap-1.5 text-gray-400 hover:text-white transition-colors duration-200"
+              className="flex items-center gap-1.5 text-gray-400 hover:text-white transition-colors duration-200">
-            >
+              <FileTextOutlined className="text-lg opacity-80" />
-              <img src="/footer-1.png" alt="" className="w-8 w-8 opacity-80" />
               EULA
             </Link>
             <span className="text-gray-700 select-none">•</span>
             <Link
-              to="/"
+              to="/legal?tab=privacy"
-              className="flex items-center gap-1.5 text-gray-400 hover:text-white transition-colors duration-200"
+              className="flex items-center gap-1.5 text-gray-400 hover:text-white transition-colors duration-200">
-            >
+              <LockOutlined className="text-lg opacity-80" />
-              <img src="/footer-2.png" alt="" className="w-8 w-8 opacity-80" />
               隐私政策
             </Link>
             <span className="text-gray-700 select-none">•</span>
@@ -182,8 +144,7 @@ export default function HeroLayout() {
                       onClick: handleLogout,
                     },
                   ],
-                }}
+                }}>
-              >
                 <span className="nav-item inline-flex items-center px-10 h-full text-base font-medium text-gray-500 hover:text-white cursor-pointer">
                   {user.username}
                 </span>
@@ -191,9 +152,8 @@ export default function HeroLayout() {
             ) : (
               <Link
                 to="/login"
-                className="flex items-center gap-1.5 text-gray-400 hover:text-white transition-colors duration-200"
+                className="flex items-center gap-1.5 text-gray-400 hover:text-white transition-colors duration-200">
-              >
+                <LoginOutlined className="text-lg opacity-80" />
-                <img src="../../public/footer-3.png" alt="" className="w-8 w-8 opacity-80" />
                 登录
               </Link>
             )}
@@ -201,11 +161,8 @@ export default function HeroLayout() {
 
           <div className="border-t border-gray-800 my-6" />
           <div className="text-center text-xs text-gray-500">
-            <p>
+            <p>© 2024-{today.year()} Zihlu Wang 和 OnixByte。使用 React 与 TypeScript 构建。</p>
-              © 2024-{today.year()} Zihlu Wang 和 OnixByte。使用 React 与 TypeScript 构建。
-            </p>
           </div>
-
         </div>
       </footer>
     </div>

src/markdown.d.ts

@@ -0,0 +1,6 @@
+declare module "*.md" {
+  const attributes: Record<string, any>
+  const html: string
+  const toc: { level: string; content: string; slug: string }[]
+  export { attributes, html, toc }
+}

src/page/firearms/index.tsx

@@ -3,9 +3,14 @@ import { Link } from "react-router-dom"
 import { FirearmApi } from "@/api"
 import FirearmCreateModal from "@/components/firearm-create-modal"
 import FirearmEditModal from "@/components/firearm-edit-modal"
-import { useAppSelector } from "@/store/hooks"
+import ModCodes from "@/components/mod-codes"
+import { useAppSelector } from "@/hooks/store"
 import { Firearm, FirearmType } from "@/types"
 import { Button, Card, Col, Pagination, Popconfirm, Row, Select, Tag, Typography, App } from "antd"
+import { ConfigProvider, theme } from 'antd';
+import type { CollapseProps } from 'antd';
+import { Collapse } from 'antd';
+
 
 const firearmTypeText: Record<FirearmType, string> = {
   RIFLE: "步枪",
@@ -18,6 +23,14 @@ const firearmTypeText: Record<FirearmType, string> = {
   SPECIAL: "特殊",
 }
 
+
+
+const darkTheme = {
+  algorithm: theme.darkAlgorithm,
+
+  // token: { colorPrimary: '#00b96b' },
+};
+
 const allTypeValue = "ALL"
 type FirearmTypeFilter = FirearmType | typeof allTypeValue
 
@@ -32,6 +45,7 @@ export default function FirearmsPage() {
   const [typeFilter, setTypeFilter] = useState<FirearmTypeFilter>(allTypeValue)
   const [firearms, setFirearms] = useState<Firearm[]>([])
   const [total, setTotal] = useState<number>(0)
+
   const [createModalOpen, setCreateModalOpen] = useState(false)
   const [editingFirearm, setEditingFirearm] = useState<Firearm | null>(null)
   const [deletingId, setDeletingId] = useState<number | null>(null)
@@ -48,9 +62,18 @@ export default function FirearmsPage() {
     setTotal(pagedData.totalElements)
   }, [page, typeFilter])
 
+  const [expandedId, setExpandedId] = useState<number | null>(null);
+
+
+
+
   useEffect(() => {
     void loadFirearms()
   }, [loadFirearms])
+  useEffect(() => {
+    window.scrollTo({ top: 0, behavior: 'smooth' });
+  }, [page]);
+
 
   async function handleDelete(firearm: Firearm) {
     setDeletingId(firearm.id)
@@ -68,9 +91,9 @@ export default function FirearmsPage() {
       setDeletingId(null)
     }
   }
-
   return (
     <>
+      <ConfigProvider theme={darkTheme}>
         <div className="mb-4 flex flex-col gap-3 sm:flex-row sm:items-center sm:justify-between">
           <div>
             {user && (
@@ -98,9 +121,10 @@ export default function FirearmsPage() {
         <div className="mb-6">
           <Row gutter={[16, 16]}>
             {firearms.map((firearm) => (
-            <Col key={firearm.id} xs={24} md={12} lg={8}>
+              <Col key={firearm.id} xs={24} md={24} lg={24}>
+
                 <Card
-                title={firearm.name}
+                  className="hex-bg border-5px-#142c38"
                   extra={
                     user ? (
                       <div className="flex items-center gap-1">
@@ -122,34 +146,228 @@ export default function FirearmsPage() {
                     ) : null
                   }
                   variant="outlined"
+                  style={{
+                    height: '100%', display: 'flex', flexDirection: 'column'
+                  }}
                   styles={{
-                  header: { minHeight: 56 },
+                    root: {
+                      border: '1px solid #313131'
+                    },
+                    header: {
+                      borderBottom: '1px solid #303030',
+                    },
+                    body: {
+                      flex: 1,
+                      overflow: 'auto',
+                      padding: '12px',
+
+                    },
+                    actions: {
+                      flexShrink: 0,
+                      background: '#1e1e1e',
+                      display: 'flex'
+                    }
                   }}
                   actions={[
-                  <Link key={`mod-codes-${firearm.id}`} to={`/mod-codes?firearmId=${firearm.id}`}>
+                    <div>
-                    <Button type="link">查看改枪码</Button>
+                      <Collapse
-                  </Link>,
+                        expandIcon={() => null}
+                        styles={
+                          {
+                            root: {
+                              background: '#1e1e1e',
+                            }
+                          }
+                        }
+                        items={[{
+                          key: '1',
+                          label: (
+                            <Button
+                              variant="outlined"
+                              styles={{
+                                root: {
+                                  color: '#10E28C',
+                                  border: '1px solid #10E28C',
+                                  background: '#16343b96',
+                                  width: '20%',
+                                }
+                              }}
+                            >
+                              查看改枪码
+                            </Button>
+                          ),
+                          children: <ModCodes firearmId={String(firearm.id)} />
+                        }]}
+                      />
+                    </div>,
                   ]}>
                   <div className="flex flex-col gap-3">
-                  <div className="flex items-center justify-between">
+                    <div className="lmr-container">
-                    <Tag color="blue">{firearmTypeText[firearm.type]}</Tag>
+                      <div className="lmr-left">
+                        <div style={{
+                          display: 'flex',
+                          alignItems: 'center',
+                          gap: '12px',
+                          width: '100%'
+                        }}>
+                          <span style={{
+                            display: 'inline-block',
+                            backgroundColor: '#555555',
+                            color: 'white',
+                            padding: '4px 12px',
+                            borderRadius: '4px',
+                            fontSize: '14px',
+                            fontWeight: '500',
+                            letterSpacing: '0.5px'
+                          }}>
+                            {firearm.name}
+                          </span>
+                          <span className="flex items-center justify-between"
+                            style={{
+                              display: 'inline-block',
+                              backgroundColor: '#2d4f5796',
+                              color: 'white',
+                              padding: '4px 12px',
+                              borderRadius: '4px',
+                              fontSize: '14px',
+                              fontWeight: '500',
+                              letterSpacing: '0.5px'
+                            }}>
+                            {firearmTypeText[firearm.type]}
+
+                          </span></div>
                       </div>
-                  <Typography.Text>
+                      <div className="lmr-middle">
-                    <strong>武器输出等级：</strong>
+                        <div style={{
+                          color: 'white',
+                          padding: '4px 12px',
+                          borderRadius: '4px',
+                          fontSize: '14px',
+                          fontWeight: '500',
+                          letterSpacing: '0.5px'
+                        }}>
+                          <div style={{
+                            display: 'grid',
+                            gridTemplateColumns: 'repeat(auto-fit, minmax(100px, 1fr))', // 最小宽度160px
+                            gap: '12px',
+                          }}>
+                            {/* 武器输出等级 */}
+                            <div style={{
+                              border: '2px solid #10E28C',
+                              backgroundColor: '#16343b96',
+                              padding: '12px 16px',
+                              borderRadius: '8px',
+                              textAlign: 'center'
+                            }}>
+                              <div style={{
+                                padding: '4px 0px',
+                                borderRadius: '4px',
+                                color: '#10E28C',
+                                fontSize: '13px',
+                                fontWeight: 500,
+                                marginBottom: '6px',
+                                whiteSpace: 'nowrap',
+                                textAlign: 'center'
+                              }}>
+                                武器输出等级
+                              </div>
+                              <div style={{
+                                fontSize: '16px',
+                                fontWeight: 600,
+                                color: '#ffffff'
+                              }}>
                                 {firearm.level}
-                  </Typography.Text>
+                              </div>
-                  <Typography.Text>
+                            </div>
-                    <strong>子弹口径：</strong>
+
+                            {/* 子弹口径 */}
+                            <div style={{
+                              border: '2px solid #10E28C',
+                              backgroundColor: '#16343b96',
+                              padding: '12px 16px',
+                              borderRadius: '8px',
+                              textAlign: 'center'
+                            }}>
+                              <div style={{
+                                padding: '4px 12px',
+                                borderRadius: '4px',
+                                color: '#10E28C',
+                                fontSize: '13px',
+                                fontWeight: 500,
+                                marginBottom: '6px',
+                                whiteSpace: 'nowrap'
+                              }}>
+                                子弹口径
+                              </div>
+                              <div style={{
+                                fontSize: '16px',
+                                fontWeight: 600,
+                                color: '#ffffff'
+                              }}>
                                 {firearm.calibre}
-                  </Typography.Text>
+                              </div>
-                  <Typography.Text>
+                            </div>
-                    <strong>每秒甲伤：</strong>
+
+                            {/* 每秒甲伤 */}
+                            <div style={{
+                              border: '2px solid #10E28C',
+                              backgroundColor: '#16343b96',
+                              padding: '12px 16px',
+                              borderRadius: '8px',
+                              textAlign: 'center'
+                            }}>
+                              <div style={{
+                                padding: '4px 12px',
+                                borderRadius: '4px',
+                                color: '#10E28C',
+                                fontSize: '13px',
+                                fontWeight: 500,
+                                marginBottom: '6px',
+                                whiteSpace: 'nowrap'
+                              }}>
+                                每秒甲伤
+                              </div>
+                              <div style={{
+                                fontSize: '16px',
+                                fontWeight: 600,
+                                color: '#ffffff'
+                              }}>
                                 {asDps(firearm.fireRate, firearm.armourDamage)}
-                  </Typography.Text>
+                              </div>
-                  <Typography.Text>
+                            </div>
-                    <strong>每秒肉伤：</strong>
+
+                            {/* 每秒肉伤 */}
+                            <div style={{
+                              border: '2px solid #10E28C',
+                              backgroundColor: '#16343b96',
+                              padding: '12px 16px',
+                              borderRadius: '8px',
+                              textAlign: 'center'
+                            }}>
+                              <div style={{
+                                padding: '4px 12px',
+                                borderRadius: '4px',
+                                color: '#10E28C',
+                                fontSize: '13px',
+                                fontWeight: 500,
+                                marginBottom: '6px',
+                                whiteSpace: 'nowrap'
+                              }}>
+                                每秒肉伤
+                              </div>
+                              <div style={{
+                                fontSize: '16px',
+                                fontWeight: 600,
+                                color: '#ffffff'
+                              }}>
                                 {asDps(firearm.fireRate, firearm.bodyDamage)}
-                  </Typography.Text>
+                              </div>
+                            </div>
+                          </div>
+
+                        </div>
+                      </div>
+                      <div className="lmr-right">
                         <Typography.Paragraph
                           style={{ marginBottom: 0 }}
                           type="secondary"
@@ -166,6 +384,9 @@ export default function FirearmsPage() {
                           {firearm.review || "暂无描述"}
                         </Typography.Paragraph>
                       </div>
+                    </div>
+
+                  </div>
                 </Card>
               </Col>
             ))}
@@ -190,7 +411,6 @@ export default function FirearmsPage() {
             showSizeChanger={false}
           />
         </div>
-
         <FirearmCreateModal
           open={createModalOpen}
           onCancel={() => setCreateModalOpen(false)}
@@ -208,7 +428,10 @@ export default function FirearmsPage() {
             setEditingFirearm(null)
             void loadFirearms()
           }}
+
         />
+      </ConfigProvider>
     </>
+
   )
 }

src/page/legal/index.tsx

@@ -0,0 +1,34 @@
+import { Tabs } from "antd"
+import { useSearchParams } from "react-router-dom"
+import MarkdownRenderer from "@/components/markdown-renderer"
+import { html as EulaHtml } from "@/docs/EULA.md"
+import { html as PrivacyHtml } from "@/docs/PrivacyPolicy.md"
+
+const tabKeys = new Set(["eula", "privacy"])
+
+export default function LegalPage() {
+  const [searchParams, setSearchParams] = useSearchParams()
+  const rawTab = searchParams.get("tab")
+  const activeTab = rawTab && tabKeys.has(rawTab) ? rawTab : "eula"
+
+  return (
+    <div className="mx-auto max-w-4xl">
+      <Tabs
+        activeKey={activeTab}
+        onChange={(key) => setSearchParams({ tab: key })}
+        items={[
+          {
+            key: "eula",
+            label: "最终用户许可协议",
+            children: <MarkdownRenderer html={EulaHtml} />,
+          },
+          {
+            key: "privacy",
+            label: "隐私政策",
+            children: <MarkdownRenderer html={PrivacyHtml} />,
+          },
+        ]}
+      />
+    </div>
+  )
+}

src/page/login/index.tsx

@@ -2,7 +2,7 @@ import { useState } from "react"
 import { useNavigate } from "react-router-dom"
 import { App, Button, Card, Form, Input, Typography } from "antd"
 import { AuthApi } from "@/api"
-import { useAppDispatch } from "@/store/hooks"
+import { useAppDispatch } from "@/hooks/store"
 import { setCurrentUser } from "@/store/auth-slice"
 import { LoginRequest } from "@/types"
 
@@ -29,11 +29,11 @@ export default function LoginPage() {
   return (
     <div className="min-h-screen bg-gray-100 px-4 py-10 sm:py-16">
       <div className="mx-auto max-w-md">
-        <Card bordered={false} className="shadow-sm">
+        <Card variant="borderless" className="shadow-sm">
-          <Typography.Title level={3} className="!mb-2 text-center">
+          <Typography.Title level={3} className="mb-2! text-center">
             登录
           </Typography.Title>
-          <Typography.Paragraph className="!mb-6 text-center !text-gray-500">
+          <Typography.Paragraph className="mb-6! text-center text-gray-500!">
             使用你的帐号登录后即可继续操作
           </Typography.Paragraph>
 
@@ -54,7 +54,7 @@ export default function LoginPage() {
               <Input.Password autoComplete="current-password" placeholder="请输入密码" />
             </Form.Item>
 
-            <Form.Item className="!mb-0">
+            <Form.Item className="mb-0!">
               <Button type="primary" htmlType="submit" loading={loading} block>
                 登录
               </Button>

src/page/mod-codes/index.tsx

@@ -16,7 +16,7 @@ import { Link, useSearchParams } from "react-router-dom"
 import { ModificationApi, TagApi } from "@/api"
 import ModificationCreateModal from "@/components/modification-create-modal"
 import ModificationEditModal from "@/components/modification-edit-modal"
-import { useAppSelector } from "@/store/hooks"
+import { useAppSelector } from "@/hooks/store"
 import { Modification } from "@/types"
 
 const pageSize = 10

src/router/index.tsx

@@ -40,6 +40,10 @@ const router = createBrowserRouter(
           path: "mod-codes",
           lazy: lazy(() => import("@/page/mod-codes")),
         },
+        {
+          path: "legal",
+          lazy: lazy(() => import("@/page/legal"))
+        }
       ],
     },
     {

tailwind.config.ts

@@ -0,0 +1,10 @@
+import type { Config } from "tailwindcss"
+import typography from "@tailwindcss/typography"
+
+export default {
+  content: ["./index.html", "./src/**/*.{js,ts,jsx,tsx}"],
+  theme: {
+    extend: {},
+  },
+  plugins: [typography],
+} satisfies Config

vite.config.ts

@@ -3,10 +3,11 @@ import { defineConfig } from "vite"
 import react from "@vitejs/plugin-react"
 import tailwindcss from "@tailwindcss/vite"
 import portChecker from "vite-plugin-port-checker"
+import { Mode, plugin as markdown } from "vite-plugin-markdown"
 
 // https://vite.dev/config/
 export default defineConfig({
-  plugins: [react(), tailwindcss(), portChecker()],
+  plugins: [react(), tailwindcss(), portChecker(), markdown({ mode: [Mode.HTML, Mode.TOC] })],
   base: "/",
   build: {
     rolldownOptions: {