Skip to content

style(shell): 收紧外壳、侧栏与输入框样式(超椭圆输入框与弹出菜单统一) - #223

Merged
lioensky merged 1 commit into
lioensky:mainfrom
RoxyAsahi:pr/zcode-shell-chrome
Oct 2, 2026
Merged

lioensky merged 1 commit into
lioensky:mainfrom
RoxyAsahi:pr/zcode-shell-chrome

Conversation

@RoxyAsahi

@RoxyAsahi RoxyAsahi commented Oct 2, 2026 •

Copy link
Copy Markdown
Contributor

概述

主界面外壳的视觉收紧:顶部标签、侧栏列表、聊天标题栏和输入框统一走 ui-system 令牌,(28px 图标按钮、16px 图标、36px 列表行)。纯样式改动,不涉及功能逻辑;基于最新 main(2f711150),只有一个提交。通知中心等改动不在本 PR,会另开。

改动内容

  • 输入框:28px 超椭圆圆角卡片,四周 8px 内边距,左下「+」和右下发送按钮与卡片圆角同心;发送按钮 34px,单行输入高度 36px,左侧工具按钮间距 8px。
  • 输入框弹出菜单:「+」/发送键右键打开的高级回复面板、模型选择器,与输入框共用底色、细边框和超椭圆圆角,硬投影换成柔和浮起阴影;菜单内列表项圆角 12px,与 16px 外角同心。模型选择器改为在输入框上方 4px 弹出、右沿对齐,不再遮挡正在输入的内容。
  • 高级回复面板开关(亮色主题):开关轨道带 1px 边框后圆点没有居中(上 3px、下 1px),现修正为四边各 2px。
  • 聊天标题栏:标题下分割线改为 5% 透明度细线;语音聊天按钮移到其他操作按钮旁,图标改为 16px;「新建话题」图标重新居中。
  • 侧栏与顶部标签:列表行高、头像、圆角、悬停/选中态,去掉多余投影;底部账户按钮与设置按钮同步调整。

modules/chatManager.js 只有一行:语音按钮的 display 由 inline-block 改为 inline-flex,与标题栏其他按钮一致(next-delta-shared-baseline.json 同步更新该文件的哈希)。

corner-shape: superellipse() 只在支持的 Chromium 版本生效,不支持时退回普通圆角。

测试

  • 本地在亮色主题下实测:输入框高度、按钮位置、各弹出菜单的间距/圆角/边框/阴影、开关圆点位置。
  • 与 main 对比运行 check:ui-system(含其全部子检查)、check:uiux、test:uiux、test:chat-kernel、check:chat-contracts、check:settings-ownership、test:appearance-engine、test:ui-system 等:结果与 main 完全一致,本 PR 未引入新的失败。
  • 已知失败均在 main 上已存在:缺少 preloads/shared/catalog.js(guard:next-delta)、聊天事件图过期、group-slots.js 内联样式、设置控件归属检查、侧栏玻璃效果断言。
  • 暗色主题尚未逐项截图核对。

🤖 Generated with Claude Code

Restyle the top tabs, sidebar lists, chat header and composer on the
shared ui-system tokens, following ZCode's sizing (28px icon buttons,
16px glyphs, 36px list rows).

- Composer: 28px superellipse card with 8px insets, so the round + and
  send buttons sit concentric with its corners; 34px send button, 36px
  single-line text box, 8px gap between the left-hand tools.
- Menus that open from the composer (advanced reply via + or send
  right-click, model picker) share the card's fill, hairline border,
  superellipse corner and a soft lift instead of a hard drop shadow; the
  model menu opens 4px above the card, flush with its right edge.
- Light theme: the advanced-reply mini switch knob is centred in its
  bordered track (it sat 3px from the top and 1px from the bottom).
- Chat header: 5% hairline divider, voice chat button moved beside the
  other actions with a 16px icon, "create topic" glyph re-centred.

No behaviour changes; chatManager only switches the voice button's
display to inline-flex to match the header button layout.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
@RoxyAsahi
RoxyAsahi marked this pull request as ready for review October 2, 2026 14:17
@lioensky
lioensky merged commit a85f477 into lioensky:main Oct 2, 2026
1 check failed
lioensky added a commit that referenced this pull request Oct 2, 2026
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants