diff --git a/packages/dashboard/app/components/TaskChatTab.css b/packages/dashboard/app/components/TaskChatTab.css index ba41617002..f84c0ac5af 100644 --- a/packages/dashboard/app/components/TaskChatTab.css +++ b/packages/dashboard/app/components/TaskChatTab.css @@ -539,11 +539,16 @@ FN-7241 adds timestamps inside individual task-detail transcript blocks. Keep bl gap: var(--space-sm); } +/* +FNXC:TaskDetailChat 2026-07-21-23:42: +FN-8473 requires the Activity Live steering input to share the transcript panel's --radius-lg so the composer does not look sharper than the panel above it. +*/ .task-chat-input { min-height: calc(var(--space-2xl) + var(--space-sm)); max-height: var(--task-chat-composer-max-height, 40vh); resize: none; flex: 1 1 auto; + border-radius: var(--radius-lg); } /* diff --git a/packages/dashboard/app/components/__tests__/TaskChatTab.test.tsx b/packages/dashboard/app/components/__tests__/TaskChatTab.test.tsx index 88158901d9..9bbb94bc24 100644 --- a/packages/dashboard/app/components/__tests__/TaskChatTab.test.tsx +++ b/packages/dashboard/app/components/__tests__/TaskChatTab.test.tsx @@ -2776,6 +2776,21 @@ describe("TaskChatTab", () => { expect(css).not.toContain("62vh"); }); + it("matches the Activity Live composer radius to its transcript on desktop and mobile", () => { + const css = readFileSync(resolve(__dirname, "../TaskChatTab.css"), "utf8"); + const sharedStyles = readFileSync(resolve(__dirname, "../../styles.css"), "utf8"); + const transcriptRule = getCssRuleBlock(css, ".task-chat-transcript"); + const inputRule = getCssRuleBlock(css, ".task-chat-input"); + const mobileCss = getCssAfter(css, "@media (max-width: 768px)"); + const mobileInputRule = getCssRuleBlock(mobileCss, ".task-chat-input"); + const globalInputRule = getCssRuleBlock(sharedStyles, ".input,"); + + expect(getCssDeclaration(transcriptRule, "border-radius")).toBe("var(--radius-lg)"); + expect(getCssDeclaration(inputRule, "border-radius")).toBe("var(--radius-lg)"); + expect(mobileInputRule).not.toMatch(/border-radius\s*:/); + expect(getCssDeclaration(globalInputRule, "border-radius")).toBe("var(--radius-sm)"); + }); + it("positions the icon-only expand toggle as a tokenized chat-view overlay with no toolbar shell", () => { const css = readFileSync(resolve(__dirname, "../TaskChatTab.css"), "utf8"); const tabRule = getCssRuleBlock(css, ".task-chat-tab");