settings_re4

.trae/specs/settings-page-fluent-redesign/checklist.md

@@ -0,0 +1,32 @@
+# Checklist - 设置页面 Fluent 设计改造
+
+## Phase 1: 分析与准备
+
+- [ ] SettingsExpander 控件分析完成
+- [ ] 当前布局问题定位完成
+
+## Phase 2: 窗口布局调整
+
+- [ ] SettingsWindow 内容区域无额外 Border 包裹
+- [ ] 窗口整体视觉效果正常
+- [ ] 窗口圆角在不同模式下正确显示
+
+## Phase 3: 设置页面改造
+
+- [ ] AppearanceSettingsPage 无额外边框包裹
+- [ ] GeneralSettingsPage 无额外边框包裹
+- [ ] ComponentsSettingsPage 无额外边框包裹
+- [ ] PluginsSettingsPage 无额外边框包裹
+- [ ] AboutSettingsPage 无额外边框包裹
+
+## Phase 4: 视觉规范
+
+- [ ] 设置项间距统一
+- [ ] 圆角样式统一
+- [ ] 页面标题样式统一
+
+## 验证
+
+- [ ] 编译通过，无错误
+- [ ] 运行正常，设置页面可正常显示
+- [ ] 视觉效果符合 Fluent 设计风格

.trae/specs/settings-page-fluent-redesign/spec.md

@@ -0,0 +1,76 @@
+# 设置页面 Fluent 设计改造规格说明书
+
+## Why
+
+当前 LanMountainDesktop 设置页面存在以下问题：
+1. 右侧详细设置区域被额外边框包裹，未能实现 Fluent Avalonia 控件的完整填充效果
+2. 设置项未采用 Fluent 卡片设计风格，仍使用传统 Border + StackPanel 布局
+3. 与 ClassIsland 项目的视觉风格差异较大
+
+## What Changes
+
+- 移除页面内容区域的额外 Border 包裹，直接使用 ScrollViewer + StackPanel
+- 参考 ClassIsland 项目，引入 SettingsExpander 控件替代传统布局
+- 统一设置项的间距、圆角、字体等视觉规范
+- 修改窗口布局，移除内容区域的 glass-panel 样式
+
+## Impact
+
+### Affected specs
+- 设置页面 UI 布局规范
+- Fluent 设计风格适配
+
+### Affected code
+- `Views/SettingsPages/*.axaml` - 所有设置页面
+- `Views/SettingsWindow.axaml` - 设置窗口布局
+- `Styles/GlassModule.axaml` - 样式资源
+
+---
+
+## ADDED Requirements
+
+### Requirement: 设置页面 Fluent 卡片设计
+
+系统 SHALL 提供类似 ClassIsland 的 SettingsExpander 卡片式设置项。
+
+#### Scenario: 设置页面布局
+- **WHEN** 用户打开任意设置页面
+- **THEN** 页面使用 ScrollViewer 直接包裹内容，无额外 Border 包裹
+- **AND THEN** 设置项使用 SettingsExpander 或 Fluent 卡片样式
+
+### Requirement: 移除内容区域额外边框
+
+系统 SHALL 移除右侧内容区域的 glass-panel 边框包裹。
+
+#### Scenario: 内容区域无额外边框
+- **WHEN** 用户查看设置页面内容
+- **THEN** 内容直接显示在透明背景上，无额外边框包裹
+
+### Requirement: 设置项视觉规范
+
+系统 SHALL 统一设置项的视觉样式。
+
+#### Scenario: 设置项样式
+- **WHEN** 开发者创建新的设置项
+- **THEN** 使用统一的间距（Spacing）、圆角、字体大小
+- **AND THEN** 参考 ClassIsland 的 SettingsExpander 样式
+
+---
+
+## MODIFIED Requirements
+
+### Requirement: 设置页面布局结构
+
+**当前**: Border → ScrollViewer → Border → StackPanel → 内容
+
+**修改后**: ScrollViewer → StackPanel → 设置项（无额外 Border）
+
+---
+
+## REMOVED Requirements
+
+### Requirement: 传统 Border 包裹布局
+
+**Reason**: 实现 Fluent 设计风格，移除视觉噪音
+
+**Migration**: 将现有 Border 包裹改为直接内容布局

.trae/specs/settings-page-fluent-redesign/tasks.md

@@ -0,0 +1,51 @@
+# Tasks - 设置页面 Fluent 设计改造
+
+## Phase 1: 分析与准备
+
+- [ ] Task 1.1: 分析 ClassIsland SettingsExpander 控件实现
+  - [ ] 查看 ClassIsland.Core 中的 SettingsExpander 定义
+  - [ ] 分析样式模板和视觉效果
+  - [ ] 确定是否需要自定义控件或使用现有替代方案
+
+- [ ] Task 1.2: 分析当前设置页面布局问题
+  - [ ] 定位右侧内容区域的 Border 包裹代码
+  - [ ] 分析 glass-panel 样式对布局的影响
+
+## Phase 2: 窗口布局调整
+
+- [ ] Task 2.1: 修改 SettingsWindow.axaml 内容区域布局
+  - [ ] 移除 Frame 外部的 glass-panel Border
+  - [ ] 直接使用透明背景
+  - [ ] 验证窗口整体视觉效果
+
+## Phase 3: 设置页面改造
+
+- [ ] Task 3.1: 改造 AppearanceSettingsPage 页面
+  - [ ] 移除外部的 glass-panel Border
+  - [ ] 调整内容布局为直接填充
+  - [ ] 验证视觉效果
+
+- [ ] Task 3.2: 改造 GeneralSettingsPage 页面
+  - [ ] 移除外部的 glass-panel Border
+  - [ ] 调整内容布局
+
+- [ ] Task 3.3: 改造其他设置页面
+  - [ ] ComponentsSettingsPage
+  - [ ] PluginsSettingsPage
+  - [ ] AboutSettingsPage
+
+## Phase 4: 视觉规范统一
+
+- [ ] Task 4.1: 统一设置项间距和圆角
+  - [ ] 定义统一的 Spacing 值
+  - [ ] 统一圆角大小
+
+- [ ] Task 4.2: 优化页面标题区域样式
+  - [ ] 调整 Page Header 字体大小
+  - [ ] 优化 Description 样式
+
+## Task Dependencies
+- Task 1.2 依赖 Task 1.1
+- Task 2.1 依赖 Task 1.2
+- Task 3.x 依赖 Task 2.1
+- Task 4.x 依赖 Task 3.x