mirror of
https://github.com/microsoft/vscode.git
synced 2026-05-08 17:19:48 +01:00
Fix more TS 3.7 dom typings errors
Use an empty string instead of null for reseting styles
This commit is contained in:
@@ -229,8 +229,8 @@ export abstract class Panel extends Disposable implements IView {
|
||||
this.header.setAttribute('aria-expanded', String(expanded));
|
||||
|
||||
this.header.style.color = this.styles.headerForeground ? this.styles.headerForeground.toString() : null;
|
||||
this.header.style.backgroundColor = this.styles.headerBackground ? this.styles.headerBackground.toString() : null;
|
||||
this.header.style.borderTop = this.styles.headerBorder ? `1px solid ${this.styles.headerBorder}` : null;
|
||||
this.header.style.backgroundColor = this.styles.headerBackground ? this.styles.headerBackground.toString() : '';
|
||||
this.header.style.borderTop = this.styles.headerBorder ? `1px solid ${this.styles.headerBorder}` : '';
|
||||
this._dropBackground = this.styles.dropBackground;
|
||||
}
|
||||
|
||||
@@ -340,7 +340,7 @@ class PanelDraggable extends Disposable {
|
||||
backgroundColor = (this.panel.dropBackground || PanelDraggable.DefaultDragOverBackgroundColor).toString();
|
||||
}
|
||||
|
||||
this.panel.dropTargetElement.style.backgroundColor = backgroundColor;
|
||||
this.panel.dropTargetElement.style.backgroundColor = backgroundColor || '';
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@@ -396,16 +396,16 @@ export class QuickOpenWidget extends Disposable implements IModelProvider {
|
||||
protected applyStyles(): void {
|
||||
if (this.element) {
|
||||
const foreground = this.styles.foreground ? this.styles.foreground.toString() : null;
|
||||
const background = this.styles.background ? this.styles.background.toString() : null;
|
||||
const borderColor = this.styles.borderColor ? this.styles.borderColor.toString() : null;
|
||||
const widgetShadow = this.styles.widgetShadow ? this.styles.widgetShadow.toString() : null;
|
||||
const background = this.styles.background ? this.styles.background.toString() : '';
|
||||
const borderColor = this.styles.borderColor ? this.styles.borderColor.toString() : '';
|
||||
const widgetShadow = this.styles.widgetShadow ? this.styles.widgetShadow.toString() : '';
|
||||
|
||||
this.element.style.color = foreground;
|
||||
this.element.style.backgroundColor = background;
|
||||
this.element.style.borderColor = borderColor;
|
||||
this.element.style.borderWidth = borderColor ? '1px' : null;
|
||||
this.element.style.borderStyle = borderColor ? 'solid' : null;
|
||||
this.element.style.boxShadow = widgetShadow ? `0 5px 8px ${widgetShadow}` : null;
|
||||
this.element.style.borderWidth = borderColor ? '1px' : '';
|
||||
this.element.style.borderStyle = borderColor ? 'solid' : '';
|
||||
this.element.style.boxShadow = widgetShadow ? `0 5px 8px ${widgetShadow}` : '';
|
||||
}
|
||||
|
||||
if (this.progressBar) {
|
||||
|
||||
@@ -227,16 +227,16 @@ export class NotificationsCenter extends Themable {
|
||||
protected updateStyles(): void {
|
||||
if (this.notificationsCenterContainer && this.notificationsCenterHeader) {
|
||||
const widgetShadowColor = this.getColor(widgetShadow);
|
||||
this.notificationsCenterContainer.style.boxShadow = widgetShadowColor ? `0 0px 8px ${widgetShadowColor}` : null;
|
||||
this.notificationsCenterContainer.style.boxShadow = widgetShadowColor ? `0 0px 8px ${widgetShadowColor}` : '';
|
||||
|
||||
const borderColor = this.getColor(NOTIFICATIONS_CENTER_BORDER);
|
||||
this.notificationsCenterContainer.style.border = borderColor ? `1px solid ${borderColor}` : null;
|
||||
this.notificationsCenterContainer.style.border = borderColor ? `1px solid ${borderColor}` : '';
|
||||
|
||||
const headerForeground = this.getColor(NOTIFICATIONS_CENTER_HEADER_FOREGROUND);
|
||||
this.notificationsCenterHeader.style.color = headerForeground ? headerForeground.toString() : null;
|
||||
|
||||
const headerBackground = this.getColor(NOTIFICATIONS_CENTER_HEADER_BACKGROUND);
|
||||
this.notificationsCenterHeader.style.background = headerBackground ? headerBackground.toString() : null;
|
||||
this.notificationsCenterHeader.style.background = headerBackground ? headerBackground.toString() : '';
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@@ -221,7 +221,7 @@ export class NotificationsList extends Themable {
|
||||
this.listContainer.style.color = foreground ? foreground.toString() : null;
|
||||
|
||||
const background = this.getColor(NOTIFICATIONS_BACKGROUND);
|
||||
this.listContainer.style.background = background ? background.toString() : null;
|
||||
this.listContainer.style.background = background ? background.toString() : '';
|
||||
|
||||
const outlineColor = this.getColor(contrastBorder);
|
||||
this.listContainer.style.outlineColor = outlineColor ? outlineColor.toString() : '';
|
||||
|
||||
@@ -71,7 +71,7 @@ export class PanelPart extends CompositePart<Panel> implements IPanelService {
|
||||
|
||||
//#endregion
|
||||
|
||||
get onDidPanelOpen(): Event<{ panel: IPanel, focus: boolean }> { return Event.map(this.onDidCompositeOpen.event, compositeOpen => ({ panel: compositeOpen.composite, focus: compositeOpen.focus })); }
|
||||
get onDidPanelOpen(): Event<{ panel: IPanel, focus: boolean; }> { return Event.map(this.onDidCompositeOpen.event, compositeOpen => ({ panel: compositeOpen.composite, focus: compositeOpen.focus })); }
|
||||
readonly onDidPanelClose: Event<IPanel> = this.onDidCompositeClose.event;
|
||||
|
||||
private _onDidVisibilityChange = this._register(new Emitter<boolean>());
|
||||
@@ -81,7 +81,7 @@ export class PanelPart extends CompositePart<Panel> implements IPanelService {
|
||||
private panelFocusContextKey: IContextKey<boolean>;
|
||||
|
||||
private compositeBar: CompositeBar;
|
||||
private compositeActions: Map<string, { activityAction: PanelActivityAction, pinnedAction: ToggleCompositePinnedAction }> = new Map();
|
||||
private compositeActions: Map<string, { activityAction: PanelActivityAction, pinnedAction: ToggleCompositePinnedAction; }> = new Map();
|
||||
|
||||
private blockOpeningPanel = false;
|
||||
private _contentDimension: Dimension | undefined;
|
||||
@@ -209,12 +209,12 @@ export class PanelPart extends CompositePart<Panel> implements IPanelService {
|
||||
super.updateStyles();
|
||||
|
||||
const container = assertIsDefined(this.getContainer());
|
||||
container.style.backgroundColor = this.getColor(PANEL_BACKGROUND);
|
||||
container.style.borderLeftColor = this.getColor(PANEL_BORDER) || this.getColor(contrastBorder);
|
||||
container.style.backgroundColor = this.getColor(PANEL_BACKGROUND) || '';
|
||||
container.style.borderLeftColor = this.getColor(PANEL_BORDER) || this.getColor(contrastBorder) || '';
|
||||
|
||||
const title = this.getTitleArea();
|
||||
if (title) {
|
||||
title.style.borderTopColor = this.getColor(PANEL_BORDER) || this.getColor(contrastBorder);
|
||||
title.style.borderTopColor = this.getColor(PANEL_BORDER) || this.getColor(contrastBorder) || '';
|
||||
}
|
||||
}
|
||||
|
||||
@@ -326,7 +326,7 @@ export class PanelPart extends CompositePart<Panel> implements IPanelService {
|
||||
}
|
||||
}
|
||||
|
||||
private getCompositeActions(compositeId: string): { activityAction: PanelActivityAction, pinnedAction: ToggleCompositePinnedAction } {
|
||||
private getCompositeActions(compositeId: string): { activityAction: PanelActivityAction, pinnedAction: ToggleCompositePinnedAction; } {
|
||||
let compositeActions = this.compositeActions.get(compositeId);
|
||||
if (!compositeActions) {
|
||||
compositeActions = {
|
||||
|
||||
@@ -159,7 +159,7 @@ class ListElementRenderer implements IListRenderer<ListElement, IListElementTemp
|
||||
// Separator
|
||||
if (element.separator && element.separator.label) {
|
||||
data.separator.textContent = element.separator.label;
|
||||
data.separator.style.display = null;
|
||||
data.separator.style.display = '';
|
||||
} else {
|
||||
data.separator.style.display = 'none';
|
||||
}
|
||||
|
||||
@@ -176,17 +176,17 @@ export class SidebarPart extends CompositePart<Viewlet> implements IViewletServi
|
||||
// Part container
|
||||
const container = assertIsDefined(this.getContainer());
|
||||
|
||||
container.style.backgroundColor = this.getColor(SIDE_BAR_BACKGROUND);
|
||||
container.style.backgroundColor = this.getColor(SIDE_BAR_BACKGROUND) || '';
|
||||
container.style.color = this.getColor(SIDE_BAR_FOREGROUND);
|
||||
|
||||
const borderColor = this.getColor(SIDE_BAR_BORDER) || this.getColor(contrastBorder);
|
||||
const isPositionLeft = this.layoutService.getSideBarPosition() === SideBarPosition.LEFT;
|
||||
container.style.borderRightWidth = borderColor && isPositionLeft ? '1px' : null;
|
||||
container.style.borderRightStyle = borderColor && isPositionLeft ? 'solid' : null;
|
||||
container.style.borderRightColor = isPositionLeft ? borderColor : null;
|
||||
container.style.borderLeftWidth = borderColor && !isPositionLeft ? '1px' : null;
|
||||
container.style.borderLeftStyle = borderColor && !isPositionLeft ? 'solid' : null;
|
||||
container.style.borderLeftColor = !isPositionLeft ? borderColor : null;
|
||||
container.style.borderRightWidth = borderColor && isPositionLeft ? '1px' : '';
|
||||
container.style.borderRightStyle = borderColor && isPositionLeft ? 'solid' : '';
|
||||
container.style.borderRightColor = isPositionLeft ? borderColor || '' : '';
|
||||
container.style.borderLeftWidth = borderColor && !isPositionLeft ? '1px' : '';
|
||||
container.style.borderLeftStyle = borderColor && !isPositionLeft ? 'solid' : '';
|
||||
container.style.borderLeftColor = !isPositionLeft ? borderColor || '' : '';
|
||||
}
|
||||
|
||||
layout(width: number, height: number): void {
|
||||
|
||||
@@ -578,7 +578,7 @@ export class StatusbarPart extends Part implements IStatusbarService {
|
||||
const container = assertIsDefined(this.getContainer());
|
||||
|
||||
// Background colors
|
||||
const backgroundColor = this.getColor(this.contextService.getWorkbenchState() !== WorkbenchState.EMPTY ? STATUS_BAR_BACKGROUND : STATUS_BAR_NO_FOLDER_BACKGROUND);
|
||||
const backgroundColor = this.getColor(this.contextService.getWorkbenchState() !== WorkbenchState.EMPTY ? STATUS_BAR_BACKGROUND : STATUS_BAR_NO_FOLDER_BACKGROUND) || '';
|
||||
container.style.backgroundColor = backgroundColor;
|
||||
container.style.color = this.getColor(this.contextService.getWorkbenchState() !== WorkbenchState.EMPTY ? STATUS_BAR_FOREGROUND : STATUS_BAR_NO_FOLDER_FOREGROUND);
|
||||
|
||||
@@ -784,7 +784,7 @@ class StatusbarEntryItem extends Disposable {
|
||||
}
|
||||
|
||||
if (isBackground) {
|
||||
container.style.backgroundColor = colorResult;
|
||||
container.style.backgroundColor = colorResult || '';
|
||||
} else {
|
||||
container.style.color = colorResult;
|
||||
}
|
||||
|
||||
@@ -507,7 +507,7 @@ export class TitlebarPart extends Part implements ITitleService {
|
||||
removeClass(this.element, 'inactive');
|
||||
}
|
||||
|
||||
const titleBackground = this.getColor(this.isInactive ? TITLE_BAR_INACTIVE_BACKGROUND : TITLE_BAR_ACTIVE_BACKGROUND);
|
||||
const titleBackground = this.getColor(this.isInactive ? TITLE_BAR_INACTIVE_BACKGROUND : TITLE_BAR_ACTIVE_BACKGROUND) || '';
|
||||
this.element.style.backgroundColor = titleBackground;
|
||||
if (titleBackground && Color.fromHex(titleBackground).isLighter()) {
|
||||
addClass(this.element, 'light');
|
||||
@@ -519,7 +519,7 @@ export class TitlebarPart extends Part implements ITitleService {
|
||||
this.element.style.color = titleForeground;
|
||||
|
||||
const titleBorder = this.getColor(TITLE_BAR_BORDER);
|
||||
this.element.style.borderBottom = titleBorder ? `1px solid ${titleBorder}` : null;
|
||||
this.element.style.borderBottom = titleBorder ? `1px solid ${titleBorder}` : '';
|
||||
}
|
||||
}
|
||||
|
||||
@@ -559,8 +559,8 @@ export class TitlebarPart extends Part implements ITitleService {
|
||||
// Center between menu and window controls
|
||||
if (leftMarker > (this.element.clientWidth - this.title.clientWidth) / 2 ||
|
||||
rightMarker < (this.element.clientWidth + this.title.clientWidth) / 2) {
|
||||
this.title.style.position = null;
|
||||
this.title.style.left = null;
|
||||
this.title.style.position = '';
|
||||
this.title.style.left = '';
|
||||
this.title.style.transform = '';
|
||||
return;
|
||||
}
|
||||
|
||||
@@ -122,8 +122,8 @@ export class StartDebugActionViewItem implements IActionViewItem {
|
||||
}
|
||||
}));
|
||||
this.toDispose.push(attachStylerCallback(this.themeService, { selectBorder }, colors => {
|
||||
this.container.style.border = colors.selectBorder ? `1px solid ${colors.selectBorder}` : null;
|
||||
selectBoxContainer.style.borderLeft = colors.selectBorder ? `1px solid ${colors.selectBorder}` : null;
|
||||
this.container.style.border = colors.selectBorder ? `1px solid ${colors.selectBorder}` : '';
|
||||
selectBoxContainer.style.borderLeft = colors.selectBorder ? `1px solid ${colors.selectBorder}` : '';
|
||||
}));
|
||||
|
||||
this.updateOptions();
|
||||
|
||||
@@ -94,12 +94,12 @@ export class DebugHoverWidget implements IContentWidget {
|
||||
if (colors.editorHoverBackground) {
|
||||
this.domNode.style.backgroundColor = colors.editorHoverBackground.toString();
|
||||
} else {
|
||||
this.domNode.style.backgroundColor = null;
|
||||
this.domNode.style.backgroundColor = '';
|
||||
}
|
||||
if (colors.editorHoverBorder) {
|
||||
this.domNode.style.border = `1px solid ${colors.editorHoverBorder}`;
|
||||
} else {
|
||||
this.domNode.style.border = null;
|
||||
this.domNode.style.border = '';
|
||||
}
|
||||
}));
|
||||
this.toDispose.push(this.tree.onDidChangeContentHeight(() => this.layoutTreeAndContainer()));
|
||||
|
||||
@@ -192,10 +192,10 @@ export class DebugToolBar extends Themable implements IWorkbenchContribution {
|
||||
super.updateStyles();
|
||||
|
||||
if (this.$el) {
|
||||
this.$el.style.backgroundColor = this.getColor(debugToolBarBackground);
|
||||
this.$el.style.backgroundColor = this.getColor(debugToolBarBackground) || '';
|
||||
|
||||
const widgetShadowColor = this.getColor(widgetShadow);
|
||||
this.$el.style.boxShadow = widgetShadowColor ? `0 5px 8px ${widgetShadowColor}` : null;
|
||||
this.$el.style.boxShadow = widgetShadowColor ? `0 5px 8px ${widgetShadowColor}` : '';
|
||||
|
||||
const contrastBorderColor = this.getColor(contrastBorder);
|
||||
const borderColor = this.getColor(debugToolBarBorder);
|
||||
|
||||
@@ -142,7 +142,7 @@ export class FeedbackDropdown extends Dropdown {
|
||||
}));
|
||||
|
||||
disposables.add(dom.addDisposableListener(closeBtn, dom.EventType.MOUSE_OUT, () => {
|
||||
closeBtn.style.backgroundColor = null;
|
||||
closeBtn.style.backgroundColor = '';
|
||||
}));
|
||||
|
||||
this.invoke(closeBtn, disposables, () => this.hide());
|
||||
@@ -276,17 +276,17 @@ export class FeedbackDropdown extends Dropdown {
|
||||
|
||||
disposables.add(attachStylerCallback(this.themeService, { widgetShadow, editorWidgetBackground, editorWidgetForeground, inputBackground, inputForeground, inputBorder, editorBackground, contrastBorder }, colors => {
|
||||
if (this.feedbackForm) {
|
||||
this.feedbackForm.style.backgroundColor = colors.editorWidgetBackground ? colors.editorWidgetBackground.toString() : null;
|
||||
this.feedbackForm.style.backgroundColor = colors.editorWidgetBackground ? colors.editorWidgetBackground.toString() : '';
|
||||
this.feedbackForm.style.color = colors.editorWidgetForeground ? colors.editorWidgetForeground.toString() : null;
|
||||
this.feedbackForm.style.boxShadow = colors.widgetShadow ? `0 0 8px ${colors.widgetShadow}` : null;
|
||||
this.feedbackForm.style.boxShadow = colors.widgetShadow ? `0 0 8px ${colors.widgetShadow}` : '';
|
||||
}
|
||||
if (this.feedbackDescriptionInput) {
|
||||
this.feedbackDescriptionInput.style.backgroundColor = colors.inputBackground ? colors.inputBackground.toString() : null;
|
||||
this.feedbackDescriptionInput.style.backgroundColor = colors.inputBackground ? colors.inputBackground.toString() : '';
|
||||
this.feedbackDescriptionInput.style.color = colors.inputForeground ? colors.inputForeground.toString() : null;
|
||||
this.feedbackDescriptionInput.style.border = `1px solid ${colors.inputBorder || 'transparent'}`;
|
||||
}
|
||||
|
||||
contactUsContainer.style.backgroundColor = colors.editorBackground ? colors.editorBackground.toString() : null;
|
||||
contactUsContainer.style.backgroundColor = colors.editorBackground ? colors.editorBackground.toString() : '';
|
||||
contactUsContainer.style.border = `1px solid ${colors.contrastBorder || 'transparent'}`;
|
||||
}));
|
||||
|
||||
|
||||
@@ -196,14 +196,14 @@ export class MarkersFilterActionViewItem extends BaseActionViewItem {
|
||||
private createBadge(container: HTMLElement): void {
|
||||
const filterBadge = this.filterBadge = DOM.append(container, DOM.$('.markers-panel-filter-badge'));
|
||||
this._register(attachStylerCallback(this.themeService, { badgeBackground, badgeForeground, contrastBorder }, colors => {
|
||||
const background = colors.badgeBackground ? colors.badgeBackground.toString() : null;
|
||||
const foreground = colors.badgeForeground ? colors.badgeForeground.toString() : null;
|
||||
const border = colors.contrastBorder ? colors.contrastBorder.toString() : null;
|
||||
const background = colors.badgeBackground ? colors.badgeBackground.toString() : '';
|
||||
const foreground = colors.badgeForeground ? colors.badgeForeground.toString() : '';
|
||||
const border = colors.contrastBorder ? colors.contrastBorder.toString() : '';
|
||||
|
||||
filterBadge.style.backgroundColor = background;
|
||||
|
||||
filterBadge.style.borderWidth = border ? '1px' : null;
|
||||
filterBadge.style.borderStyle = border ? 'solid' : null;
|
||||
filterBadge.style.borderWidth = border ? '1px' : '';
|
||||
filterBadge.style.borderStyle = border ? 'solid' : '';
|
||||
filterBadge.style.borderColor = border;
|
||||
filterBadge.style.color = foreground;
|
||||
}));
|
||||
|
||||
Reference in New Issue
Block a user