fix:基本实现相关功能

THEME.md

@@ -0,0 +1,48 @@
+## 🎨 风格定义：AI-Native 精致极简主义 (AI-Native Refined Minimalism)
+
+### 1. 核心视觉特征 (Core Visuals)
+
+* **主色调 (Brand Color):** `#7816ff` (电光紫)。用于主按钮、进度条、激活态指示和关键 Tag。
+* **背景色 (Background):** 页面底色为 `#FAFAFB` (极浅灰蓝)，卡片背景为纯白 `#FFFFFF`。
+* **边框与投影 (Border & Shadow):** * 边框使用极淡的 `slate-100` (`#f1f5f9`)。
+* 投影使用微弱的柔和阴影：`shadow-sm` (用于静止) / `shadow-md` (用于悬浮)。
+
+
+* **圆角 (Border Radius):** 统一的大圆角设计。卡片 `12px - 16px` (rounded-xl)，按钮 `8px` (rounded-lg) 或全圆角 (round)。
+
+### 2. 排版与字体 (Typography)
+
+* **层级感:** 标题使用 `text-slate-800` (深灰而非纯黑)，副标题/正文使用 `text-slate-500`。
+* **辅助文本:** 习惯使用 `text-[10px]` 或 `text-[11px]` 的小字号配合 `font-bold` 或 `uppercase` (全大写) 来营造科技感和精致感。
+* **留白:** 强调“呼吸感”，间距多使用 Tailwind 的 `p-6` 或 `gap-4`。
+
+---
+
+## 📝 通用生成提示词 (Master Prompt)
+
+**你可以直接复制以下这段话作为后续请求的开头：**
+
+> **Role:** 你是一位精通现代 AI 产品 UI/UX 的前端专家。
+> **Style Requirements:** 请基于以下风格指南生成 [此处填入页面名称，如：用户设置页]：
+> 1. **配色方案:** 背景使用 `#FAFAFB`，组件使用纯白，强调色统一使用紫色 `#7816ff`。
+> 2. **UI 元素:** 采用轻量化卡片流风格。卡片需有 `border-slate-100` 边框和微弱阴影 `shadow-sm`。
+> 3. **交互感:** 鼠标悬浮时应有轻微位移 (translate-y) 和投影增强。
+> 4. **组件库:** 使用 **Arco Design Vue** 组件，并使用 **Tailwind CSS** 进行样式微调。
+> 5. **图标:** 使用 **IconPark** 或 **Lucide** 风格的线性图标，粗细一致。
+> 6. **排版:** 字体避开纯黑，使用 `slate-800`。关键数据或状态使用小字号、高粗细的精致排版。
+>
+>
+> **Task:** [描述你具体的页面功能需求]
+
+---
+
+## 🏗️ 常用 UI 组件代码片段 (Style Snippets)
+
+如果你需要手动编写，请参考这些“灵魂”代码：
+
+* **卡片 Hover 效果:**
+  `class="bg-white border border-slate-100 shadow-sm hover:shadow-md hover:-translate-y-1 transition-all duration-300 rounded-xl"`
+* **左侧激活指示条:**
+  `class="absolute left-0 top-1/2 -translate-y-1/2 w-1 h-6 bg-[#7816ff] rounded-r-full"`
+* **精致小标签 (Tag):**
+  `class="text-[10px] px-2 py-0.5 rounded-full border border-[#7816ff] text-[#7816ff] font-bold bg-purple-50"`