diff --git a/apps/ai-game-creator-shell/src/styles.css b/apps/ai-game-creator-shell/src/styles.css index d2de3cd8b..89cdff927 100644 --- a/apps/ai-game-creator-shell/src/styles.css +++ b/apps/ai-game-creator-shell/src/styles.css @@ -11526,14 +11526,15 @@ button.design-workspace-tree__entry:hover, .project-chat-composer-strength-range::-webkit-slider-runnable-track { height: 6px; border-radius: 999px; - /* 已选段一直铺到圆钮右缘(`--strength-ratio` 是无单位档位比例,20px = 圆钮直径), - 圆钮右缘之外才是未选段;`calc` 让两端在任意轨道宽度下都对齐。 */ + /* 已选段终点 = **圆钮中心**(`--strength-ratio` 是无单位档位比例;圆钮中心 = + 10px + ratio * (100% - 20px),两端各留一个圆钮半径)。原先终点写成 20px + …(= 圆钮 + **右缘**),亚像素 / 圆角 / 描边一有误差就在圆钮右侧露出一小截橙色。 */ background: linear-gradient( to right, var(--platform-accent) 0 - calc(20px + var(--strength-ratio, 0) * (100% - 20px)), + calc(10px + var(--strength-ratio, 0) * (100% - 20px)), var(--platform-subpanel-border) - calc(20px + var(--strength-ratio, 0) * (100% - 20px)) 100% + calc(10px + var(--strength-ratio, 0) * (100% - 20px)) 100% ); } diff --git a/apps/ai-game-creator-shell/tests/chatDialogFrameLayout.test.ts b/apps/ai-game-creator-shell/tests/chatDialogFrameLayout.test.ts index 0879bb33e..5b9f2d2f6 100644 --- a/apps/ai-game-creator-shell/tests/chatDialogFrameLayout.test.ts +++ b/apps/ai-game-creator-shell/tests/chatDialogFrameLayout.test.ts @@ -429,6 +429,19 @@ describe('陶泥儿对话区:Codex 三段式(顶栏 / 唯一滚动区 / 文 expect(sectionPadding.right).toBe(0); expect(sectionPadding.top).toBe(4); expect(sectionPadding.bottom).toBe(2); + + // 已选段终点必须与**圆钮中心**重合(`10px + ratio * (100% - 20px)`):写成 `20px + …` + // (= 圆钮**右缘**)时圆钮右侧会露出一小截橙色(4× 设备像素实拍对照见 PR)。 + const track = desktopDeclarations( + `${STRENGTH_RANGE}::-webkit-slider-runnable-track`, + ); + const trackBackground = declaration(track, 'background'); + expect(trackBackground).toContain( + 'calc(10px + var(--strength-ratio, 0) * (100% - 20px))', + ); + expect(trackBackground).not.toContain( + 'calc(20px + var(--strength-ratio, 0) * (100% - 20px))', + ); }); it('窄屏(390px)输入盒仍在文档流、四周有边距,列表底部没有留白', () => {