diff --git a/packages/dashboard/app/components/TaskChatTab.css b/packages/dashboard/app/components/TaskChatTab.css index 839257f0f8..de32654e2f 100644 --- a/packages/dashboard/app/components/TaskChatTab.css +++ b/packages/dashboard/app/components/TaskChatTab.css @@ -335,7 +335,12 @@ FN-6425 requires the chat expand control to stay inside the chat view as an icon flex: 1 1 auto; } +/* +FNXC:TaskDetailChat 2026-06-16-19:45: +FN-6507 requires the Task Detail chat send glyph to scale with the larger square touch target on desktop and mobile. Override only this button's global .btn-icon size so Send and Loader2 stay visually proportional without changing the tap box or sibling chat send buttons. +*/ .task-chat-send { + --btn-icon-size: var(--space-lg); flex: 0 0 auto; display: inline-flex; align-items: center; @@ -422,6 +427,7 @@ FN-6425 requires the chat expand control to stay inside the chat view as an icon } .task-chat-send { + --btn-icon-size: var(--space-lg); inline-size: calc(var(--space-2xl) + var(--space-sm)); min-inline-size: calc(var(--space-2xl) + var(--space-sm)); } diff --git a/packages/dashboard/app/components/__tests__/TaskChatTab.test.tsx b/packages/dashboard/app/components/__tests__/TaskChatTab.test.tsx index 56212f0b09..2c6bf0eea5 100644 --- a/packages/dashboard/app/components/__tests__/TaskChatTab.test.tsx +++ b/packages/dashboard/app/components/__tests__/TaskChatTab.test.tsx @@ -1686,6 +1686,23 @@ describe("TaskChatTab", () => { expect(mobileJumpRule).toContain("min-block-size"); }); + it("scales the task chat send glyph without shrinking the desktop or mobile touch target", () => { + const css = readFileSync(resolve(__dirname, "../TaskChatTab.css"), "utf8"); + const sendRule = getCssRuleBlock(css, ".task-chat-send"); + const mobileCss = getCssAfter(css, "@media (max-width: 768px)"); + const mobileSendRule = getCssRuleBlock(mobileCss, ".task-chat-send"); + + expect(sendRule).toContain("--btn-icon-size: var(--space-lg)"); + expect(sendRule).not.toContain("--btn-icon-size: var(--icon-size-md)"); + expect(sendRule).toContain("inline-size: calc(var(--space-2xl) + var(--space-sm))"); + expect(sendRule).toContain("min-inline-size: calc(var(--space-2xl) + var(--space-sm))"); + expect(sendRule).toContain("block-size: calc(var(--space-2xl) + var(--space-sm))"); + expect(sendRule).toContain("min-block-size: calc(var(--space-2xl) + var(--space-sm))"); + expect(mobileSendRule).toContain("--btn-icon-size: var(--space-lg)"); + expect(mobileSendRule).toContain("inline-size: calc(var(--space-2xl) + var(--space-sm))"); + expect(mobileSendRule).toContain("min-inline-size: calc(var(--space-2xl) + var(--space-sm))"); + }); + it("keeps mobile breakpoint scaffolding for the transcript, composer, and collapsible groups", () => { const css = readFileSync(resolve(__dirname, "../TaskChatTab.css"), "utf8"); const sendRule = getCssRuleBlock(css, ".task-chat-send");