From 06a49998f56bb70d70d844370c78e60c822631ff Mon Sep 17 00:00:00 2001 From: gsxdsm Date: Tue, 21 Jul 2026 23:53:52 -0700 Subject: [PATCH] FN-8473: align Activity Live composer radius MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Align the Activity Live composer with the transcript panel’s corner radius. - Apply the shared large radius token to the chat input - Cover matching desktop and mobile composer styling Files changed: packages/dashboard/app/components/TaskChatTab.css | 5 +++++ .../app/components/__tests__/TaskChatTab.test.tsx | 15 +++++++++++++++ 2 files changed, 20 insertions(+) Fusion-Task-Id: FN-8473 Fusion-Task-Lineage: 7ec5033d-f051-40d5-9cea-4d29a70632aa Co-authored-by: Fusion (runfusion.ai) --- packages/dashboard/app/components/TaskChatTab.css | 5 +++++ .../app/components/__tests__/TaskChatTab.test.tsx | 15 +++++++++++++++ 2 files changed, 20 insertions(+) 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");