Add color item for sidebar title background (#209528)

fixes #209164
microsoft · Apr 4, 2024 · 8012a40 · 8012a40
1 parent c91cf1b
commit 8012a40
Show file tree

Hide file tree

Showing 4 changed files with 16 additions and 0 deletions.
diff --git a/build/lib/stylelint/vscode-known-variables.json b/build/lib/stylelint/vscode-known-variables.json
@@ -565,6 +565,7 @@
 		"--vscode-sideBarSectionHeader-background",
 		"--vscode-sideBarSectionHeader-border",
 		"--vscode-sideBarSectionHeader-foreground",
+		"--vscode-sideBarTitle-background",
 		"--vscode-sideBarTitle-foreground",
 		"--vscode-sideBySideEditor-horizontalBorder",
 		"--vscode-sideBySideEditor-verticalBorder",

diff --git a/src/vs/workbench/browser/parts/auxiliarybar/media/auxiliaryBarPart.css b/src/vs/workbench/browser/parts/auxiliarybar/media/auxiliaryBarPart.css
@@ -22,6 +22,10 @@
 	margin-right: 4px;
 }
 
+.monaco-workbench .part.auxiliarybar > .title {
+	background-color: var(--vscode-sideBarTitle-background);
+}
+
 .monaco-workbench .part.auxiliarybar > .title > .title-label {
 	flex: 1;
 }

diff --git a/src/vs/workbench/browser/parts/sidebar/media/sidebarpart.css b/src/vs/workbench/browser/parts/sidebar/media/sidebarpart.css
@@ -16,6 +16,10 @@
 	margin-right: 4px;
 }
 
+.monaco-workbench .part.sidebar > .title {
+	background-color: var(--vscode-sideBarTitle-background);
+}
+
 .monaco-workbench .part.sidebar > .title > .title-label h2 {
 	text-transform: uppercase;
 }

diff --git a/src/vs/workbench/common/theme.ts b/src/vs/workbench/common/theme.ts
@@ -850,6 +850,13 @@ export const SIDE_BAR_BORDER = registerColor('sideBar.border', {
 	hcLight: contrastBorder
 }, localize('sideBarBorder', "Side bar border color on the side separating to the editor. The side bar is the container for views like explorer and search."));
 
+export const SIDE_BAR_TITLE_BACKGROUND = registerColor('sideBarTitle.background', {
+	dark: SIDE_BAR_BACKGROUND,
+	light: SIDE_BAR_BACKGROUND,
+	hcDark: SIDE_BAR_BACKGROUND,
+	hcLight: SIDE_BAR_BACKGROUND
+}, localize('sideBarTitleBackground', "Side bar title background color. The side bar is the container for views like explorer and search."));
+
 export const SIDE_BAR_TITLE_FOREGROUND = registerColor('sideBarTitle.foreground', {
 	dark: SIDE_BAR_FOREGROUND,
 	light: SIDE_BAR_FOREGROUND,