fixes #36529

src/vs/workbench/browser/parts/activitybar/activitybarActions.ts

@@ -20,6 +20,7 @@ import { activeContrastBorder, focusBorder } from 'vs/platform/theme/common/colo
 import { StandardMouseEvent } from 'vs/base/browser/mouseEvent';
 import { KeyCode } from 'vs/base/common/keyCodes';
 import { StandardKeyboardEvent } from 'vs/base/browser/keyboardEvent';
+import { ACTIVITY_BAR_FOREGROUND } from 'vs/workbench/common/theme';
 import { ActivityAction, ActivityActionItem } from 'vs/workbench/browser/parts/compositebar/compositeBarActions';
 
 export class ViewletActivityAction extends ActivityAction {
@@ -97,7 +98,7 @@ export class GlobalActivityActionItem extends ActivityActionItem {
 		@IThemeService themeService: IThemeService,
 		@IContextMenuService protected contextMenuService: IContextMenuService
 	) {
-		super(action, { draggable: false }, themeService);
+		super(action, { draggable: false, backgroundColor: ACTIVITY_BAR_FOREGROUND }, themeService);
 	}
 
 	public render(container: HTMLElement): void {

src/vs/workbench/browser/parts/activitybar/activitybarPart.ts

@@ -27,7 +27,7 @@ import { StandardMouseEvent } from 'vs/base/browser/mouseEvent';
 import { dispose, IDisposable, toDisposable } from 'vs/base/common/lifecycle';
 import { ToggleActivityBarVisibilityAction } from 'vs/workbench/browser/actions/toggleActivityBarVisibility';
 import { IThemeService } from 'vs/platform/theme/common/themeService';
-import { ACTIVITY_BAR_BACKGROUND, ACTIVITY_BAR_BORDER } from 'vs/workbench/common/theme';
+import { ACTIVITY_BAR_BACKGROUND, ACTIVITY_BAR_BORDER, ACTIVITY_BAR_FOREGROUND } from 'vs/workbench/common/theme';
 import { contrastBorder } from 'vs/platform/theme/common/colorRegistry';
 import { CompositeBar } from 'vs/workbench/browser/parts/compositebar/compositeBar';
 import { ToggleCompositePinnedAction } from 'vs/workbench/browser/parts/compositebar/compositeBarActions';
@@ -68,7 +68,8 @@ export class ActivitybarPart extends Part implements IActivityBarService {
 			getCompositePinnedAction: (compositeId: string) => new ToggleCompositePinnedAction(this.viewletService.getViewlet(compositeId), this.compositeBar),
 			getOnCompositeClickAction: (compositeId: string) => this.instantiationService.createInstance(ToggleViewletAction, this.viewletService.getViewlet(compositeId)),
 			getDefaultCompositeId: () => this.viewletService.getDefaultViewletId(),
-			hidePart: () => this.partService.setSideBarHidden(true)
+			hidePart: () => this.partService.setSideBarHidden(true),
+			backgroundColor: ACTIVITY_BAR_FOREGROUND
 		});
 		this.registerListeners();
 	}

src/vs/workbench/browser/parts/compositebar/compositeBar.ts

