Skip to content

Conversation

@70853n
Copy link

@70853n 70853n commented Nov 21, 2025

Proposed changes

Fixes #272840 by introducing two theme color variables.

Testing

Automated tests

Automated test already exist under /vscode/src/vs/workbench/contrib/themes/test/node/colorRegistry.releaseTest.ts

Manual testing

Steps to reproduce

  1. Run a dev instance of VS Code
  2. Go to Preferences: Open User Settings (JSON)
  3. Add the following:
  "workbench.colorCustomizations": {
    "titleBar.activeHoverBackground": "#000000",
    "titleBar.activeHoverForeground": "#ffffff",
    }
  1. Hover over the Back and Forward buttons in the title bar

Expected behaviour

Unless a button is disabled it should show white text on a black background.

Michael Freiherz added 2 commits November 21, 2025 17:12
…oft#272840)

Introduces titleBar.activeHoverBackground and titleBar.activeHoverForeground variables.
- adds css styling for :hover state of the back and forward and toolbar buttons
Copilot AI review requested due to automatic review settings November 21, 2025 16:24
@vs-code-engineering
Copy link

vs-code-engineering bot commented Nov 21, 2025

📬 CODENOTIFY

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

@bpasero

Matched files:

  • src/vs/workbench/browser/parts/titlebar/media/titlebarpart.css
  • src/vs/workbench/common/theme.ts

@70853n
Copy link
Author

70853n commented Nov 21, 2025

@microsoft-github-policy-service agree

@70853n 70853n force-pushed the 70853n/272840-add-hover-colors branch from 3320858 to b03a661 Compare November 21, 2025 16:26
@70853n 70853n changed the title 70853n/272840 add hover colors (#272840) 70853n/272840 add hover colors Nov 21, 2025
Copy link
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 adds hover color customization for title bar actions (back/forward navigation buttons and command center) by introducing two new theme color variables: titleBar.activeHoverBackground and titleBar.activeHoverForeground. The implementation follows existing VS Code theming patterns and integrates with the color registry validation tests.

Key Changes

  • Added two new theme color definitions following the existing hover state pattern
  • Configured initial color values for dark and light themes
  • Applied the colors in CSS to title bar action hover states

Reviewed changes

Copilot reviewed 4 out of 4 changed files in this pull request and generated 1 comment.

File Description
src/vs/workbench/common/theme.ts Registered two new theme colors using toolbarHoverBackground and TITLE_BAR_ACTIVE_FOREGROUND as defaults, consistent with menubar selection pattern
src/vs/workbench/services/themes/common/workbenchThemeService.ts Added initial color values for both dark and light themes following the existing color scheme
src/vs/workbench/browser/parts/titlebar/media/titlebarpart.css Applied hover styles to title bar action labels, though contains duplicate rule that should be removed
build/lib/stylelint/vscode-known-variables.json Added CSS variable names in correct alphabetical order for stylelint validation

@benibenj benibenj added this to the December 2025 milestone Nov 23, 2025
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.

[Theming] Add titleBar.activeHoverBackground and titleBar.activeHoverForeground

2 participants