Refactor CSS to use --vscode-shadow-lg#320071
Merged
Merged
Conversation
…n multiple CSS files Co-authored-by: Copilot <copilot@github.com>
Contributor
There was a problem hiding this comment.
Pull request overview
This PR standardizes shadow styling across several VS Code hover/peek/rename UI widgets by consolidating on the existing --vscode-shadow-lg CSS variable and removing the unused --vscode-shadow-hover variable from global definitions and stylelint’s known-variable allowlist.
Changes:
- Removed
--vscode-shadow-hoverfrom the global workbench CSS variable set. - Updated widget CSS (
hover,peekView,rename) to use--vscode-shadow-lgforbox-shadow. - Removed
--vscode-shadow-hoverfrombuild/lib/stylelint/vscode-known-variables.jsonto keep lint configuration in sync.
Reviewed changes
Copilot reviewed 6 out of 6 changed files in this pull request and generated no comments.
Show a summary per file
| File | Description |
|---|---|
| src/vs/workbench/browser/media/style.css | Removes the --vscode-shadow-hover CSS variable definition from the global workbench variable set. |
| src/vs/platform/hover/browser/hover.css | Updates workbench hover widget shadow to use --vscode-shadow-lg. |
| src/vs/editor/contrib/rename/browser/renameWidget.css | Updates rename widget shadow to use --vscode-shadow-lg. |
| src/vs/editor/contrib/peekView/browser/media/peekViewWidget.css | Updates peek view widget shadow to use --vscode-shadow-lg. |
| src/vs/editor/contrib/hover/browser/hover.css | Updates editor hover shadow to use --vscode-shadow-lg. |
| build/lib/stylelint/vscode-known-variables.json | Removes --vscode-shadow-hover from the stylelint known-variables list to match the variable removal. |
Contributor
Screenshot ChangesBase: Changed (6)
|
| Before | After |
|---|---|
 |
 |
editor/inlineCompletions/other/HintsToolbar/Light
| Before | After |
|---|---|
 |
 |
editor/inlineCompletions/other/HintsToolbarHovered/Dark
| Before | After |
|---|---|
|
|
editor/inlineCompletions/other/HintsToolbarHovered/Light
| Before | After |
|---|---|
|
|
peekReference/PeekReferences/Dark
| Before | After |
|---|---|
 |
 |
peekReference/PeekReferences/Light
| Before | After |
|---|---|
 |
 |
alexdima
approved these changes
Jun 5, 2026
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.
This pull request updates the way shadows are applied to several UI widgets by standardizing on the
--vscode-shadow-lgvariable and removing the now-unused--vscode-shadow-hovervariable. This change ensures a more consistent visual appearance across the editor and simplifies the shadow variable set.Theme and variable cleanup:
--vscode-shadow-hoverCSS variable from the global style definitions instyle.cssand from the list of known variables invscode-known-variables.json. [1] [2]UI consistency improvements:
box-shadowproperty in multiple widget styles (hover.css,peekViewWidget.css,renameWidget.css, andhover.cssin the platform directory) to use--vscode-shadow-lginstead of the removed--vscode-shadow-hovervariable. This change affects the hover widget, peek view widget, and rename widget, ensuring they all use the same shadow style. [1] [2] [3] [4]