diff --git a/src/vs/workbench/browser/parts/auxiliarybar/auxiliaryBarPart.ts b/src/vs/workbench/browser/parts/auxiliarybar/auxiliaryBarPart.ts index 742969265714c0ad53f1569a9c8e678a8fa17878..006c388becca45e32cd89141ade8eb8f39a9f471 100644 --- a/src/vs/workbench/browser/parts/auxiliarybar/auxiliaryBarPart.ts +++ b/src/vs/workbench/browser/parts/auxiliarybar/auxiliaryBarPart.ts @@ -12,19 +12,20 @@ import { IKeybindingService } from 'vs/platform/keybinding/common/keybinding'; import { INotificationService } from 'vs/platform/notification/common/notification'; import { IStorageService } from 'vs/platform/storage/common/storage'; import { ITelemetryService } from 'vs/platform/telemetry/common/telemetry'; -import { activeContrastBorder, editorBackground, focusBorder } from 'vs/platform/theme/common/colorRegistry'; +import { activeContrastBorder, contrastBorder, editorBackground, focusBorder } from 'vs/platform/theme/common/colorRegistry'; import { IThemeService, registerThemingParticipant } from 'vs/platform/theme/common/themeService'; import { Extensions as PaneCompositeExtensions } from 'vs/workbench/browser/panecomposite'; import { BasePanelPart } from 'vs/workbench/browser/parts/panel/panelPart'; import { ActiveAuxiliaryContext, AuxiliaryBarFocusContext } from 'vs/workbench/common/auxiliarybar'; -import { SIDE_BAR_BACKGROUND, SIDE_BAR_TITLE_FOREGROUND } from 'vs/workbench/common/theme'; +import { SIDE_BAR_BACKGROUND, SIDE_BAR_BORDER, SIDE_BAR_TITLE_FOREGROUND } from 'vs/workbench/common/theme'; import { IViewDescriptorService, ViewContainerLocation } from 'vs/workbench/common/views'; import { IExtensionService } from 'vs/workbench/services/extensions/common/extensions'; -import { IWorkbenchLayoutService, Parts } from 'vs/workbench/services/layout/browser/layoutService'; +import { IWorkbenchLayoutService, Parts, Position } from 'vs/workbench/services/layout/browser/layoutService'; import { IActivityHoverOptions } from 'vs/workbench/browser/parts/compositeBarActions'; import { HoverPosition } from 'vs/base/browser/ui/hover/hoverWidget'; import { IAction, Separator } from 'vs/base/common/actions'; import { ToggleAuxiliaryBarAction } from 'vs/workbench/browser/parts/auxiliarybar/auxiliaryBarActions'; +import { assertIsDefined } from 'vs/base/common/types'; export class AuxiliaryBarPart extends BasePanelPart { static readonly activePanelSettingsKey = 'workbench.auxiliarybar.activepanelid'; @@ -60,6 +61,7 @@ export class AuxiliaryBarPart extends BasePanelPart { ViewContainerLocation.AuxiliaryBar, ActiveAuxiliaryContext.bindTo(contextKeyService), AuxiliaryBarFocusContext.bindTo(contextKeyService), + () => (this.getColor(SIDE_BAR_BORDER) || this.getColor(contrastBorder)) ? 1 : 0, notificationService, storageService, telemetryService, @@ -74,6 +76,28 @@ export class AuxiliaryBarPart extends BasePanelPart { ); } + // override layout(width: number, height: number, top: number, left: number): void { + // // Layout contents + // super.layout(width, height, top, left); // Take into account the 1px border when layouting + // } + + override updateStyles(): void { + super.updateStyles(); + + const container = assertIsDefined(this.getContainer()); + const borderColor = this.getColor(SIDE_BAR_BORDER) || this.getColor(contrastBorder); + const isPositionLeft = this.layoutService.getSideBarPosition() === Position.RIGHT; + + container.style.borderLeftColor = borderColor ?? ''; + container.style.borderRightColor = borderColor ?? ''; + + container.style.borderLeftStyle = borderColor && !isPositionLeft ? 'solid' : 'none'; + container.style.borderRightStyle = borderColor && isPositionLeft ? 'solid' : 'none'; + + container.style.borderLeftWidth = borderColor && !isPositionLeft ? '1px' : '0px'; + container.style.borderRightWidth = borderColor && isPositionLeft ? '1px' : '0px'; + } + protected getActivityHoverOptions(): IActivityHoverOptions { return { position: () => HoverPosition.BELOW diff --git a/src/vs/workbench/browser/parts/panel/panelPart.ts b/src/vs/workbench/browser/parts/panel/panelPart.ts index 0b2ff517030fd4072fa83917e458051adbab58e8..2e29a8fca84a2087ddcc49a6bc377b9f75f153eb 100644 --- a/src/vs/workbench/browser/parts/panel/panelPart.ts +++ b/src/vs/workbench/browser/parts/panel/panelPart.ts @@ -112,6 +112,7 @@ export abstract class BasePanelPart extends CompositePart impleme private readonly viewContainerLocation: ViewContainerLocation, private readonly activePanelContextKey: IContextKey, private panelFocusContextKey: IContextKey, + borderWidth: (() => number) | undefined, @INotificationService notificationService: INotificationService, @IStorageService storageService: IStorageService, @ITelemetryService telemetryService: ITelemetryService, @@ -140,7 +141,7 @@ export abstract class BasePanelPart extends CompositePart impleme 'panel', undefined, partId, - { hasTitle: true } + { hasTitle: true, borderWidth } ); this.panelRegistry = Registry.as(panelRegistryId); @@ -476,13 +477,13 @@ export abstract class BasePanelPart extends CompositePart impleme const container = assertIsDefined(this.getContainer()); container.style.backgroundColor = this.getColor(this.backgroundColor) || ''; - const borderColor = this.getColor(PANEL_BORDER) || this.getColor(contrastBorder) || ''; + const borderColor = this.getColor(contrastBorder) || ''; container.style.borderLeftColor = borderColor; container.style.borderRightColor = borderColor; const title = this.getTitleArea(); if (title) { - title.style.borderTopColor = this.getColor(PANEL_BORDER) || this.getColor(contrastBorder) || ''; + title.style.borderTopColor = this.getColor(contrastBorder) || ''; } } @@ -840,6 +841,7 @@ export class PanelPart extends BasePanelPart { ViewContainerLocation.Panel, ActivePanelContext.bindTo(contextKeyService), PanelFocusContext.bindTo(contextKeyService), + undefined, notificationService, storageService, telemetryService, @@ -858,6 +860,20 @@ export class PanelPart extends BasePanelPart { this._register(this.globalActions.onDidChange(() => this.updateGlobalToolbarActions())); } + override updateStyles(): void { + super.updateStyles(); + + const container = assertIsDefined(this.getContainer()); + const borderColor = this.getColor(PANEL_BORDER) || this.getColor(contrastBorder) || ''; + container.style.borderLeftColor = borderColor; + container.style.borderRightColor = borderColor; + + const title = this.getTitleArea(); + if (title) { + title.style.borderTopColor = this.getColor(PANEL_BORDER) || this.getColor(contrastBorder) || ''; + } + } + protected getActivityHoverOptions(): IActivityHoverOptions { return { position: () => this.layoutService.getPanelPosition() === Position.BOTTOM && !this.layoutService.isPanelMaximized() ? HoverPosition.ABOVE : HoverPosition.BELOW,