development/vscode
development/vscode
1
0
Fork 0
mirror of https://github.com/Microsoft/vscode synced 2024-08-27 21:09:43 +00:00
Code Issues Packages Projects Releases Wiki Activity

Adopt css colors for notification list (#166725)

Browse source
This commit is contained in:
Matt Bierner 2022-11-18 22:46:50 -08:00 committed by GitHub
parent 796ee2bf3c
commit 63f8550155
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 12 additions and 21 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

6
src/vs/workbench/browser/parts/notifications/media/notificationsList.css
View file

@ -5,6 +5,12 @@
/** Notification: Container */
.monaco-workbench .notifications-list-container {
color: var(--vscode-notifications-foreground);
background: var(--vscode-notifications-background);
outline-color: var(--vscode-contrastBorder);
}
.monaco-workbench .notifications-list-container .notification-list-item {
display: flex;
flex-direction: column;

27
src/vs/workbench/browser/parts/notifications/notificationsList.ts
View file

@ -9,9 +9,9 @@ import { isAncestor, trackFocus } from 'vs/base/browser/dom';
import { WorkbenchList } from 'vs/platform/list/browser/listService';
import { IInstantiationService } from 'vs/platform/instantiation/common/instantiation';
import { IListOptions } from 'vs/base/browser/ui/list/listWidget';
import { NOTIFICATIONS_LINKS, NOTIFICATIONS_BACKGROUND, NOTIFICATIONS_FOREGROUND, NOTIFICATIONS_ERROR_ICON_FOREGROUND, NOTIFICATIONS_WARNING_ICON_FOREGROUND, NOTIFICATIONS_INFO_ICON_FOREGROUND } from 'vs/workbench/common/theme';
import { IThemeService, registerThemingParticipant, Themable } from 'vs/platform/theme/common/themeService';
import { contrastBorder, focusBorder } from 'vs/platform/theme/common/colorRegistry';
import { NOTIFICATIONS_LINKS, NOTIFICATIONS_BACKGROUND, NOTIFICATIONS_ERROR_ICON_FOREGROUND, NOTIFICATIONS_WARNING_ICON_FOREGROUND, NOTIFICATIONS_INFO_ICON_FOREGROUND } from 'vs/workbench/common/theme';
import { registerThemingParticipant } from 'vs/platform/theme/common/themeService';
import { focusBorder } from 'vs/platform/theme/common/colorRegistry';
import { INotificationViewItem } from 'vs/workbench/common/notifications';
import { NotificationsListDelegate, NotificationRenderer } from 'vs/workbench/browser/parts/notifications/notificationsViewer';
import { NotificationActionRunner, CopyNotificationMessageAction } from 'vs/workbench/browser/parts/notifications/notificationsActions';
@ -19,12 +19,13 @@ import { IContextMenuService } from 'vs/platform/contextview/browser/contextView
import { assertIsDefined, assertAllDefined } from 'vs/base/common/types';
import { Codicon } from 'vs/base/common/codicons';
import { NotificationFocusedContext } from 'vs/workbench/common/contextkeys';
import { Disposable } from 'vs/base/common/lifecycle';
export interface INotificationsListOptions extends IListOptions<INotificationViewItem> {
widgetAriaLabel?: string;
}
export class NotificationsList extends Themable {
export class NotificationsList extends Disposable {
private listContainer: HTMLElement | undefined;
private list: WorkbenchList<INotificationViewItem> | undefined;
@ -36,10 +37,9 @@ export class NotificationsList extends Themable {
private readonly container: HTMLElement,
private readonly options: INotificationsListOptions,
@IInstantiationService private readonly instantiationService: IInstantiationService,
@IThemeService themeService: IThemeService,
@IContextMenuService private readonly contextMenuService: IContextMenuService
) {
super(themeService);
super();
}
show(focus?: boolean): void {
@ -153,8 +153,6 @@ export class NotificationsList extends Themable {
}));
this.container.appendChild(this.listContainer);
this.updateStyles();
}
updateNotificationsList(start: number, deleteCount: number, items: INotificationViewItem[] = []) {
@ -252,19 +250,6 @@ export class NotificationsList extends Themable {
return isAncestor(document.activeElement, this.listContainer);
}
protected override updateStyles(): void {
if (this.listContainer) {
const foreground = this.getColor(NOTIFICATIONS_FOREGROUND);
this.listContainer.style.color = foreground ? foreground : '';
const background = this.getColor(NOTIFICATIONS_BACKGROUND);
this.listContainer.style.background = background ? background : '';
const outlineColor = this.getColor(contrastBorder);
this.listContainer.style.outlineColor = outlineColor ? outlineColor : '';
}
}
layout(width: number, maxHeight?: number): void {
if (this.listContainer && this.list) {
this.listContainer.style.width = `${width}px`;