Skip to content

Improve border visibility for key bindings in light/dark themes#320076

Merged
mrleemurray merged 1 commit into
mainfrom
mrleemurray/curved-blush-crab
Jun 5, 2026
Merged

Improve border visibility for key bindings in light/dark themes#320076
mrleemurray merged 1 commit into
mainfrom
mrleemurray/curved-blush-crab

Conversation

@mrleemurray
Copy link
Copy Markdown
Contributor

@mrleemurray mrleemurray commented Jun 5, 2026

Enhance the visibility of key binding borders in light and dark themes by deriving the border color from the foreground, addressing issues with transparency that made borders invisible against certain backgrounds. High contrast themes remain unaffected.

Addresses: https://github.com/microsoft/vscode-internalbacklog/issues/7676

Copilot AI review requested due to automatic review settings June 5, 2026 11:10
@mrleemurray mrleemurray enabled auto-merge (squash) June 5, 2026 11:10
@mrleemurray mrleemurray self-assigned this Jun 5, 2026
@vs-code-engineering
Copy link
Copy Markdown
Contributor

📬 CODENOTIFY

The following users are being notified based on files changed in this PR:

@TylerLeonhardt

Matched files:

  • src/vs/platform/quickinput/browser/media/quickInput.css

Copy link
Copy Markdown
Contributor

Copilot AI left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Pull request overview

This PR improves the visibility of keybinding “pill” borders in Quick Input list items for light (.vs) and dark (.vs-dark) themes by avoiding --vscode-widget-shadow (which can be transparent) and instead deriving a subtle border color from the current foreground color. High contrast themes are intentionally unaffected.

Changes:

  • Add a light/dark-theme-specific override for keybinding border color in focused/hovered Quick Input list rows.
  • Use color-mix(..., currentColor ..., transparent) to produce a consistent, theme-adaptive border even when widget shadow is transparent.

@mrleemurray mrleemurray merged commit 0b867a7 into main Jun 5, 2026
26 checks passed
@mrleemurray mrleemurray deleted the mrleemurray/curved-blush-crab branch June 5, 2026 11:43
@vs-code-engineering vs-code-engineering Bot added this to the 1.124.0 milestone Jun 5, 2026
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants