Skip to content

fix(composer): cover text leak below input card with background - #363

Merged
su-fen merged 2 commits into
Stack-Cairn:mainfrom
FlowerRealm:realm/fix-composer-text-leak
Aug 4, 2026
Merged

fix(composer): cover text leak below input card with background#363
su-fen merged 2 commits into
Stack-Cairn:mainfrom
FlowerRealm:realm/fix-composer-text-leak

Conversation

@FlowerRealm

@FlowerRealm FlowerRealm commented Aug 3, 2026

Copy link
Copy Markdown
Contributor

Closes #364

Problem

The composer floats as an overlay over the chat transcript. Two spots let transcript text "leak" out below the input box:

  1. The 16px strip between the card's bottom edge and the app's bottom border (pb-4). This is a scrollable transcript area with no cover, so content scrolling past it shows through underneath the input card.
  2. Through the translucent card itself — when the composer's measured height lags its actual rendered height (main thread busy during streaming), the last message gets covered by the card and shows through the frosted-glass surface.

Fix

Add two background layers that match the chat background, both pointer-events-none:

  • A 1rem-tall layer at the bottom of the composer root covering the card-bottom-to-app-bottom strip.
  • A full-card layer inside the card, behind its translucent surface.

The input box reads as visually unchanged — the extra area is same-colored as the chat background — while text no longer shows through beneath it.

最爱的图片

image image

Files

  • crates/agent-gui/src/pages/chat/components/ChatComposerBar.tsx

Verification

  • Confirmed the strip geometry (card bottom → app bottom = 16px) via the running app.
  • biome check and tsc --noEmit pass.

@StackCairn
StackCairn marked this pull request as draft August 3, 2026 01:50
@github-actions

github-actions Bot commented Aug 3, 2026

Copy link
Copy Markdown
Contributor

PR governance checks passed. Awaiting human review.

@FlowerRealm
FlowerRealm marked this pull request as ready for review August 3, 2026 01:54
@StackCairn
StackCairn marked this pull request as draft August 3, 2026 01:54
@FlowerRealm
FlowerRealm marked this pull request as ready for review August 3, 2026 01:56
The composer floats over the transcript. Content scrolling past it shows
through the 16px gap between the card's bottom edge and the app's bottom
border, so text visibly leaks out below the input box. Cover that strip
with a background-colored, pointer-events-none layer.
@FlowerRealm
FlowerRealm force-pushed the realm/fix-composer-text-leak branch from 141cf49 to 9655811 Compare August 3, 2026 02:09
@su-fen
su-fen merged commit 99d7a92 into Stack-Cairn:main Aug 4, 2026
8 checks passed
@FlowerRealm
FlowerRealm deleted the realm/fix-composer-text-leak branch August 4, 2026 00:47
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

[Bug] 对话时输入框下方漏出文字

2 participants