From ddaf9a7eb6f4e27e0ebc321760b0e77fb2d04261 Mon Sep 17 00:00:00 2001 From: Kim Santiago <31145923+kisantia@users.noreply.github.com> Date: Tue, 7 Apr 2020 17:10:16 -0700 Subject: [PATCH] Change active tab to have full outline for high contrast (#9889) * change active tab to have full outline for high contrast * remove unused imports --- .../dashboard/browser/core/dashboardPanelStyles.ts | 12 +++++++----- 1 file changed, 7 insertions(+), 5 deletions(-) diff --git a/src/sql/workbench/contrib/dashboard/browser/core/dashboardPanelStyles.ts b/src/sql/workbench/contrib/dashboard/browser/core/dashboardPanelStyles.ts index 4844c1136d..a244e574e6 100644 --- a/src/sql/workbench/contrib/dashboard/browser/core/dashboardPanelStyles.ts +++ b/src/sql/workbench/contrib/dashboard/browser/core/dashboardPanelStyles.ts @@ -4,9 +4,9 @@ *--------------------------------------------------------------------------------------------*/ import 'vs/css!./dashboardPanel'; -import { registerThemingParticipant, IColorTheme, ICssStyleCollector, HIGH_CONTRAST } from 'vs/platform/theme/common/themeService'; +import { registerThemingParticipant, IColorTheme, ICssStyleCollector } from 'vs/platform/theme/common/themeService'; import { - TAB_ACTIVE_BACKGROUND, TAB_ACTIVE_FOREGROUND, TAB_ACTIVE_BORDER, TAB_INACTIVE_BACKGROUND, + TAB_ACTIVE_BACKGROUND, TAB_ACTIVE_FOREGROUND, TAB_INACTIVE_BACKGROUND, TAB_INACTIVE_FOREGROUND, EDITOR_GROUP_HEADER_TABS_BACKGROUND, TAB_BORDER, EDITOR_GROUP_BORDER, DASHBOARD_TAB_ACTIVE_BACKGROUND, DASHBOARD_BORDER } from 'vs/workbench/common/theme'; import { activeContrastBorder } from 'vs/platform/theme/common/colorRegistry'; @@ -43,11 +43,13 @@ registerThemingParticipant((theme: IColorTheme, collector: ICssStyleCollector) = `); } - const activeTabBorderColor = theme.type === HIGH_CONTRAST ? theme.getColor(activeContrastBorder) : theme.getColor(TAB_ACTIVE_BORDER); - if (activeTabBorderColor) { + const highContrastActiveTabBorderColor = theme.getColor(activeContrastBorder); + if (highContrastActiveTabBorderColor) { collector.addRule(` panel.dashboard-panel > .tabbedPanel > .title .tabList .tab-header.active { - box-shadow: ${activeTabBorderColor} 0 -1px inset; + outline: 1px solid; + outline-offset: -3px; + outline-color: ${highContrastActiveTabBorderColor}; } `); }