theming: Expose status bar debugging and no-folder foreground colors

src/vs/workbench/browser/parts/statusbar/statusbarPart.ts

@@ -27,7 +27,7 @@ import { getCodeEditor } from 'vs/editor/common/services/codeEditorService';
 import { IContextMenuService } from 'vs/platform/contextview/browser/contextView';
 import { Action } from 'vs/base/common/actions';
 import { IThemeService, registerThemingParticipant, ITheme, ICssStyleCollector } from 'vs/platform/theme/common/themeService';
-import { STATUS_BAR_BACKGROUND, STATUS_BAR_FOREGROUND, STATUS_BAR_NO_FOLDER_BACKGROUND, STATUS_BAR_ITEM_HOVER_BACKGROUND, STATUS_BAR_ITEM_ACTIVE_BACKGROUND, STATUS_BAR_PROMINENT_ITEM_BACKGROUND, STATUS_BAR_PROMINENT_ITEM_HOVER_BACKGROUND, STATUS_BAR_BORDER } from 'vs/workbench/common/theme';
+import { STATUS_BAR_BACKGROUND, STATUS_BAR_FOREGROUND, STATUS_BAR_NO_FOLDER_BACKGROUND, STATUS_BAR_ITEM_HOVER_BACKGROUND, STATUS_BAR_ITEM_ACTIVE_BACKGROUND, STATUS_BAR_PROMINENT_ITEM_BACKGROUND, STATUS_BAR_PROMINENT_ITEM_HOVER_BACKGROUND, STATUS_BAR_BORDER, STATUS_BAR_NO_FOLDER_FOREGROUND } from 'vs/workbench/common/theme';
 import { IWorkspaceContextService } from 'vs/platform/workspace/common/workspace';
 import { contrastBorder } from 'vs/platform/theme/common/colorRegistry';
 
@@ -136,7 +136,7 @@ export class StatusbarPart extends Part implements IStatusbarService {
 
 		const container = this.getContainer();
 
-		container.style('color', this.getColor(STATUS_BAR_FOREGROUND));
+		container.style('color', this.getColor(this.contextService.hasWorkspace() ? STATUS_BAR_FOREGROUND : STATUS_BAR_NO_FOLDER_FOREGROUND));
 		container.style('background-color', this.getColor(this.contextService.hasWorkspace() ? STATUS_BAR_BACKGROUND : STATUS_BAR_NO_FOLDER_BACKGROUND));
 
 		const borderColor = this.getColor(STATUS_BAR_BORDER) || this.getColor(contrastBorder);

src/vs/workbench/common/theme.ts

@@ -142,6 +142,12 @@ export const STATUS_BAR_NO_FOLDER_BACKGROUND = registerColor('statusBar.noFolder
 	hc: null
 }, nls.localize('statusBarNoFolderBackground', "Status bar background color when no folder is opened. The status bar is shown in the bottom of the window."));
 
