From 7db643a5bbf1f633939adf30ff7cd43b7cc29c5e Mon Sep 17 00:00:00 2001 From: Benjamin Pasero Date: Mon, 20 Mar 2017 11:16:22 -0700 Subject: [PATCH] theme - window foreground, sidebar background --- .../browser/parts/sidebar/sidebarPart.ts | 4 +++- src/vs/workbench/common/theme.ts | 16 ++++++++++++++++ .../workbench/electron-browser/media/shell.css | 14 -------------- .../electron-browser/media/workbench.css | 14 -------------- src/vs/workbench/electron-browser/shell.ts | 9 +++++++++ 5 files changed, 28 insertions(+), 29 deletions(-) diff --git a/src/vs/workbench/browser/parts/sidebar/sidebarPart.ts b/src/vs/workbench/browser/parts/sidebar/sidebarPart.ts index ce054f4e74c..3afe46db746 100644 --- a/src/vs/workbench/browser/parts/sidebar/sidebarPart.ts +++ b/src/vs/workbench/browser/parts/sidebar/sidebarPart.ts @@ -26,7 +26,7 @@ import { IInstantiationService } from 'vs/platform/instantiation/common/instanti import Event from 'vs/base/common/event'; import { IThemeService } from 'vs/platform/theme/common/themeService'; import { highContrastBorder } from 'vs/platform/theme/common/colorRegistry'; -import { SIDE_BAR_TITLE_FOREGROUND } from 'vs/workbench/common/theme'; +import { SIDE_BAR_TITLE_FOREGROUND, SIDE_BAR_BACKGROUND } from 'vs/workbench/common/theme'; export class SidebarPart extends CompositePart { @@ -81,6 +81,8 @@ export class SidebarPart extends CompositePart { // Part container const container = this.getContainer(); + container.style('background-color', this.getColor(SIDE_BAR_BACKGROUND)); + const useBorder = this.isHighContrastTheme; const isPositionLeft = this.partService.getSideBarPosition() === SideBarPosition.LEFT; container.style('border-right-width', useBorder && isPositionLeft ? '1px' : null); diff --git a/src/vs/workbench/common/theme.ts b/src/vs/workbench/common/theme.ts index b059f256340..48d0a54c222 100644 --- a/src/vs/workbench/common/theme.ts +++ b/src/vs/workbench/common/theme.ts @@ -9,6 +9,16 @@ import { IDisposable, Disposable, dispose } from 'vs/base/common/lifecycle'; import { IThemeService, ITheme } from 'vs/platform/theme/common/themeService'; import { Color, RGBA } from 'vs/base/common/color'; +// < --- Workbench --- > + +export const WINDOW_FOREGROUND = registerColor('windowForeground', { + dark: '#CCCCCC', + light: '#6C6C6C', + hc: '#FFFFFF' +}, nls.localize('windowForeground', "Overall window foreground color. This color is only used if not overridden by a component.")); + + + // < --- Tabs --- > export const TABS_CONTAINER_BACKGROUND = registerColor('tabsContainerBackground', { @@ -162,6 +172,12 @@ export const ACTIVITY_BAR_BACKGROUND = registerColor('activityBarBackground', { // < --- Side Bar --- > +export const SIDE_BAR_BACKGROUND = registerColor('sideBarBackground', { + dark: '#252526', + light: '#F3F3F3', + hc: '#000000' +}, nls.localize('sideBarBackground', "Side bar background color. The side bar is the container for views like explorer and search.")); + export const SIDE_BAR_TITLE_FOREGROUND = registerColor('sideBarTitleForeground', { dark: '#BBBBBB', light: '#6f6f6f', diff --git a/src/vs/workbench/electron-browser/media/shell.css b/src/vs/workbench/electron-browser/media/shell.css index 160cdbf597b..661d8dac11b 100644 --- a/src/vs/workbench/electron-browser/media/shell.css +++ b/src/vs/workbench/electron-browser/media/shell.css @@ -206,20 +206,6 @@ /* TODO@theme */ -.monaco-shell.vs { - color: #6C6C6C; -} - -.monaco-shell.vs-dark { - color: #BBB; - background-color: #1E1E1E; -} - -.monaco-shell.hc-black { - color: #fff; - background-color: #000; -} - .monaco-shell.vs input { background-color: white; } diff --git a/src/vs/workbench/electron-browser/media/workbench.css b/src/vs/workbench/electron-browser/media/workbench.css index fd1fa6a4ae7..379928f6df8 100644 --- a/src/vs/workbench/electron-browser/media/workbench.css +++ b/src/vs/workbench/electron-browser/media/workbench.css @@ -45,20 +45,6 @@ /* TODO@theme */ -.vs .monaco-workbench { - background-color: #F3F3F3; -} - -.vs-dark .monaco-workbench { - background-color: #252526; - color: #CCC; -} - -.hc-black .monaco-workbench { - color: #FFF; - background-color: #000; -} - .vs #monaco-workbench-drop-overlay { background-color: rgba(51,153,255, 0.18); } diff --git a/src/vs/workbench/electron-browser/shell.ts b/src/vs/workbench/electron-browser/shell.ts index 7e0684ca5b6..b523a7648bb 100644 --- a/src/vs/workbench/electron-browser/shell.ts +++ b/src/vs/workbench/electron-browser/shell.ts @@ -103,6 +103,8 @@ import { join } from 'path'; import 'vs/platform/opener/browser/opener.contribution'; import { IWorkbenchThemeService } from 'vs/workbench/services/themes/common/themeService'; import { WorkbenchThemeService } from 'vs/workbench/services/themes/electron-browser/themeService'; +import { registerThemingParticipant, ITheme, ICssStyleCollector } from 'vs/platform/theme/common/themeService'; +import { WINDOW_FOREGROUND } from 'vs/workbench/common/theme'; /** * Services that we require for the Shell @@ -509,3 +511,10 @@ export class WorkbenchShell { $(this.container).empty(); } } + +registerThemingParticipant((theme: ITheme, collector: ICssStyleCollector) => { + const windowForeground = theme.getColor(WINDOW_FOREGROUND); + if (windowForeground) { + collector.addRule(`.monaco-shell { color: ${windowForeground}; }`); + } +}); \ No newline at end of file -- GitLab