67292f9fd3
feat(chat): 扩展极简模式工具分类显示映射
2026-07-10 14:03:06 +08:00
2264a86851
feat(chat): 极简模式摘要行改为单行渐变+工具统计总结
2026-07-07 16:45:59 +08:00
737c4d61a2
fix(chat): 修复流式代码块闪烁、复制错位及数学公式实时多行渲染
...
- 将聊天消息中的代码块提取为独立 Vue 组件,稳定 key 避免流式输出时重建
- 代码块复制按钮直接复制当前组件内容,全局复制逻辑改为按容器查找
- 预处理 LaTeX 公式占位符并在组件 onUpdated 中实时渲染,支持多行 49888...49888
- 公式块过长时提供横向滚动,渲染后主动追底避免滚动锁定失效
2026-06-27 23:11:09 +08:00
edb557bdd3
feat(chat): 优化块展开/折叠滚动锚定,避免 stick-to-bottom 弹簧追底顿挫
2026-06-17 15:24:15 +08:00
4bf0733907
feat: add minimal tool reel animation
2026-06-07 14:59:44 +08:00
d095531bb8
refactor(frontend): unify chat content rail alignment
...
Normalize the chat content rail around the input composer as the width baseline. This introduces shared rail variables, compensates message content for the actual scrollbar gutter, and separates mobile/webview behavior so desktop, mobile web, and app shell layouts stay centered consistently.
Align assistant text, markdown blocks, tables, minimal-mode summaries, expanded minimal steps, slash/runtime/git floating UI, and brief-message separators to the same horizontal rail. Remove the collapsed right resize handle and mobile menu glow while preserving the intended percentage widths for floating composer affordances.
Validation: npm run build --silent 2>&1 | tail -n 5
2026-06-07 01:55:20 +08:00
b4030c386e
refactor(frontend): 颜色 token 系统两层重构 + 三主题填色 + 去半透明
...
将前端配色从散落的硬编码/双命名体系(--claude-* / --theme-*)重构为
两层 token 结构(原始层 + 中性语义层),并按"经典抄 Claude、浅色抄
ChatGPT、深色自研"的定位完成三主题填色,同时建立 stylelint 防回退栏杆。
代码大量由 AI 生成的历史遗留配色问题(同语义多值、跨主题塌缩、强调色
撞文字色、fallback 第二真相源等)在此一并收口。
== 一、Token 结构重构(_tokens.scss)==
- 重写为两层:原始层 + 语义层;组件只引用中性语义名
(--surface-* / --text-* / --border-* / --accent* / --state-* 等)。
- --claude-* / --theme-* 降级为兼容别名(41 个转发),迁移完成后删除。
- 三主题(classic / light / dark)+ 首屏回退(:root:not([data-theme]),
与经典同值)全部补齐,结构对齐、不再缺项。
== 二、三主题填色 ==
- 经典 = Claude 官网亮色盘:暖奶油表面阶梯
canvas #faf9f5 < soft #f5f0e8 < card #efe9de < cream-strong #e8e0d2
< 纯白浮起;文字 #141413;hairline #e6dfd8;暖橙 primary #cc785c。
- 浅色 = ChatGPT 亮色盘:冷白 #ffffff / 侧栏 #f9f9f9 / 嵌套 #f3f3f3,
中性灰文字,近黑 primary #181818。
- 深色 = 自研中性灰阶,本轮完全不动(原样保留)。
- 修复塌缩 bug:强调色在 light/dark 原被误填成灰(CTA 失去品牌色),
现统一回品牌 primary;light 表面原全塌成 #ffffff(过于平面),
现按灰阶拉开层次。
- 强调色克制(CTA-only voltage):primary 仅用于发送按钮/logo 等极少
数处;hover / 选中 / 运行态一律走中性灰(运行态指示器从 amber 改灰)。
- 对话区背景从纯白改为暖奶油 canvas;个人空间下拉菜单、git 状态条、
二级菜单等收口到统一语义色。
== 三、全面去半透明 ==
- 所有实体面板/二级菜单背景改为不透明(surface token 由半透明白改实色,
--mobile-menu 三亮色主题改实色)。
- 移除已不透明面板上失效的 backdrop-filter 磨砂(移动端菜单、右键菜单、
模型模式下拉等)。
- 遮罩 scrim(--overlay-scrim)与刻意玻璃质感装饰保留半透明。
== 四、块展开底色统一 ==
- 思考/工具块展开区底色统一为对话背景色:.collapsible-block 及其 header
背景由 --surface-soft 改 transparent,与堆叠块(stacked-block)一致,
消除"单块奶油底 vs 多块透明"的不一致。
== 五、布局修复 ==
- 工作区隐藏后残留空白:.workspace-panel--collapsed 补 flex-basis:0 +
width/min-width:0,修正 flex-basis:auto 被子元素内容宽度撑开导致内联
width:0 失效、collapsed 后仍占 ~300px 的问题。
== 六、防回退栏杆(新增)==
- 新增 .stylelintrc.cjs:三条规则拦截裸 hex / rgb()|hsl() 字面色 /
var(--x, fallback) 兜底 / prefers-color-scheme;存量未清理文件用
BASELINE_EXEMPT 临时豁免(现仅剩 5 个 admin 页面,本轮按用户要求不处理),
清理一个移除一个、不再回退。
- package.json:build 脚本接入 stylelint(tsc → stylelint → vite),
新增 lint:css 脚本及 stylelint/postcss-scss/postcss-html 依赖。
- 修复 25 处 \!important 笔误(zsh 历史扩展污染导致的无效 CSS)。
== 七、辅助脚本(新增 scripts/)==
- lint_check.py:Node 环境不可用时的 stylelint 替身(复刻三规则 + 括号
校验,支持多行声明检测)。
- color_map.py:硬编码色 → token 反查,判定可映射/野色。
- strip_fallback.py:安全剥离已定义 token 的冗余 fallback。
== 八、文档 ==
- CLAUDE.md / AGENTS.md 前端设计规范更新:颜色规则扩写为三主题定位 +
两层 token + 表面层次 + 强调色克制 + color-mix 派生 + stylelint 栏杆;
新增"实体面板禁止半透明"规则;"禁止边缘光晕"补充"仅在用户明确允许
或要求时才可使用"。
注:前端构建验证(npm run build / lint:css)由用户本机完成;AI 工具
上下文 Node v24 段错误无法运行 node/npm/vite/stylelint。
Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
2026-06-06 16:20:58 +08:00
469e804e38
fix(frontend): 工具块展开内部滚动条样式统一,滚动槽透明
...
- MinimalBlocks 思考内容(.thinking-content)补全自定义滚动条
- ToolAction 结构化显示三类滚动区(content/diff/code/output pre)统一样式
- 参考 git 状态侧边栏滚动条:10px 圆角胶囊滑块、半透明主题色
- 滚动槽(track)设为透明,贴合工具块灰色底色,避免明显槽体
- 颜色走 --claude-*/--theme-* 变量,三模式自适应
Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
2026-06-01 21:07:11 +08:00
4124faa040
feat(frontend): 优化聊天界面与监控交互体验
2026-04-10 14:34:18 +08:00
b29e6a67f8
fix: keep compression toast persistent and align summary layout
2026-04-06 17:09:36 +08:00
6f2f854f6d
fix: refine mobile assistant content spacing
2026-04-05 21:25:01 +08:00
a5412dae34
fix: adjust sub-agent notice spacing in minimal mode
2026-04-05 16:58:22 +08:00
dc60c7a123
feat: animate minimal summary text with color wave
2026-04-05 01:22:37 +08:00
0c213b0a9f
feat: polish minimal summary loader interactions
2026-04-04 20:52:50 +08:00
3b710020fe
feat(chat): add randomized summary loaders in minimal mode
2026-04-04 19:47:17 +08:00
b9df354808
fix: 修复极简模式思考内容与SVG图标对齐问题
...
- 使用相对单位调整思考内容的垂直对齐
- 添加负margin-top让第一行文字中心与SVG图标中心对齐
- 计算公式:(1em - 1.7em) / 2,基于line-height自动适配
- 不影响工具步骤的对齐(工具header的line-height为1)
Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
2026-04-04 16:38:56 +08:00
c26cd3d3fd
fix: 修复极简模式多个问题并恢复偏好设置自动应用
...
- 修复极简模式下步骤竖线距离SVG不均匀的问题
- 使用flex布局让竖线自动填充空间
- 添加负margin让竖线延伸到下一个步骤
- 确保竖线上下距离SVG图标相等
- 修复SVG图标颜色问题
- 统一使用灰色(--claude-text-tertiary)
- 不再受颜色模式影响
- 修复思考内容自动滚动问题
- 添加registerThinkingRef和handleThinkingScroll支持
- 移除导致滚动异常的伪元素负margin
- 实现与堆叠模式一致的自动滚动行为
- 修复轮询改造后偏好设置不自动应用的问题
- 在loadInitialData中应用默认模型和运行模式
- 在createNewConversation前应用偏好设置
- 在loadConversation前应用偏好设置
- 确保新建或切换对话时使用用户设置的默认值
Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
2026-04-04 16:18:15 +08:00
a030ff954b
fix: 修复工具增强显示的多个问题
...
1. read_file 工具支持三种模式显示
- read 模式:显示完整文件内容
- search 模式:显示搜索匹配项和行号
- extract 模式:显示提取的多个片段
2. edit_file 工具兼容新旧数据格式
- 支持 old_string/new_string 格式(当前后端使用)
- 支持 replacements 数组格式(为未来扩展预留)
3. write_file 工具显示写入内容
- 显示完整的写入内容
- 使用绿色+号样式(与 edit_file 一致)
- 支持显示追加模式标识
4. 极简模式工具图标匹配修复
- 修复所有工具图标都显示为 run_command 的问题
- 使用与堆叠块模式相同的图标获取逻辑
- 正确显示每个工具对应的图标
5. 新增样式支持
- 搜索匹配项样式
- 提取片段样式
- 移除彩色侧边框,保持简洁
Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
2026-04-04 15:37:38 +08:00
321818f7ef
feat: 新增极简模式(Minimal Mode)
...
新增了一个全新的消息显示模式,提供更简洁的对话体验。
主要功能:
- 新增 MinimalBlocks.vue 组件,实现极简风格的消息块展示
- 在 ChatArea.vue 中集成极简模式渲染逻辑
- 在个性化设置中添加"极简模式"选项(blockDisplayMode)
- 支持三种显示模式:堆叠模式、极简模式、传统模式
技术实现:
- 使用 personalization store 管理显示模式状态
- 通过 computed 属性动态切换渲染组件
- 保持与现有堆叠模式和传统模式的兼容性
用户体验:
- 更清爽的界面布局
- 减少视觉干扰
- 适合快速浏览对话内容
Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
2026-04-04 14:47:45 +08:00