+export const STATUS_BAR_NO_FOLDER_FOREGROUND = registerColor('statusBar.noFolderForeground', {
+	dark: STATUS_BAR_FOREGROUND,
+	light: STATUS_BAR_FOREGROUND,
+	hc: STATUS_BAR_FOREGROUND
+}, nls.localize('statusBarNoFolderForeground', "Status bar foreground color when no folder is opened. The status bar is shown in the bottom of the window."));
+
 export const STATUS_BAR_ITEM_ACTIVE_BACKGROUND = registerColor('statusBarItem.activeBackground', {
 	dark: Color.white.transparent(0.18),
 	light: Color.white.transparent(0.18),

src/vs/workbench/parts/debug/electron-browser/statusbarColorProvider.ts

@@ -3,14 +3,15 @@
  *  Licensed under the MIT License. See License.txt in the project root for license information.
  *--------------------------------------------------------------------------------------------*/
 
-import { IThemeService } from 'vs/platform/theme/common/themeService';
+import { IThemeService, registerThemingParticipant, ITheme, ICssStyleCollector } from 'vs/platform/theme/common/themeService';
 import { localize } from 'vs/nls';
 import { registerColor } from 'vs/platform/theme/common/colorRegistry';
 import { IWorkbenchContribution } from 'vs/workbench/common/contributions';
 import { IPartService, Parts } from 'vs/workbench/services/part/common/partService';
 import { IDebugService, State } from 'vs/workbench/parts/debug/common/debug';
 import { IWorkspaceContextService } from 'vs/platform/workspace/common/workspace';
-import { STATUS_BAR_NO_FOLDER_BACKGROUND, STATUS_BAR_BACKGROUND, Themable } from 'vs/workbench/common/theme';
+import { STATUS_BAR_NO_FOLDER_BACKGROUND, STATUS_BAR_NO_FOLDER_FOREGROUND, STATUS_BAR_BACKGROUND, Themable, STATUS_BAR_FOREGROUND } from 'vs/workbench/common/theme';
+import { addClass, removeClass } from "vs/base/browser/dom";
 
 // colors for theming
 
@@ -20,6 +21,12 @@ export const STATUS_BAR_DEBUGGING_BACKGROUND = registerColor('statusBar.debuggin
 	hc: '#CC6633'
 }, localize('statusBarDebuggingBackground', "Status bar background color when a program is being debugged. The status bar is shown in the bottom of the window"));
 
+export const STATUS_BAR_DEBUGGING_FOREGROUND = registerColor('statusBar.debuggingForeground', {
+	dark: STATUS_BAR_FOREGROUND,
+	light: STATUS_BAR_FOREGROUND,
+	hc: STATUS_BAR_FOREGROUND
+}, localize('statusBarDebuggingForeground', "Status bar foreground color when a program is being debugged. The status bar is shown in the bottom of the window"));
+
 export class StatusBarColorProvider extends Themable implements IWorkbenchContribution {
 	private static ID = 'debug.statusbarColorProvider';
 
@@ -45,25 +52,42 @@ export class StatusBarColorProvider extends Themable implements IWorkbenchContri
 	protected updateStyles(): void {
 		super.updateStyles();
 
-		if (this.partService.isVisible(Parts.STATUSBAR_PART)) {
-			const container = this.partService.getContainer(Parts.STATUSBAR_PART);
-			container.style.backgroundColor = this.getColor(this.getBackgroundColorKey());
+		const container = this.partService.getContainer(Parts.STATUSBAR_PART);
+		if (this.isDebugging()) {
+			addClass(container, 'debugging');
+		} else {
+			removeClass(container, 'debugging');
 		}
+
+		container.style.backgroundColor = this.getColor(this.getColorKey(STATUS_BAR_NO_FOLDER_BACKGROUND, STATUS_BAR_DEBUGGING_BACKGROUND, STATUS_BAR_BACKGROUND));
+		container.style.color = this.getColor(this.getColorKey(STATUS_BAR_NO_FOLDER_FOREGROUND, STATUS_BAR_DEBUGGING_FOREGROUND, STATUS_BAR_FOREGROUND));
 	}
 
-	private getBackgroundColorKey(): string {
+	private getColorKey(noFolderColor: string, debuggingColor: string, normalColor: string): string {
 
-		// no debugging
-		if (this.debugService.state === State.Inactive || this.isRunningWithoutDebug()) {
+		// Not debugging
+		if (!this.isDebugging()) {
 			if (this.contextService.hasWorkspace()) {
-				return STATUS_BAR_BACKGROUND;
+				return normalColor;
 			}
 
-			return STATUS_BAR_NO_FOLDER_BACKGROUND;
+			return noFolderColor;
+		}
+
+		// Debugging
+		return debuggingColor;
+	}
+
+	private isDebugging(): boolean {
+		if (this.debugService.state === State.Inactive) {
+			return false;
+		}
+
+		if (this.isRunningWithoutDebug()) {
+			return false;
 		}
 
-		// debugging
-		return STATUS_BAR_DEBUGGING_BACKGROUND;
+		return true;
 	}
 
 	private isRunningWithoutDebug(): boolean {
@@ -75,4 +99,11 @@ export class StatusBarColorProvider extends Themable implements IWorkbenchContri
 	public getId(): string {
 		return StatusBarColorProvider.ID;
 	}
-}
\ No newline at end of file
+}
+
+registerThemingParticipant((theme: ITheme, collector: ICssStyleCollector) => {
+	const statusBarItemDebuggingForeground = theme.getColor(STATUS_BAR_DEBUGGING_FOREGROUND);
+	if (statusBarItemDebuggingForeground) {
+		collector.addRule(`.monaco-workbench > .part.statusbar.debugging > .statusbar-item .mask-icon { background-color: ${statusBarItemDebuggingForeground} !important; }`);
+	}
+});
\ No newline at end of file

src/vs/workbench/parts/feedback/electron-browser/feedback.ts

@@ -76,7 +76,7 @@ export class FeedbackDropdown extends Dropdown {
 		super(container, {
 			contextViewProvider: options.contextViewProvider,
 			labelRenderer: (container: HTMLElement): IDisposable => {
-				$(container).addClass('send-feedback');
+				$(container).addClass('send-feedback', 'mask-icon');
 
 				return null;
 			}

src/vs/workbench/parts/feedback/electron-browser/feedbackStatusbarItem.ts

@@ -11,8 +11,9 @@ import { FeedbackDropdown, IFeedback, IFeedbackService } from './feedback';
 import { IContextViewService } from 'vs/platform/contextview/browser/contextView';
 import { IInstantiationService } from 'vs/platform/instantiation/common/instantiation';
 import product from 'vs/platform/node/product';
-import { Themable, STATUS_BAR_FOREGROUND } from 'vs/workbench/common/theme';
+import { Themable, STATUS_BAR_FOREGROUND, STATUS_BAR_NO_FOLDER_FOREGROUND } from 'vs/workbench/common/theme';
 import { IThemeService } from 'vs/platform/theme/common/themeService';
+import { IWorkspaceContextService } from "vs/platform/workspace/common/workspace";
 
 class TwitterFeedbackService implements IFeedbackService {
 
@@ -53,6 +54,7 @@ export class FeedbackStatusbarItem extends Themable implements IStatusbarItem {
 	constructor(
 		@IInstantiationService private instantiationService: IInstantiationService,
 		@IContextViewService private contextViewService: IContextViewService,
+		@IWorkspaceContextService private contextService: IWorkspaceContextService,
 		@IThemeService themeService: IThemeService
 	) {
 		super(themeService);
@@ -62,7 +64,7 @@ export class FeedbackStatusbarItem extends Themable implements IStatusbarItem {
 		super.updateStyles();
 
 		if (this.dropdown) {
-			this.dropdown.label.style('background-color', this.getColor(STATUS_BAR_FOREGROUND));
+			this.dropdown.label.style('background-color', this.getColor(this.contextService.hasWorkspace() ? STATUS_BAR_FOREGROUND : STATUS_BAR_NO_FOLDER_FOREGROUND));
 		}
 	}
 

src/vs/workbench/parts/tasks/electron-browser/task.contribution.ts

@@ -80,7 +80,7 @@ import { ProcessRunnerDetector } from 'vs/workbench/parts/tasks/node/processRunn
 
 import { IEnvironmentService } from 'vs/platform/environment/common/environment';
 
-import { Themable, STATUS_BAR_FOREGROUND } from 'vs/workbench/common/theme';
+import { Themable, STATUS_BAR_FOREGROUND, STATUS_BAR_NO_FOLDER_FOREGROUND } from 'vs/workbench/common/theme';
 import { IThemeService } from 'vs/platform/theme/common/themeService';
 
 let $ = Builder.$;
@@ -269,7 +269,8 @@ class StatusBarItem extends Themable implements IStatusbarItem {
 		@IOutputService private outputService: IOutputService,
 		@ITaskService private taskService: ITaskService,
 		@IPartService private partService: IPartService,
-		@IThemeService themeService: IThemeService
+		@IThemeService themeService: IThemeService,
+		@IWorkspaceContextService private contextService: IWorkspaceContextService
 	) {
 		super(themeService);
 
@@ -281,7 +282,7 @@ class StatusBarItem extends Themable implements IStatusbarItem {
 		super.updateStyles();
 
 		this.icons.forEach(icon => {
-			icon.style.backgroundColor = this.getColor(STATUS_BAR_FOREGROUND);
+			icon.style.backgroundColor = this.getColor(this.contextService.hasWorkspace() ? STATUS_BAR_FOREGROUND : STATUS_BAR_NO_FOLDER_FOREGROUND);
 		});
 	}
 
@@ -310,6 +311,7 @@ class StatusBarItem extends Themable implements IStatusbarItem {
 		element.title = nls.localize('problems', "Problems");
 
 		Dom.addClass(errorIcon, 'task-statusbar-item-label-error');
+		Dom.addClass(errorIcon, 'mask-icon');
 		label.appendChild(errorIcon);
 		this.icons.push(errorIcon);
 
@@ -318,6 +320,7 @@ class StatusBarItem extends Themable implements IStatusbarItem {
 		label.appendChild(error);
 
 		Dom.addClass(warningIcon, 'task-statusbar-item-label-warning');
+		Dom.addClass(warningIcon, 'mask-icon');
 		label.appendChild(warningIcon);
 		this.icons.push(warningIcon);
 
@@ -326,6 +329,7 @@ class StatusBarItem extends Themable implements IStatusbarItem {
 		label.appendChild(warning);
 
 		Dom.addClass(infoIcon, 'task-statusbar-item-label-info');
+		Dom.addClass(infoIcon, 'mask-icon');
 		label.appendChild(infoIcon);
 		this.icons.push(infoIcon);
 		$(infoIcon).hide();