status - make color dynamic (#155944)

microsoft · Jul 22, 2022 · f27f620 · f27f620
1 parent 3842ef9
commit f27f620
Show file tree

Hide file tree

Showing 3 changed files with 4 additions and 9 deletions.
diff --git a/src/vs/workbench/browser/parts/statusbar/media/statusbarpart.css b/src/vs/workbench/browser/parts/statusbar/media/statusbarpart.css
@@ -51,18 +51,17 @@
 	position: relative;
 }
 
-.monaco-workbench .part.statusbar > .items-container > .statusbar-item.has-beak > .status-bar-beak-container {
+.monaco-workbench .part.statusbar > .items-container > .statusbar-item.has-beak > .status-bar-item-beak-container {
 	position: absolute;
 	left: calc(50% - 5px); /* centering relative to parent */
 	top: -5px;
 	width: 10px;
 	height: 5px;
 }
 
-.monaco-workbench .part.statusbar > .items-container > .statusbar-item.has-beak > .status-bar-beak-container:before {
+.monaco-workbench .part.statusbar > .items-container > .statusbar-item.has-beak > .status-bar-item-beak-container:before {
 	content: '';
 	position: fixed;
-	color: rgb(0, 122, 204);
 	border-bottom-width: 5px;
 	border-bottom-style: solid;
 	border-left: 5px solid transparent;

diff --git a/src/vs/workbench/browser/parts/statusbar/statusbarItem.ts b/src/vs/workbench/browser/parts/statusbar/statusbarItem.ts
@@ -70,15 +70,11 @@ export class StatusbarEntryItem extends Disposable {
 
 		// Label (with support for progress)
 		this.label = new StatusBarCodiconLabel(this.labelContainer);
-
-		// Add to parent
 		this.container.appendChild(this.labelContainer);
 
 		// Beak Container
 		this.beakContainer = document.createElement('div');
-		this.beakContainer.className = 'status-bar-beak-container';
-
-		// Add to parent
+		this.beakContainer.className = 'status-bar-item-beak-container';
 		this.container.appendChild(this.beakContainer);
 
 		this.update(entry);

diff --git a/src/vs/workbench/browser/parts/statusbar/statusbarPart.ts b/src/vs/workbench/browser/parts/statusbar/statusbarPart.ts
@@ -544,7 +544,7 @@ export class StatusbarPart extends Part implements IStatusbarService {
 				}
 
 				/* Notification Beak */
-				.monaco-workbench .part.statusbar > .items-container > .statusbar-item.has-beak:before {
+				.monaco-workbench .part.statusbar > .items-container > .statusbar-item.has-beak > .status-bar-item-beak-container:before {
 					border-bottom-color: ${backgroundColor};
 				}
 			`;