[teoaliano]

Problem

When an agent asks a question, the banner above the composer looked uneven. The header text sat low in its row (10px above, 4px below), the sides had 26px of padding against roughly 4px everywhere else, the hover background had fully rounded bottom corners pressed against the composer, and the expanded question had more space above it than below.

Change

All changes are scoped to the question banner; the other composer banners are untouched.

• Header row: removed the top-only padding so the 24px row centers the text (4px above and below at desktop widths), and cut the side padding from 16px to 8px. Text now starts 18px from the edge instead of 26px.
• Expanded body: reduced its start/end padding by the same 8px so the question and options stay aligned with the header.
• Hover background: bottom corners are 4px (rounded-b-sm) instead of 12px; top corners keep the shared radius.
• Banner container: bottom padding is 3px instead of 4px. The banner's 1px outline sits inside its padding on the top and sides, but at the bottom the visible line is the composer's border, so the bottom read 1px larger.
• Question: top padding 4px instead of 8px, so the gap from the header to the question (17.5px of visible space) is no larger than the gap from the question to the first option (20px).

Scope and approval

A small visual fix to one existing component, with no behavior change and no prior issue.

Verification

Checked in the web client with the Replay (dev) provider's question scenario at 1280px wide, measuring element boxes and screenshot pixels for each value above. vp run check:changed passes. Under 640px the row and its buttons stay 28px for touch targets, so the gaps there are 6px.

Collapsed, hovered

Before	After

Expanded

Before	After

Made with Claude Opus 5.5 in Claude Code, run from T3 Code.

🤖 Generated with Claude Code

[macroscopeapp]

Approvability

Verdict: Approved at 4b203be

Macroscope's review found this PR approvable — This change evens out spacing and adjusts button corners in the pending-question banner above the composer. Its effects are limited to presentation, with no changes to question handling or product defaults.

^{You can add or adjust custom eligibility rules. Learn more.}

[coderabbitai]

No actionable comments were generated in the recent review.

Walkthrough

The pending-user-input banner and panel receive spacing and padding class changes. No behavior or public declarations change.

Changes: Pending user input spacing

Layer / File(s)	Summary
Banner and panel spacing apps/web/src/components/chat/ChatComposer.tsx, apps/web/src/components/chat/ComposerPendingUserInputPanel.tsx	The banner adds bottom padding. The trigger uses less horizontal padding and gains a rounded lower edge when rendered as a button. The question body uses less inline padding, and its Markdown content gains top padding.

Estimated code review effort: 1 (Trivial) | ~5 minutes

Change: Bug fix

Possibly related issues

• pingdotgg/t3code#27196: The issue concerns the pending-question card layout, but this change does not claim to fix the reported feedback loop.

Possibly related PRs

• pingdotgg/t3code#24837: Changes spacing in ComposerBanner.Root and ComposerBanner.Body, which overlap with this change's banner layout.
• pingdotgg/t3code#13397: Changes banner and panel styling in the same components.
• pingdotgg/t3code#23855: Redesigns ComposerPendingUserInputPanel and adds web layout tests for the same UI.

Suggested labels: bugfix

Suggested reviewers: maria-rcks

Merge Risk: Minimal · up to ac975

This is a visual spacing and corner-radius adjustment to the question banner above the composer, with no behavior change. The author reports the relevant checks passed, and no merge-blocking risk remains.

Pre-merge checks: 4

Check name	Status	Explanation
Title check		The title clearly and concisely identifies the web question banner spacing fix and uses the required conventional format.
Description check		The description includes all required sections. It explains the problem, the scoped changes, the small-fix approval rationale, focused verification results, and before/after UI screenshots.
Linked Issues check		Check skipped because no linked issues were found for this pull request.
Out of Scope Changes check		Check skipped because no linked issues were found for this pull request.

Finishing Touches

Generate unit tests (beta)

• Create a new PR

• Autofix · Keep fixing CodeRabbit findings and required CI, and resolving merge conflicts

Recent review info

Run configuration

• Source mode: Auto
• Repository: pingdotgg/t3code
• Branch: main
• File: .coderabbit.config.ts
• Commit: b883156
• Layers: Repository TS config
• Review profile: CHILL
• Plan: Advanced
• Run ID: 26dd63b4-f1ba-4bb0-9abe-ed850237ae39

Commits

Reviewing files that changed from the base of the PR and between 4b203be and ac975ff.

Files selected for processing: 2

• apps/web/src/components/chat/ChatComposer.tsx
• apps/web/src/components/chat/ComposerPendingUserInputPanel.tsx

Files skipped from review as they are similar to previous changes: 2

• apps/web/src/components/chat/ChatComposer.tsx
• apps/web/src/components/chat/ComposerPendingUserInputPanel.tsx

Included review availability: This review used your included allowance. Your plan provides up to 10 included reviews per hour; 9 remain after this review.

[maria-rcks]

Note

Written by claude-opus-5-5 on behalf of Maria

Merged with main and re-verified

head is now ac975fff65, a merge commit of current main (b883156e26). no rebase.

• ComposerPendingUserInputPanel.tsx conflicted with fix(web): question panel header text sits centered in its row #34095, which set the header trigger to px-4 py-1.5 and the question text to pt-0.5. i kept this pr's px-2 trigger and pt-1 text, since those are the change under review. ChatComposer.tsx merged cleanly.
• the diff against main is still the same two files, +8/-4.
• blacksmith vp run check:changed github/main passed: format, lint, knip, typecheck of 2 packages, 6 browser tests, react compiler.
• re-captured on the merged head with a real claude AskUserQuestion turn in the dev web app at 1280x900, header hovered. on main the trigger is 36px tall with 6px 16px padding and 12px corners. on this head it is 24px with 0 8px padding and 4px bottom corners.

before, main, light:

after, merged head, light:

before, main, dark:

after, merged head, dark:

collapse, expand, choose preview, and receive the provider reply, recorded on the previous head 4b203be675:

Not verified

the interaction round-trip and the 390px layout were not re-run after the merge. native ios/android clients, electron shell, macos/windows, and remote/relay/tunnel connections were not exercised on this linux vm.