sessions: fix Customizations single-entry width overflow#315125
Merged
joshspicer merged 1 commit intomainfrom May 8, 2026
Merged
sessions: fix Customizations single-entry width overflow#315125joshspicer merged 1 commit intomainfrom
joshspicer merged 1 commit intomainfrom
Conversation
The single-entry sidebar 'Customizations' button had `width: 100%` set on both the link-button container and the inner button. Combined with the inherited `margin: 0 10px` from the per-section rule, this overflowed the panel by 20px and was visible as a misaligned focus outline that extended past the panel edge. Drop the explicit widths and let the parent's default `align-items: stretch` plus the inherited margins size the entry, matching the per-section items. Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
Contributor
There was a problem hiding this comment.
Pull request overview
Fixes the Agents window “Customizations” sidebar button in single-entry mode so its keyboard focus outline no longer overflows the panel width.
Changes:
- Removed single-entry
width: 100%overrides that, combined withmargin: 0 10px, caused the container/button to layout wider than the parent. - Updated the inline comment to clarify that width is handled by inherited margins and default flex stretching, while keeping
flex: noneto prevent vertical stretching.
Show a summary per file
| File | Description |
|---|---|
| src/vs/sessions/contrib/sessions/browser/media/customizationsToolbar.css | Removes single-entry width overrides that caused horizontal overflow; keeps flex: none and clarifies sizing rationale. |
Copilot's findings
- Files reviewed: 1/1 changed files
- Comments generated: 0
Contributor
roblourens
approved these changes
May 7, 2026
wpfleger96
added a commit
to wpfleger96/vscode
that referenced
this pull request
May 8, 2026
…2-not-clearing-terminal-title * upstream/main: chat: hide plugin actions for synced customization items (microsoft#315320) fixes microsoft#291188 (microsoft#314713) sessions: restore last active session on reload (microsoft#315312) Replace "Agents app" with "Agents window" in user-facing strings (microsoft#315302) chat: remove 'Bridged' badge from MCP servers in AI Customizations UI (microsoft#315319) Add proposal for custom editor diff/merge priority agentHost: revert undefined-field omission, update tests instead sessions: fix Customizations single-entry width overflow (microsoft#315125) agentHost: rewrite Resource attachments and omit undefined fields agentHost: support image and blob user-message attachments
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.
What
Fixes the keyboard-focus outline on the single-entry "Customizations" sidebar button being misaligned — extending past the panel's right edge.
Why
In single-entry mode,
.ai-customization-toolbar.single-entry .customization-link-button-containerhadwidth: 100%set, which combined with the inheritedmargin: 0 10pxfrom the base rule (line 84) to lay out the container atparent.width + 20px. The button inside also hadwidth: 100%, so it inherited the overflow. The focus outline traces the button's actual bounding box, making the overflow immediately visible whenever the button received keyboard focus.Fix
Drop the explicit
width: 100%declarations. The flex-column toolbar's defaultalign-items: stretchplus the inheritedmargin: 0 10pxalready size the container correctly — the same way the per-section link rows are sized.flex: noneis kept so the entry doesn't stretch vertically inside the column.Testing
CSS-only change; verified hygiene passes. Component fixture in
aiCustomizationShortcutsWidget.fixture.ts(ModeSingle*) covers this layout.