@@ -25,6 +25,7 @@ export interface ICompositeBarOptions {
 	storageId: string;
 	orientation: ActionsOrientation;
 	composites: { id: string, name: string }[];
+	backgroundColor: string;
 	getActivityAction: (compositeId: string) => ActivityAction;
 	getCompositePinnedAction: (compositeId: string) => Action;
 	getOnCompositeClickAction: (compositeId: string) => Action;
@@ -278,7 +279,8 @@ export class CompositeBar implements ICompositeBar {
 				() => this.getOverflowingComposites(),
 				() => this.activeCompositeId,
 				(compositeId: string) => this.compositeIdToActivityStack[compositeId] && this.compositeIdToActivityStack[compositeId][0].badge,
-				this.options.getOnCompositeClickAction
+				this.options.getOnCompositeClickAction,
+				this.options.backgroundColor
 			);
 
 			this.compositeSwitcherBar.push(this.compositeOverflowAction, { label: false, icon: true });
@@ -322,7 +324,7 @@ export class CompositeBar implements ICompositeBar {
 
 		const compositeActivityAction = this.options.getActivityAction(compositeId);
 		const pinnedAction = this.options.getCompositePinnedAction(compositeId);
-		this.compositeIdToActionItems[compositeId] = this.instantiationService.createInstance(CompositeActionItem, compositeActivityAction, pinnedAction, this);
+		this.compositeIdToActionItems[compositeId] = this.instantiationService.createInstance(CompositeActionItem, compositeActivityAction, pinnedAction, this, this.options.backgroundColor);
 		this.compositeIdToActions[compositeId] = compositeActivityAction;
 
 		return compositeActivityAction;

src/vs/workbench/browser/parts/compositebar/compositeBarActions.ts

@@ -18,7 +18,7 @@ import { IThemeService, ITheme } from 'vs/platform/theme/common/themeService';
 import { TextBadge, NumberBadge, IBadge, IconBadge, ProgressBadge } from 'vs/workbench/services/activity/common/activityBarService';
 import { IInstantiationService } from 'vs/platform/instantiation/common/instantiation';
 import { contrastBorder } from 'vs/platform/theme/common/colorRegistry';
-import { ACTIVITY_BAR_BADGE_FOREGROUND, ACTIVITY_BAR_DRAG_AND_DROP_BACKGROUND, ACTIVITY_BAR_BADGE_BACKGROUND, ACTIVITY_BAR_FOREGROUND } from 'vs/workbench/common/theme';
+import { ACTIVITY_BAR_BADGE_FOREGROUND, ACTIVITY_BAR_DRAG_AND_DROP_BACKGROUND, ACTIVITY_BAR_BADGE_BACKGROUND } from 'vs/workbench/common/theme';
 import { DelayedDragHandler } from 'vs/base/browser/dnd';
 import { IActivity } from 'vs/workbench/common/activity';
 import { IKeybindingService } from 'vs/platform/keybinding/common/keybinding';
@@ -93,6 +93,7 @@ export class ActivityAction extends Action {
 
 export interface IActivityActionItemOptions extends IBaseActionItemOptions {
 	icon?: boolean;
+	backgroundColor: string;
 }
 
 export class ActivityActionItem extends BaseActionItem {
@@ -124,7 +125,7 @@ export class ActivityActionItem extends BaseActionItem {
 
 		// Label
 		if (this.$label) {
-			const background = theme.getColor(ACTIVITY_BAR_FOREGROUND);
+			const background = theme.getColor(this.options.backgroundColor);
 
 			this.$label.style('background-color', background ? background.toString() : null);
 		}
@@ -294,11 +295,12 @@ export class CompositeOverflowActivityActionItem extends ActivityActionItem {
 		private getActiveCompositeId: () => string,
 		private getBadge: (compositeId: string) => IBadge,
 		private getCompositeOpenAction: (compositeId: string) => Action,
+		backgroundColor: string,
 		@IInstantiationService private instantiationService: IInstantiationService,
 		@IContextMenuService private contextMenuService: IContextMenuService,
 		@IThemeService themeService: IThemeService
 	) {
-		super(action, { icon: true }, themeService);
+		super(action, { icon: true, backgroundColor }, themeService);
 
 		this.cssClass = action.class;
 		this.name = action.label;
@@ -373,12 +375,13 @@ export class CompositeActionItem extends ActivityActionItem {
 		private compositeActivityAction: ActivityAction,
 		private toggleCompositePinnedAction: Action,
 		private compositeBar: ICompositeBar,
+		backgroundColor: string,
 		@IContextMenuService private contextMenuService: IContextMenuService,
 		@IKeybindingService private keybindingService: IKeybindingService,
 		@IInstantiationService instantiationService: IInstantiationService,
 		@IThemeService themeService: IThemeService
 	) {
-		super(compositeActivityAction, { draggable: true }, themeService);
+		super(compositeActivityAction, { draggable: true, backgroundColor }, themeService);
 
 		this.cssClass = compositeActivityAction.class;
 

src/vs/workbench/browser/parts/panel/panelPart.ts

@@ -82,7 +82,8 @@ export class PanelPart extends CompositePart<Panel> implements IPanelService {
 			getCompositePinnedAction: (compositeId: string) => new ToggleCompositePinnedAction(this.getPanel(compositeId), this.compositeBar),
 			getOnCompositeClickAction: (compositeId: string) => this.instantiationService.createInstance(OpenPanelAction, this.getPanel(compositeId)),
 			getDefaultCompositeId: () => Registry.as<PanelRegistry>(PanelExtensions.Panels).getDefaultPanelId(),
-			hidePart: () => this.partService.setPanelHidden(true)
+			hidePart: () => this.partService.setPanelHidden(true),
+			backgroundColor: PANEL_BACKGROUND
 		});
 		this.toUnbind.push(this.compositeBar);