Skip to content

Commit 46f41f1

Browse files
author
Miguel Solorio
committed
Move color styles to respective areas
1 parent 67c431e commit 46f41f1

4 files changed

Lines changed: 51 additions & 38 deletions

File tree

src/vs/platform/theme/common/colorRegistry.ts

Lines changed: 1 addition & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -179,6 +179,7 @@ export function getColorRegistry(): IColorRegistry {
179179
export const foreground = registerColor('foreground', { dark: '#CCCCCC', light: '#616161', hc: '#FFFFFF' }, nls.localize('foreground', "Overall foreground color. This color is only used if not overridden by a component."));
180180
export const errorForeground = registerColor('errorForeground', { dark: '#F48771', light: '#A1260D', hc: '#F48771' }, nls.localize('errorForeground', "Overall foreground color for error messages. This color is only used if not overridden by a component."));
181181
export const descriptionForeground = registerColor('descriptionForeground', { light: '#717171', dark: transparent(foreground, 0.7), hc: transparent(foreground, 0.7) }, nls.localize('descriptionForeground', "Foreground color for description text providing additional information, for example for a label."));
182+
export const iconForeground = registerColor('icon.foreground', { dark: '#C5C5C5', light: '#424242', hc: '#FFFFFF' }, nls.localize('iconForeground', "The default color for icons in the workbench."));
182183

183184
export const focusBorder = registerColor('focusBorder', { dark: Color.fromHex('#0E639C').transparent(0.8), light: Color.fromHex('#007ACC').transparent(0.4), hc: '#F38518' }, nls.localize('focusBorder', "Overall border color for focused elements. This color is only used if not overridden by a component."));
184185

@@ -187,12 +188,6 @@ export const activeContrastBorder = registerColor('contrastActiveBorder', { ligh
187188

188189
export const selectionBackground = registerColor('selection.background', { light: null, dark: null, hc: null }, nls.localize('selectionBackground', "The background color of text selections in the workbench (e.g. for input fields or text areas). Note that this does not apply to selections within the editor."));
189190

190-
// ------ icon colors
191-
export const iconForeground = registerColor('icon.foreground', { dark: '#C5C5C5', light: '#424242', hc: '#FFFFFF' }, nls.localize('iconForeground', "The default color for icons in the workbench."));
192-
export const notificationErrorIconForeground = registerColor('notificationErrorIcon.foreground', { dark: '#F48771', light: '#A1260D', hc: '#F48771' }, nls.localize('notificationErrorIconForeground', "The color used for the notification error icon."));
193-
export const notificationWarningIconForeground = registerColor('notificationWarningIcon.foreground', { dark: '#FFCC00', light: '#DDB100', hc: '#FFCC00' }, nls.localize('notificationWarningIconForeground', "The color used for the notification warning icon."));
194-
export const notificationInfoForeground = registerColor('notificationInfoIcon.foreground', { dark: '#75BEFF', light: '#007ACC', hc: '#75BEFF' }, nls.localize('notificationInfoIconForeground', "The color used for the notification info icon."));
195-
196191
// ------ text colors
197192

198193
export const textSeparatorForeground = registerColor('textSeparator.foreground', { light: '#0000002e', dark: '#ffffff2e', hc: Color.black }, nls.localize('textSeparatorForeground', "Color for text separators."));

src/vs/workbench/browser/parts/notifications/notificationsList.ts

Lines changed: 31 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,7 @@ import { addClass, isAncestor, trackFocus } from 'vs/base/browser/dom';
88
import { WorkbenchList } from 'vs/platform/list/browser/listService';
99
import { IInstantiationService } from 'vs/platform/instantiation/common/instantiation';
1010
import { IListOptions } from 'vs/base/browser/ui/list/listWidget';
11-
import { Themable, NOTIFICATIONS_LINKS, NOTIFICATIONS_BACKGROUND, NOTIFICATIONS_FOREGROUND } from 'vs/workbench/common/theme';
11+
import { Themable, NOTIFICATIONS_LINKS, NOTIFICATIONS_BACKGROUND, NOTIFICATIONS_FOREGROUND, NOTIFICATIONS_ERROR_ICON_FOREGROUND, NOTIFICATIONS_WARNING_ICON_FOREGROUND, NOTIFICATIONS_INFO_ICON_FOREGROUND } from 'vs/workbench/common/theme';
1212
import { IThemeService, registerThemingParticipant, ITheme, ICssStyleCollector } from 'vs/platform/theme/common/themeService';
1313
import { contrastBorder, focusBorder } from 'vs/platform/theme/common/colorRegistry';
1414
import { INotificationViewItem } from 'vs/workbench/common/notifications';
@@ -256,4 +256,34 @@ registerThemingParticipant((theme: ITheme, collector: ICssStyleCollector) => {
256256
outline-color: ${focusOutline};
257257
}`);
258258
}
259+
260+
// Notification Error Icon
261+
const notificationErrorIconForegroundColor = theme.getColor(NOTIFICATIONS_ERROR_ICON_FOREGROUND);
262+
if (notificationErrorIconForegroundColor) {
263+
collector.addRule(`
264+
.monaco-workbench .notifications-center .codicon-error,
265+
.monaco-workbench .notifications-toasts .codicon-error {
266+
color: ${notificationErrorIconForegroundColor};
267+
}`);
268+
}
269+
270+
// Notification Warning Icon
271+
const notificationWarningIconForegroundColor = theme.getColor(NOTIFICATIONS_WARNING_ICON_FOREGROUND);
272+
if (notificationWarningIconForegroundColor) {
273+
collector.addRule(`
274+
.monaco-workbench .notifications-center .codicon-warning,
275+
.monaco-workbench .notifications-toasts .codicon-warning {
276+
color: ${notificationWarningIconForegroundColor};
277+
}`);
278+
}
279+
280+
// Notification Info Icon
281+
const notificationInfoIconForegroundColor = theme.getColor(NOTIFICATIONS_INFO_ICON_FOREGROUND);
282+
if (notificationInfoIconForegroundColor) {
283+
collector.addRule(`
284+
.monaco-workbench .notifications-center .codicon-info,
285+
.monaco-workbench .notifications-toasts .codicon-info {
286+
color: ${notificationInfoIconForegroundColor};
287+
}`);
288+
}
259289
});

src/vs/workbench/browser/style.ts

Lines changed: 1 addition & 31 deletions
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@
66
import 'vs/css!./media/style';
77

88
import { registerThemingParticipant, ITheme, ICssStyleCollector, HIGH_CONTRAST } from 'vs/platform/theme/common/themeService';
9-
import { iconForeground, notificationErrorIconForeground, notificationWarningIconForeground, notificationInfoForeground, foreground, selectionBackground, focusBorder, scrollbarShadow, scrollbarSliderActiveBackground, scrollbarSliderBackground, scrollbarSliderHoverBackground, listHighlightForeground, inputPlaceholderForeground } from 'vs/platform/theme/common/colorRegistry';
9+
import { iconForeground, foreground, selectionBackground, focusBorder, scrollbarShadow, scrollbarSliderActiveBackground, scrollbarSliderBackground, scrollbarSliderHoverBackground, listHighlightForeground, inputPlaceholderForeground } from 'vs/platform/theme/common/colorRegistry';
1010
import { WORKBENCH_BACKGROUND } from 'vs/workbench/common/theme';
1111

1212
registerThemingParticipant((theme: ITheme, collector: ICssStyleCollector) => {
@@ -17,36 +17,6 @@ registerThemingParticipant((theme: ITheme, collector: ICssStyleCollector) => {
1717
collector.addRule(`.monaco-workbench .codicon { color: ${iconForegroundColor}; }`);
1818
}
1919

20-
// Notification Error Icon
21-
const notificationErrorIconForegroundColor = theme.getColor(notificationErrorIconForeground);
22-
if (notificationErrorIconForegroundColor) {
23-
collector.addRule(`
24-
.monaco-workbench .notifications-center .codicon-error,
25-
.monaco-workbench .notifications-toasts .codicon-error {
26-
color: ${notificationErrorIconForegroundColor};
27-
}`);
28-
}
29-
30-
// Notification Warning Icon
31-
const notificationWarningIconForegroundColor = theme.getColor(notificationWarningIconForeground);
32-
if (notificationWarningIconForegroundColor) {
33-
collector.addRule(`
34-
.monaco-workbench .notifications-center .codicon-warning,
35-
.monaco-workbench .notifications-toasts .codicon-warning {
36-
color: ${notificationWarningIconForegroundColor};
37-
}`);
38-
}
39-
40-
// Notification Info Icon
41-
const notificationInfoIconForegroundColor = theme.getColor(notificationInfoForeground);
42-
if (notificationInfoIconForegroundColor) {
43-
collector.addRule(`
44-
.monaco-workbench .notifications-center .codicon-info,
45-
.monaco-workbench .notifications-toasts .codicon-info {
46-
color: ${notificationInfoIconForegroundColor};
47-
}`);
48-
}
49-
5020
// Foreground
5121
const windowForeground = theme.getColor(foreground);
5222
if (windowForeground) {

src/vs/workbench/common/theme.ts

Lines changed: 18 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -559,6 +559,24 @@ export const NOTIFICATIONS_BORDER = registerColor('notifications.border', {
559559
hc: NOTIFICATIONS_CENTER_HEADER_BACKGROUND
560560
}, nls.localize('notificationsBorder', "Notifications border color separating from other notifications in the notifications center. Notifications slide in from the bottom right of the window."));
561561

562+
export const NOTIFICATIONS_ERROR_ICON_FOREGROUND = registerColor('notificationsErrorIcon.foreground', {
563+
dark: '#F48771',
564+
light: '#A1260D',
565+
hc: '#F48771'
566+
}, nls.localize('notificationsErrorIconForeground', "The color used for the notification error icon."));
567+
568+
export const NOTIFICATIONS_WARNING_ICON_FOREGROUND = registerColor('notificationsWarningIcon.foreground', {
569+
dark: '#FFCC00',
570+
light: '#DDB100',
571+
hc: '#FFCC00'
572+
}, nls.localize('notificationsWarningIconForeground', "The color used for the notification warning icon."));
573+
574+
export const NOTIFICATIONS_INFO_ICON_FOREGROUND = registerColor('notificationsInfoIcon.foreground', {
575+
dark: '#75BEFF',
576+
light: '#007ACC',
577+
hc: '#75BEFF'
578+
}, nls.localize('notificationsInfoIconForeground', "The color used for the notification info icon."));
579+
562580
/**
563581
* Base class for all themable workbench components.
564582
*/

0 commit comments

Comments
 (0)