Skip to content

Commit

Permalink
Add themeable indicator to active terminal tab
Browse files Browse the repository at this point in the history
Fixes #127360
  • Loading branch information
Tyriar committed Jul 7, 2021
1 parent c8d0707 commit 7667e90
Show file tree
Hide file tree
Showing 4 changed files with 24 additions and 2 deletions.
10 changes: 10 additions & 0 deletions src/vs/workbench/contrib/terminal/browser/media/terminal.css
Original file line number Diff line number Diff line change
Expand Up @@ -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;
Expand Down
2 changes: 2 additions & 0 deletions src/vs/workbench/contrib/terminal/browser/terminalTabsList.ts
Original file line number Diff line number Diff line change
Expand Up @@ -112,6 +112,7 @@ export class TerminalTabList extends WorkbenchList<ITerminalInstance> {
this.setSelection([i]);
this.reveal(i);
}
this.refresh();
});

this.onMouseDblClick(async e => {
Expand Down Expand Up @@ -261,6 +262,7 @@ class TerminalTabsRenderer implements IListRenderer<ITerminalInstance, ITerminal
}

template.element.classList.toggle('has-text', hasText);
template.element.classList.toggle('is-active', this._terminalGroupService.activeInstance === instance);

let prefix: string = '';
if (group.terminalInstances.length > 1) {
Expand Down
7 changes: 6 additions & 1 deletion src/vs/workbench/contrib/terminal/browser/terminalView.ts
Original file line number Diff line number Diff line change
Expand Up @@ -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';
Expand Down Expand Up @@ -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()}; }`);
}
});


Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -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
Expand Down Expand Up @@ -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': {
Expand Down

0 comments on commit 7667e90

Please sign in to comment.