[floklein]

Problem

With "Keep composer context visible" on, the row under the composer (workspace, branch) has a page-coloured glass background since #34846. That background is a full-width rectangle with square corners, flush against the rounded composer card. Over any content scrolling behind it, it shows as a hard-edged slab stuck under the card.

Change

One class change on ComposerSurface.ContextStrip: the row is now a rounded pill (rounded-xl) with a 4px gap above it. Nothing else moves. The 8px of top padding is split into a 4px margin and 4px of padding, so the labels stay where they were, and the pill's matching 4px of bottom padding is cancelled by a negative bottom margin (mt-1 -mb-1 py-1), so the row takes the same 32px in the layout and the composer card stays put. The row keeps the page-coloured glass from #34846, so it stays invisible over an empty page and labels stay readable over scrolling chat.

Scope

Fixes #36258. Presentation only, in the shared web/desktop composer. Mobile has its own UI and is not affected.

Verification

Web dev client in Chromium (T3's Browser panel) on Windows 11, fresh database, a Replay (dev) showcase thread, the setting on, dark theme, 1280x800. A gradient block is injected behind the composer to stand in for a thread image; the "before" capture is upstream main in the same state.

Before	After

Measured with getBoundingClientRect on upstream main and on this branch, same thread and viewport:

	Before	After
Composer card top / bottom	636.5 / 748	636.5 / 748
Row label top / bottom	763.64 / 772.36	763.64 / 772.36
Row background top / bottom	748 / 780	752 / 784
Row border radius	0px	12px

vp run check:changed against upstream main passes: format, lint, knip, typecheck (2 packages), React Compiler.

Not checked: light theme, custom themes, the narrow (mobile web) layout, the new-thread draft composer, the Electron desktop app, and browsers without backdrop-filter.

Created with Claude Fable 5.2 in Claude Code.

🤖 Generated with Claude Code

takeover verification

merged current main without rebasing; the final diff remains one line in one file. blacksmith check:changed passed format, lint, knip, affected typechecks and react compiler coverage. ci passed lint, build/typecheck, package tests, both web shards and all eight server shards. two independent reviewers approved head 9af840b.

chrome, 1280x800, dark theme, actual replay thread with composer context enabled: card bounds stayed y=636.5..748; strip moved from y=748 to 752 with a 12px radius and unchanged 32px height. branch picker opened successfully. no injected content was used. narrow/light capture, custom themes and native electron remain unverified in this pass.

verified by gpt-6.1-sol through codex.

[macroscopeapp]

Approvability

Verdict: Approved at 8c79802

Macroscope's review found this PR approvable — The composer context row gains rounded corners, separation from the card, and adjusted vertical padding. The change is presentation-only and introduces no material operational or data risk.

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

[coderabbitai]

No actionable comments were generated in the recent review.

Walkthrough

ContextStrip gains spacing and rounded corners. Its vertical padding changes from top-only to equal top and bottom padding.

Changes: Composer context row styling

Layer / File(s)	Summary
Context row styling apps/web/src/components/chat/ComposerSurface.tsx	ContextStrip adds a top margin, negative bottom margin, and rounded corners. Its vertical padding changes to equal top and bottom padding.

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

Change: Bug fix · Severity of issue fixed: Low

Suggested reviewers: juliusmarminge

Merge Risk: Minimal · up to 68141

This is a presentation-only tweak to the composer context row that rounds its corners and separates it from the composer card. It has no functional or data impact and is low risk to merge.

Pre-merge checks: 4

Check name	Status	Explanation
Title check		The title names the change: the context row under the composer gets rounded corners and spacing from the card. The raw summary confirms the single ContextStrip class change (rounded-xl, mt-1.5, py-1).…
Linked Issues check		Direct issue #36258 requires the context row under the composer to look rounded like the card and visually separate from it. The whole-PR diff against merge base 350753a changes one line in `Contex…
Out of Scope Changes check		The whole-PR diff against merge base 350753a changes one line in one file. The class additions (rounded-xl, mt-1, -mb-1, py-1) apply to the same row that #36258 describes, and they support …
Description check		The description follows the repository template and covers all required sections. Problem: the context row under the composer has a full-width, square-cornered glass background that reads as a hard-ed…

Full details: Title check

Explanation

The title names the change: the context row under the composer gets rounded corners and spacing from the card. The raw summary confirms the single ContextStrip class change (rounded-xl, mt-1.5, py-1). The title follows the conventional commit format and is specific enough for history scanning.

Full details: Linked Issues check

Explanation

Direct issue #36258 requires the context row under the composer to look rounded like the card and visually separate from it. The whole-PR diff against merge base 350753a changes one line in ContextStrip in apps/web/src/components/chat/ComposerSurface.tsx. At head the class string adds rounded-xl (meets the rounded requirement) and mt-1 (a 4px gap above the row, which meets the separation requirement). The row keeps surface-glass. The head also adds -mb-1 and changes pt-2 to py-1. The PR description states mt-1.5, a 6px gap, a 6px upward shift of the card, and a 32px height. The code uses mt-1 and -mb-1 instead, so those description claims do not match the code. The issue sets no numeric gap or height, so this mismatch does not leave an issue requirement unmet. The height was not re-measured here.

Full details: Out of Scope Changes check

Explanation

The whole-PR diff against merge base 350753a changes one line in one file. The class additions (rounded-xl, mt-1, -mb-1, py-1) apply to the same row that #36258 describes, and they support its rounded and separated requirement. No mobile files, exported declarations, or other files changed. The -mb-1 and py-1 edits adjust the row spacing, which belongs to the same spacing fix. The PR description says the gap is mt-1.5 and that the card moves 6px higher, but the code does not match that description. This is a description accuracy gap, not an unrelated code change.

Full details: Description check

Explanation

The description follows the repository template and covers all required sections. Problem: the context row under the composer has a full-width, square-cornered glass background that reads as a hard-edged slab over scrolling content. Change: the ContextStrip row is now rounded-xl with a 4px gap above it, with spacing split between margin and padding so the 32px row height and the composer card position are unchanged. Scope: it links the bug issue #36258 and states the change is presentation-only and excludes mobile. Verification: it gives a specific setup (Chromium, Windows 11, dark theme, 1280x800), before/after screenshots, getBoundingClientRect measurements, the checks run, and the items not checked. The Verification section also reports a takeover pass with a second capture. The description does not include a Problem/Change explanation of the 'Keep composer context visible' gating beyond what is stated, and it contains a note about the model used, which the template asks for. These are minor and do not block the review.

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: 76d0fff
• Layers: Repository TS config
• Review profile: CHILL
• Plan: Advanced
• Run ID: eac93f32-6fc3-44aa-98bf-89d0c1e6a0d2

Commits

Reviewing files that changed from the base of the PR and between 9097223 and 681411c.

Files selected for processing: 1

• apps/web/src/components/chat/ComposerSurface.tsx

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

• apps/web/src/components/chat/ComposerSurface.tsx

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

[maria-rcks]

Note

Written by gpt-6.1-sol on behalf of Maria

merged current main with a merge commit and preserved the one-line styling change. the cancelled ci run was replaced by a fully passing run. blacksmith vp run check:changed passed. chrome confirmed the 4px gap and 12px corners without moving the composer; the branch picker still opens. two independent reviews found no issues at 9af840b6a933f3a0843188855e3c02d1d36ff4e1. current before/after evidence and verification limits are in the pr body.

[floklein]

Thanks for merging main and re-verifying. Nothing further from my side: the branch stays at 9af840b so the green run and your reviews remain valid.