mirror of
https://github.com/Microsoft/vscode
synced 2024-10-12 06:17:18 +00:00
theming: Expose status bar debugging and no-folder foreground colors
This commit is contained in:
parent
eaf18ad337
commit
1281eab369
|
@ -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);
|
||||
|
|
|
@ -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),
|
||||
|
|
|
@ -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 STATUS_BAR_DEBUGGING_BACKGROUND;
|
||||
// Debugging
|
||||
return debuggingColor;
|
||||
}
|
||||
|
||||
private isDebugging(): boolean {
|
||||
if (this.debugService.state === State.Inactive) {
|
||||
return false;
|
||||
}
|
||||
|
||||
if (this.isRunningWithoutDebug()) {
|
||||
return false;
|
||||
}
|
||||
|
||||
return true;
|
||||
}
|
||||
|
||||
private isRunningWithoutDebug(): boolean {
|
||||
|
@ -75,4 +99,11 @@ export class StatusBarColorProvider extends Themable implements IWorkbenchContri
|
|||
public getId(): string {
|
||||
return StatusBarColorProvider.ID;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
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; }`);
|
||||
}
|
||||
});
|
|
@ -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;
|
||||
}
|
||||
|
|
|
@ -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));
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
@ -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();
|
||||
|
|
Loading…
Reference in a new issue