diff --git a/src/vs/workbench/browser/parts/titlebar/titlebarPart.ts b/src/vs/workbench/browser/parts/titlebar/titlebarPart.ts index 32dad57a21830..cb66264d45bff 100644 --- a/src/vs/workbench/browser/parts/titlebar/titlebarPart.ts +++ b/src/vs/workbench/browser/parts/titlebar/titlebarPart.ts @@ -18,7 +18,7 @@ import { IThemeService } from '../../../../platform/theme/common/themeService.js import { TITLE_BAR_ACTIVE_BACKGROUND, TITLE_BAR_ACTIVE_FOREGROUND, TITLE_BAR_INACTIVE_FOREGROUND, TITLE_BAR_INACTIVE_BACKGROUND, TITLE_BAR_BORDER, WORKBENCH_BACKGROUND } from '../../../common/theme.js'; import { isMacintosh, isWindows, isLinux, isWeb, isNative, platformLocale } from '../../../../base/common/platform.js'; import { Color } from '../../../../base/common/color.js'; -import { EventType, EventHelper, Dimension, append, $, addDisposableListener, prepend, reset, getWindow, getWindowId, isAncestor, getActiveDocument, isHTMLElement } from '../../../../base/browser/dom.js'; +import { EventType, EventHelper, Dimension, append, $, addDisposableListener, prepend, reset, getWindow, getWindowId, isAncestor, getActiveDocument, isHTMLElement, createMetaElement } from '../../../../base/browser/dom.js'; import { CustomMenubarControl } from './menubarControl.js'; import { IInstantiationService, ServicesAccessor } from '../../../../platform/instantiation/common/instantiation.js'; import { Emitter, Event } from '../../../../base/common/event.js'; @@ -717,6 +717,19 @@ export class BrowserTitlebarPart extends Part implements ITitlebarPart { }) || ''; this.element.style.backgroundColor = titleBackground; + // Update based on selected theme + if (isWeb) { + const metaElementId = 'monaco-workbench-meta-theme-color'; + let metaElement = mainWindow.document.getElementById(metaElementId) as HTMLMetaElement | null; + if (!metaElement) { + metaElement = createMetaElement(); + metaElement.name = 'theme-color'; + metaElement.id = metaElementId; + } + + metaElement.content = titleBackground.toString(); + } + if (this.appIconBadge) { this.appIconBadge.style.backgroundColor = titleBackground; } diff --git a/src/vs/workbench/browser/style.ts b/src/vs/workbench/browser/style.ts index 9f36f4a74ebf3..a065596ff6b5c 100644 --- a/src/vs/workbench/browser/style.ts +++ b/src/vs/workbench/browser/style.ts @@ -5,12 +5,10 @@ import './media/style.css'; import { registerThemingParticipant } from '../../platform/theme/common/themeService.js'; -import { WORKBENCH_BACKGROUND, TITLE_BAR_ACTIVE_BACKGROUND } from '../common/theme.js'; -import { isWeb, isIOS } from '../../base/common/platform.js'; -import { createMetaElement } from '../../base/browser/dom.js'; +import { WORKBENCH_BACKGROUND } from '../common/theme.js'; +import { isIOS } from '../../base/common/platform.js'; import { isSafari, isStandalone } from '../../base/browser/browser.js'; import { selectionBackground } from '../../platform/theme/common/colorRegistry.js'; -import { mainWindow } from '../../base/browser/window.js'; registerThemingParticipant((theme, collector) => { @@ -24,22 +22,6 @@ registerThemingParticipant((theme, collector) => { collector.addRule(`.monaco-workbench ::selection { background-color: ${windowSelectionBackground}; }`); } - // Update based on selected theme - if (isWeb) { - const titleBackground = theme.getColor(TITLE_BAR_ACTIVE_BACKGROUND); - if (titleBackground) { - const metaElementId = 'monaco-workbench-meta-theme-color'; - let metaElement = mainWindow.document.getElementById(metaElementId) as HTMLMetaElement | null; - if (!metaElement) { - metaElement = createMetaElement(); - metaElement.name = 'theme-color'; - metaElement.id = metaElementId; - } - - metaElement.content = titleBackground.toString(); - } - } - // We disable user select on the root element, however on Safari this seems // to prevent any text selection in the monaco editor. As a workaround we // allow to select text in monaco editor instances.