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

FN-6020: align chat stop button size with send button

Browse Source 
Align the chat stop button sizing with the send control and lock it with CSS coverage.

- set \.chat-input-stop width and height to 36px to match \.chat-input-send
- add a ChatView autosize test that asserts send and stop button dimension parity

Files changed:
 packages/dashboard/app/components/ChatView.css               |  4 ++--
 .../__tests__/ChatView.chat-input-autosize.test.tsx          | 12 ++++++++++++
 2 files changed, 14 insertions(+), 2 deletions(-)

Fusion-Task-Id: FN-6020

Fusion-Task-Lineage: d429f847-c32a-4fab-b214-215d8854ed5c
This commit is contained in:
gsxdsm
2026-06-08 12:09:48 -07:00
parent 40c0048f72
commit 8d2f43892c
2 changed files with 14 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
packages/dashboard/app/components/ChatView.css
View File

@@ -1499,8 +1499,8 @@
}
.chat-input-stop {
width: calc(var(--space-xl) * 2);
height: calc(var(--space-xl) * 2);
width: 36px;
height: 36px;
border-radius: var(--radius-md);
border: none;
background: color-mix(in srgb, var(--color-error) 15%, transparent);

12
packages/dashboard/app/components/__tests__/ChatView.chat-input-autosize.test.tsx
View File

@@ -15,6 +15,18 @@ describe("ChatView chat input autosize", () => {
expect(textareaRule?.[0]).toContain("overflow-y: hidden");
});
it("keeps the stop button dimensions aligned with the send button", () => {
const sendRule = chatViewCss.match(/\.chat-input-send\s*\{[^}]*\}/);
const stopRule = chatViewCss.match(/\.chat-input-stop\s*\{[^}]*\}/);
expect(sendRule).not.toBeNull();
expect(stopRule).not.toBeNull();
expect(sendRule?.[0]).toContain("width: 36px");
expect(sendRule?.[0]).toContain("height: 36px");
expect(stopRule?.[0]).toContain("width: 36px");
expect(stopRule?.[0]).toContain("height: 36px");
});
it("clamps oversized textarea growth to the new max height", () => {
expect(clampChatInputHeight(600)).toBe(600);
expect(clampChatInputHeight(800)).toBe(640);