root/fusion
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

FN-8473: align Activity Live composer radius

Browse Source 
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) <noreply@runfusion.ai>
This commit is contained in:
gsxdsm
2026-07-21 23:53:52 -07:00
parent ceaf0cc996
commit 06a49998f5
2 changed files with 20 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

5
packages/dashboard/app/components/TaskChatTab.css
View File

@@ -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);
}
/*

15
packages/dashboard/app/components/__tests__/TaskChatTab.test.tsx
View File

@@ -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");