 ludan
|
85adcdceef
|
feat: 优化记录详情对话面板布局与视觉层次
本次修改聚焦于电商记录详情页的对话面板体验打磨：
一、对话顺序优化（EcommercePage.tsx）：
- 将"新需求"跟进消息从AI回复之前移至AI回复之后
- 调整后的对话时间线：用户历史需求 → AI回复 → 用户新需求，逻辑更符合真实对话流程
二、对话面板视觉升级（ecommerce-standalone.css）：
- 对话面板宽度采用CSS变量动态控制（408-440px），视觉更宽敞
- 消息气泡区分明确：
· 用户消息：左侧缩进26-36px，蓝色调渐变背景，青色边框
· AI消息：右侧缩进26-36px，蓝调边框，中性背景
· 跟进消息：独特高亮样式，更强边框(0.24透明度)和投影
- 排版细节打磨：
· 消息标签字号12px/权重820
· 正文13px/行高1.64
· 气泡内间距15px、圆角20px、投影加深
- 元信息标签(emo)精修：28px高度、圆角胶囊样式
- 素材缩略图：46x46px、圆角14px
- 响应式适配：≤900px面板收窄至92vw，≤480px去除消息缩进
变更文件：
- src/features/ecommerce/EcommercePage.tsx (+20/-20)
- src/styles/ecommerce-standalone.css (+121)
|
2026-06-15 18:23:36 +08:00 |
|
stringadmin