Agent chat: no opaque rectangle behind the header buttons in the tab row
Leo (2026-11-03), on the chat's header buttons: "also the session info button background is what i was talking about... it is in this version... this is the thing that has plagued us for literal weeks... it's so obvious to just remove the thing / you literally see a background on the buttons itself and it's just terrible looking", then: "the toggle you keep" and "I AM TALKING ABOUT THE ... ABSOLUTELY UNINTENTIONALL LOOKING ... OPAQUE RECTANGLE".
What drew the rectangle
The agent page's document root paints WebTheme's page background: html{background:var(--cmux-surface-background) !important} (WebTheme.swift bootstrap). That is the chat's own color when appearance.surfaces.agentPane is set, or the opaque surface in an opaque window. While the chat shares the pane's tab row, that html fill ran under the header tools as a band from the tabs' end to the pane's rounded corner.
- #25638 meant to clear it with
html:has(.acpmux-shell[data-tab-row]){background:transparent !important}, but put the rule inwebviews/src/styles.css, which the agent pane bundle never loads (build-agent-pane-web.shtakes the sheetsacpmux/dev.tsximports). Its test loaded that file and set the row's html color itself, so it passed. - #32687 cleared the shell's own band, but not
html. - #32039 then painted the same chat color behind the tabs (
PaneContentView.paintStrip,tabRowSurface), so the band covered the whole row instead of going away.
Takes back #32039: the strip behind the tabs paints the chat's color, which makes the row a band of that color over the window art, and this PR removes that band.
Change
header.css:htmlis clear while the chat shares the tab row. The shell paints the page background (--cmux-surface-background, under--agent-page-bg) below the row only. The header row has no backing; the hover pill and the toggled plate ([aria-pressed=true]) on each button stay.PaneContentView.paintStrip: the strip behind the tabs is clear again, and only the person's own tab bar color (appearance.surfaces.tabBar) fills it. ThetabRowSurfaceplumbing from #32039 is removed.- An opaque window keeps its look: the pane's content host still paints the surface under the row there (
themeDidChange,panesPaintBackground).
Spec: leo-workspace design/session-info.md: "The header buttons that open Session Info sit on no background ... only the hover pill, and the filled rounded square while the panel is open."
Tests
webviews/test/chat-header-tab-row-surface.test.ts(browser lane) loads the page as it ships: only the pane's own sheets plus WebTheme's html rule, with an opaque and a translucent chat color. It reads the page's own pixels: alpha 0 across the row beside and between the tools, the toggled Session Info plate present, and the page color below the row. Fails at 2bb56d783a92 (test only), passes at the head.TabRowToolsStayClickableTests.theTabRowHasNoBackingWhileTheChatSharesIt: with a chat color set and the chat in the row, the strip has no fill; with a tab bar color, the strip paints that color.
Observed / Not run
- Observed:
scripts/web-lint.sh(fast part) andprepush-gate.pypassed. Compile and the browser test red/green run on the fleet; results go in a comment. - Not run: a real-app capture over window art. The capture host was unreachable (
cmux-ci capturetimed out on the fleet and the broker).
Changelog
Fixed: an agent chat that shares the pane's tab row no longer draws an opaque rectangle behind its header buttons; the row sits on the window's glass.
Agent session: agent session
🤖 Generated with Claude Code
![Autofix with [code]smith](https://pr-comments-assets.blacksmith.sh/codesmith/autofix-with-codesmith-dark-3x.png)
Open in [code]smith · Need help on this PR? Tag @codesmith-bot with what you need.
Summary by cubic
Removes the opaque rectangle behind the header buttons when an agent chat shares the pane's tab row. The row now sits on the window's glass, keeping only each button's hover pill and toggled plate.
- A rule meant to clear the page background was placed in
src/styles.css, which the agent pane never loads, and a prior change painted the same color behind the tabs. - The strip behind the tabs is clear again; only the user's own tab bar color fills it.
Changelog
Fixed: an agent chat that shares the pane's tab row no longer draws an opaque rectangle behind its header buttons.