From 7cdbc61ffba442b5202c0274446d1fac3821376a Mon Sep 17 00:00:00 2001 From: Suzumiya Date: Thu, 24 Sep 2026 16:20:57 +0800 Subject: [PATCH] =?UTF-8?q?=E4=BF=AE=E5=A4=8D=E7=AA=97=E5=8F=A3=E5=8F=98?= =?UTF-8?q?=E7=9F=AE=E6=97=B6=E5=AF=B9=E8=AF=9D=E7=8A=B6=E6=80=81=E6=9D=A1?= =?UTF-8?q?=E8=A2=AB=E6=8C=A4=E6=89=81?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - apps/ai-game-creator-shell/src/styles.css 给 .project-chat-conversation > .project-chat-process-card 补 flex: 0 0 auto：卡片带 overflow: hidden，按 flex 规范该项自动最小尺寸归零，窗口压矮时会先被压缩（实测 300px 高挤到 33px、240px 高 24px，文字被裁），而这一列里只有消息列表该被压缩 - apps/ai-game-creator-shell/src/styles.css 把这条卡片的会话列几何规则从文件末尾移到「面板纵向布局兜底」的 flex 链旁边，内缩与不可压缩合并在同一条规则里，注释说明为什么必须是 0 0 auto - apps/ai-game-creator-shell/tests/appSurface/project-development.suite.ts 卡片契约补 flex: 0 0 auto 断言 --- apps/ai-game-creator-shell/src/styles.css | 26 +++++++++++-------- .../appSurface/project-development.suite.ts | 3 +++ 2 files changed, 18 insertions(+), 11 deletions(-) diff --git a/apps/ai-game-creator-shell/src/styles.css b/apps/ai-game-creator-shell/src/styles.css index 368ddf987..4b4ed2ebc 100644 --- a/apps/ai-game-creator-shell/src/styles.css +++ b/apps/ai-game-creator-shell/src/styles.css @@ -12282,6 +12282,21 @@ button.design-workspace-tree__entry:hover, flex: 1 1 auto; } +/* 过程卡（「陶泥儿正在处理」）渲染在消息列表**外**、紧贴输入盒上方（固定在输入框上面， + 不随消息滚走）。它不再继承消息列表的左右 16px 内缩，所以要自己补齐，才能与消息内容、 + 输入盒两侧对齐；离开列表后列表的 padding-bottom 也不再作用于它，与最后一条消息的间距 + 同样由这里给。 + `flex: 0 0 auto` 是这条链上的承重项：卡片带 `overflow: hidden`，flex 项的自动最小尺寸 + 因此归零，窗口变矮时它会先被挤扁、文字被裁掉（实测高度 300px 时压到 33px、240px 时 + 24px），而这一列里只有消息列表该被压缩。 */ +.game-workbench-chat + .project-chat-surface.is-direct-codex + .project-chat-conversation + > .project-chat-process-card { + flex: 0 0 auto; + margin: 12px 16px 8px; +} + /* ============================================================ 工具调用折叠块（2026-09）：一回合一个块，Codex 风格 ============================================================ @@ -12576,17 +12591,6 @@ button.design-workspace-tree__entry:hover, justify-content: flex-end; } -/* 过程卡（「陶泥儿正在处理」）现在渲染在消息列表**外**、紧贴输入盒上方（固定在输入框上面， - 不随消息滚走）。它不再继承消息列表的左右 16px 内缩，所以要自己补齐，才能与消息内容、 - 输入盒两侧对齐；离开列表后列表的 padding-bottom 也不再作用于它，与最后一条消息的间距 - 同样由这里给。 */ -.game-workbench-chat - .project-chat-surface.is-direct-codex - .project-chat-conversation - > .project-chat-process-card { - margin: 12px 16px 8px; -} - /* 工具调用折叠块块头改成两行：第一行图标 + 汇总（超长省略），第二行状态 + 用时，箭头右侧跨两行。 窄面板里一行塞不下（汇总会被截断、"进行中"还会折成两行），拆成两行后每段都有自己的宽度。 */ .game-workbench-chat diff --git a/apps/ai-game-creator-shell/tests/appSurface/project-development.suite.ts b/apps/ai-game-creator-shell/tests/appSurface/project-development.suite.ts index 1d5ac535f..c12e7f92b 100644 --- a/apps/ai-game-creator-shell/tests/appSurface/project-development.suite.ts +++ b/apps/ai-game-creator-shell/tests/appSurface/project-development.suite.ts @@ -6373,8 +6373,11 @@ export function registerProjectWorkbenchFoundationTests() { expect(userMessageRule).toContain('color: var(--platform-text-base);'); // 过程卡渲染在消息列表的**兄弟**位置（列表外，紧贴输入盒上方），拿不到列表的 // `padding: 14px 16px 0`，左右内缩与上下间距只能自己给：左右必须与列表的 16px 对齐。 + // 同一列里它是定高条目：窗口变矮时只有消息列表可以被压缩，卡片带 `overflow: hidden` + // 时自动最小尺寸归零，少了 `flex: 0 0 auto` 就会被挤扁、文字被裁掉。 expect(processCardRules.length).toBe(1); expect(processCardRules[0]).toContain('margin: 12px 16px 8px;'); + expect(processCardRules[0]).toContain('flex: 0 0 auto;'); }); it('enables the run presentation and renders registered images in the resource viewer', async () => {