From 7667e90bf82ece1395727c7d88a37114fe1488a4 Mon Sep 17 00:00:00 2001 From: Daniel Imms <2193314+Tyriar@users.noreply.github.com> Date: Wed, 7 Jul 2021 04:21:02 -0700 Subject: [PATCH] Add themeable indicator to active terminal tab Fixes #127360 --- .../contrib/terminal/browser/media/terminal.css | 10 ++++++++++ .../contrib/terminal/browser/terminalTabsList.ts | 2 ++ .../workbench/contrib/terminal/browser/terminalView.ts | 7 ++++++- .../contrib/terminal/common/terminalColorRegistry.ts | 7 ++++++- 4 files changed, 24 insertions(+), 2 deletions(-) diff --git a/src/vs/workbench/contrib/terminal/browser/media/terminal.css b/src/vs/workbench/contrib/terminal/browser/media/terminal.css index 6d5e11ba267..2bb3d435bbb 100644 --- a/src/vs/workbench/contrib/terminal/browser/media/terminal.css +++ b/src/vs/workbench/contrib/terminal/browser/media/terminal.css @@ -244,6 +244,16 @@ padding: 4px 0 2px; margin: auto; } +.monaco-workbench .pane-body.integrated-terminal .terminal-tabs-entry.is-active::before { + display: block; + position: absolute; + content: ""; + left: 0; + top: 0; + bottom: 0; + width: 1px; +} + .monaco-workbench .pane-body.integrated-terminal .tabs-container.has-text > .monaco-toolbar { padding: 4px 7px 2px; margin: 0; diff --git a/src/vs/workbench/contrib/terminal/browser/terminalTabsList.ts b/src/vs/workbench/contrib/terminal/browser/terminalTabsList.ts index 128a79df652..65dbf17c9bf 100644 --- a/src/vs/workbench/contrib/terminal/browser/terminalTabsList.ts +++ b/src/vs/workbench/contrib/terminal/browser/terminalTabsList.ts @@ -112,6 +112,7 @@ export class TerminalTabList extends WorkbenchList { this.setSelection([i]); this.reveal(i); } + this.refresh(); }); this.onMouseDblClick(async e => { @@ -261,6 +262,7 @@ class TerminalTabsRenderer implements IListRenderer 1) { diff --git a/src/vs/workbench/contrib/terminal/browser/terminalView.ts b/src/vs/workbench/contrib/terminal/browser/terminalView.ts index 32ba5c5cb25..a19f4325a9e 100644 --- a/src/vs/workbench/contrib/terminal/browser/terminalView.ts +++ b/src/vs/workbench/contrib/terminal/browser/terminalView.ts @@ -12,7 +12,7 @@ import { IInstantiationService } from 'vs/platform/instantiation/common/instanti import { ITelemetryService } from 'vs/platform/telemetry/common/telemetry'; import { IThemeService, IColorTheme, registerThemingParticipant, ICssStyleCollector, ThemeIcon, Themable } from 'vs/platform/theme/common/themeService'; import { switchTerminalActionViewItemSeparator, switchTerminalShowTabsTitle } from 'vs/workbench/contrib/terminal/browser/terminalActions'; -import { TERMINAL_BACKGROUND_COLOR, TERMINAL_BORDER_COLOR, TERMINAL_DRAG_AND_DROP_BACKGROUND } from 'vs/workbench/contrib/terminal/common/terminalColorRegistry'; +import { TERMINAL_BACKGROUND_COLOR, TERMINAL_BORDER_COLOR, TERMINAL_DRAG_AND_DROP_BACKGROUND, TERMINAL_TAB_ACTIVE_BORDER } from 'vs/workbench/contrib/terminal/common/terminalColorRegistry'; import { INotificationService, IPromptChoice, Severity } from 'vs/platform/notification/common/notification'; import { ITerminalGroupService, ITerminalInstance, ITerminalService, TerminalConnectionState } from 'vs/workbench/contrib/terminal/browser/terminal'; import { ViewPane, IViewPaneOptions } from 'vs/workbench/browser/parts/views/viewPane'; @@ -346,6 +346,11 @@ registerThemingParticipant((theme: IColorTheme, collector: ICssStyleCollector) = if (dndBackgroundColor) { collector.addRule(`.monaco-workbench .pane-body.integrated-terminal .terminal-drop-overlay { background-color: ${dndBackgroundColor.toString()}; }`); } + + const activeTabBorderColor = theme.getColor(TERMINAL_TAB_ACTIVE_BORDER); + if (activeTabBorderColor) { + collector.addRule(`.monaco-workbench .pane-body.integrated-terminal .terminal-tabs-entry.is-active::before { background-color: ${activeTabBorderColor.toString()}; }`); + } }); diff --git a/src/vs/workbench/contrib/terminal/common/terminalColorRegistry.ts b/src/vs/workbench/contrib/terminal/common/terminalColorRegistry.ts index e9847286a0b..9df17f38d09 100644 --- a/src/vs/workbench/contrib/terminal/common/terminalColorRegistry.ts +++ b/src/vs/workbench/contrib/terminal/common/terminalColorRegistry.ts @@ -6,7 +6,7 @@ import * as nls from 'vs/nls'; import { registerColor, ColorIdentifier, ColorDefaults } from 'vs/platform/theme/common/colorRegistry'; -import { EDITOR_DRAG_AND_DROP_BACKGROUND, PANEL_BORDER } from 'vs/workbench/common/theme'; +import { EDITOR_DRAG_AND_DROP_BACKGROUND, PANEL_BORDER, TAB_ACTIVE_BORDER } from 'vs/workbench/common/theme'; /** * The color identifiers for the terminal's ansi colors. The index in the array corresponds to the index @@ -37,6 +37,11 @@ export const TERMINAL_DRAG_AND_DROP_BACKGROUND = registerColor('terminal.dropBac light: EDITOR_DRAG_AND_DROP_BACKGROUND, hc: EDITOR_DRAG_AND_DROP_BACKGROUND }, nls.localize('terminal.dragAndDropBackground', "Background color when dragging on top of terminals. The color should have transparency so that the terminal contents can still shine through.")); +export const TERMINAL_TAB_ACTIVE_BORDER = registerColor('terminal.tab.activeBorder', { + dark: TAB_ACTIVE_BORDER, + light: TAB_ACTIVE_BORDER, + hc: TAB_ACTIVE_BORDER +}, nls.localize('terminal.tab.activeBorder', 'Border on the side of the terminal tab in the panel. This defaults to tab.activeBorder.')); export const ansiColorMap: { [key: string]: { index: number, defaults: ColorDefaults } } = { 'terminal.ansiBlack': {