Fix additional actions bar item hover size (20x20 → 22x22)

[Copilot]

The "Additional Views" ellipsis button in narrow composite bar panels renders at 20x20px instead of 22x22px on hover, inconsistent with other action items.

Root cause: paneCompositePart.css applies padding: 2px to all composite bar action labels, while base action-bar uses padding: 3px (16px icon + 3px×2 = 22px).

Change: Add padding: 3px specifically to .action-label.codicon-more to match expected sizing.

.monaco-workbench .pane-composite-part ... .action-label.codicon-more {
    padding: 3px; /* match base action-bar styling for 22x22px size */
}

Original prompt

---

This section details on the original issue you should resolve

<issue_title>Additional actions bar item renders differently to other items on hover</issue_title>
<issue_description>When the chat panel has a thinner width, the CHAT label converts to an icon button with an ellipsis. On hover, this button renders differently:

• 20 x 20px size instead of 22 x 22px
• 0px border radius instead of 5px

Screenshot:

UX/Design Issue:
This issue is related to user interface, design, or user experience.

Environment Information:

• VS Code Version: 1.106.0
• OS: macOS (arm64)
• Workspace: 0 folder(s) open

---

This issue was filed using the Issue Filer extension</issue_description>

Comments on the Issue (you are @copilot in this section)

@justschen looks like that aux bar has a deliberate `border-radius` of 0.

vscode/src/vs/workbench/browser/parts/auxiliarybar/media/auxiliaryBarPart.css

Lines 46 to 50 in aceb7fe

	.monaco-workbench .part.auxiliarybar > .title > .composite-bar-container > .composite-bar > .monaco-action-bar .action-item .action-label,
	.monaco-workbench .part.auxiliarybar > .header-or-footer > .composite-bar-container > .composite-bar > .monaco-action-bar .action-item .action-label {
	border-radius: 0px;
	outline-offset: 2px;
	}

cc. @benibenj on if we can change this? not sure where else this auxiliaryBarPart is used</comment_new>
<comment_new>@bpasero
So the original PR from @benibenj is #207261 (to fix #197648) and talks about high contrast themes, but then in the CSS changes they do not seem to be narrowed down to HC only 🤔

I would suggest to wait for Ben to be back and comment, but we should fix.</comment_new>
<comment_new>@benibenj
This is what it is used for. We do not want to have rounded corners in this case:

Narrowing down to HC might work. How do you do that with CSS only @bpasero?

@bpasero @benibenj you prefix with the related HC theme keys, example:

vscode/src/vs/base/browser/ui/selectBox/selectBoxCustom.css

Lines 12 to 16 in d455f29

	.hc-black .monaco-select-box-dropdown-padding,
	.hc-light .monaco-select-box-dropdown-padding {
	--dropdown-padding-top: 3px;
	--dropdown-padding-bottom: 4px;
	}

</comment_new>
<comment_new>@zhichli
✅ (fixed) 0px border radius instead of 5px
❌ (pending) 20 x 20px size instead of 22 x 22px
Looking at the screenshot below:
</comment_new>
<comment_new>@mrleemurray
Reopening as the size is still 20 x 20</comment_new>

• Fixes Additional actions bar item renders differently to other items on hover #271508

---

💡 You can make Copilot smarter by setting up custom instructions, customizing its development environment and configuring Model Context Protocol (MCP) servers. Learn more Copilot coding agent tips in the docs.