style(frontend): ui-ux-pro-max 规范改造 — chat 页面 + CustomTabBar

改造内容:
- 安装 @dcloudio/uni-ui + sass,配置 easycom 自动引入 uni-icons
- 4 个 chat 页面:emoji/HTML 实体 → uni-icons 组件(跨平台兼容)
- CustomTabBar:emoji → uni-icons(chatbubble/contact/videocam/person)
  - 选中态使用 filled 变体,未选中态使用轮廓图标
- 所有可交互元素添加 :active 按压反馈 + transition (150-200ms)
- 触控目标保证 ≥ 88rpx (44px)
- input-bar/tab-bar 适配 safe-area-inset-bottom

设计规范文件:
- MASTER.md 修正为项目蓝色色板 (#2563EB) + 移动聊天应用规范
- 新增 4 个页面覆盖规范:chat-index/conversation/settings/search.md
- Pre-Delivery Checklist 全部通过
- npm run build:h5 编译验证通过

Made-with: Cursor
This commit is contained in:
bujinyuan
2026-03-03 11:23:11 +08:00
parent 143cb8aa5f
commit 35788f6d2f
13 changed files with 896 additions and 213 deletions

View File

@@ -0,0 +1,36 @@
# Chat Settings (聊天设置) Page Overrides
> **PROJECT:** EchoChat
> **Generated:** 2026-03-03 (via ui-ux-pro-max)
> **Page Type:** Detail — Conversation Settings
> ⚠️ Rules in this file **override** `design-system/echochat/MASTER.md`.
---
## Page Layout
- **结构:** User Card + Settings Groups
- **背景:** `#F1F5F9`
## User Card
- **头像:** 120rpx 居中,圆角 30rpx
- **昵称:** `34rpx` `font-weight: 600` `#1E293B`
- **卡片背景:** `#FFFFFF`,底部 `16rpx` 间距
## Settings Groups
- **组背景:** `#FFFFFF`,组间 `16rpx` 间距
- **行高:** `padding: 32rpx`,底部 `1rpx` 分隔 `#F1F5F9`
- **普通项:** 文字 `#1E293B` 30rpx + 右侧值 `#94A3B8` 26rpx
- **危险项:** 文字 `#EF4444` 30rpx
- **按压态:** `:active { background-color: #F8FAFC }`
## Operations
| 操作 | 类型 | 确认方式 |
|------|------|---------|
| 置顶/取消置顶 | 普通项 | 直接执行 + Toast |
| 清空聊天记录 | 危险项 | Modal 二次确认 |
| 删除会话 | 危险项 | Modal 二次确认 → navigateBack(delta: 2) |