fix: prevent agent badge clipping and portal tabs into titlebar#533
Closed
heyramzi wants to merge 1 commit intostablyai:mainfrom
Closed
fix: prevent agent badge clipping and portal tabs into titlebar#533heyramzi wants to merge 1 commit intostablyai:mainfrom
heyramzi wants to merge 1 commit intostablyai:mainfrom
Conversation
Two titlebar layout fixes: 1. Agent badge clipping: moved the active-agent badge out of the sidebar-width-constrained container so it is never clipped when the sidebar is narrow. Added flex-shrink: 0 to prevent the badge from being compressed by adjacent flex items. 2. Tabs in titlebar: when no splits are active, the tab bar is portaled into the titlebar's #titlebar-tabs slot so the titlebar row doubles as the tab strip, saving ~36px of vertical space. When the user creates a split, each group renders its own inline tab bar as before.
Contributor
|
Thanks @heyramzi We made some changes here to re-work the split pane work... but 100% agreed this is real. |
Contributor
|
This issue has been fixed in other PRs. Closing this one now. Thx for putting it up though! |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary
Two titlebar layout fixes:
1. Agent badge clipping
The active-agent badge ("● 1 active") was rendered inside the sidebar-width-constrained container with
overflow-hidden, causing it to get clipped when the sidebar is narrow.Fix: Moved the badge out of the constrained container so it sits as a direct child of the titlebar flex row. Added
flex-shrink: 0to prevent compression.Before:

The badge text gets cut off — "1 active" becomes "1 activ..."
2. Tabs in titlebar (save vertical space)
The titlebar row was entirely empty in its center section (
#titlebar-tabswas an invisible spacer), while tabs rendered in a separate 36px row below it — wasting vertical screen real estate.Fix: When there are no split groups, the tab bar is portaled into the titlebar's
#titlebar-tabsslot viacreatePortal, so the titlebar doubles as the tab strip. When splits are active, each group renders its own inline tab bar as before — avoiding the visual "jump" issue noted in the previous implementation.Changes
App.tsx#titlebar-tabsto accept portaled tabs withitems-stretchTabGroupPanel.tsx#titlebar-tabswhen!hasSplitGroups; fall back to inline rendering for splitsmain.cssflex-shrink: 0to badge; added#titlebar-tabs > .terminal-tab-stripno-drag rule for portaled tabsTest plan
showTitlebarAgentActivityoff in Settings → Appearance — badge should disappear