theming - first cut of focus color & more cleanup

3f373706 · Benjamin Pasero · cbf70692 · 3f373706 · 3f373706 · 3f373706
11 changed file
--- a/src/vs/base/browser/ui/scrollbar/media/scrollbars.css
+++ b/src/vs/base/browser/ui/scrollbar/media/scrollbars.css
@@ -121,3 +121,15 @@
 .hc-black .monaco-scrollable-element > .scrollbar > .slider.active {
 	background: rgba(111, 195, 223, 1);
 }
+
+.vs-dark .monaco-scrollable-element .shadow.top {
+	box-shadow: #000 0 6px 6px -6px inset;
+}
+
+.vs-dark .monaco-scrollable-element .shadow.left {
+	box-shadow: #000 6px 0 6px -6px inset;
+}
+
+.vs-dark .monaco-scrollable-element .shadow.top.left {
+	box-shadow: #000 6px 6px 6px -6px inset;
+}
\ No newline at end of file
--- a/src/vs/platform/theme/common/colorRegistry.ts
+++ b/src/vs/platform/theme/common/colorRegistry.ts
@@ -114,12 +114,13 @@ export function registerColor(id: string, defaults: ColorDefaults, description:
 // ----- base colors

 export const foreground = registerColor('foreground', { dark: '#CCCCCC', light: '#6C6C6C', hc: '#FFFFFF' }, nls.localize('foreground', "Overall foreground color. This color is only used if not overridden by a component."));
+export const focus = registerColor('focus', { dark: '#007ACC', light: '#007ACC', hc: '#F38518' }, nls.localize('focus', "Overall outline/border color for focused elements. This color is only used if not overridden by a component."));

 /**
 * Commonly used High contrast colors.
 */
 export const highContrastBorder = registerColor('highContrastBorder', { light: null, dark: null, hc: '#6FC3DF' }, nls.localize('highContrastBorder', "Border color to separate components when high contrast theme is enabled."));
-export const highContrastOutline = registerColor('highContrastOutline', { light: null, dark: null, hc: '#F38518' }, nls.localize('highContrastOutline', "Outline color for active components when high contrast theme is enabled."));
+export const highContrastOutline = registerColor('highContrastOutline', { light: null, dark: null, hc: focus }, nls.localize('highContrastOutline', "Outline color for active components when high contrast theme is enabled."));

 /**
 * Widgets

--- a/src/vs/workbench/browser/parts/activitybar/activitybarPart.ts
+++ b/src/vs/workbench/browser/parts/activitybar/activitybarPart.ts
@@ -30,9 +30,9 @@ import { StandardMouseEvent } from 'vs/base/browser/mouseEvent';
 import { dispose, IDisposable } from 'vs/base/common/lifecycle';
 import { ToggleActivityBarVisibilityAction } from 'vs/workbench/browser/actions/toggleActivityBarVisibility';
 import SCMPreview from 'vs/workbench/parts/scm/browser/scmPreview';
-import { IThemeService } from 'vs/platform/theme/common/themeService';
+import { IThemeService, registerThemingParticipant, ITheme, ICssStyleCollector } from 'vs/platform/theme/common/themeService';
 import { ACTIVITY_BAR_BACKGROUND } from 'vs/workbench/common/theme';
-import { highContrastBorder } from 'vs/platform/theme/common/colorRegistry';
+import { highContrastBorder, highContrastOutline, focus } from 'vs/platform/theme/common/colorRegistry';

 interface IViewletActivity {
 	badge: IBadge;
@@ -174,7 +174,7 @@ export class ActivitybarPart extends Part implements IActivityBarService {

 		} else {
 			// update
-			const [{badge, clazz}] = stack;
+			const [{ badge, clazz }] = stack;
 			action.setBadge(badge);
 			if (clazz) {
 				action.class = clazz;
@@ -512,3 +512,68 @@ export class ActivitybarPart extends Part implements IActivityBarService {
 		super.shutdown();
 	}
 }
+
+registerThemingParticipant((theme: ITheme, collector: ICssStyleCollector) => {
+
+	// High Contrast Styling
+	if (theme.type === 'hc') {
+		const outline = theme.getColor(highContrastOutline);
+
+		collector.addRule(`
+			.monaco-workbench > .activitybar > .content .monaco-action-bar .action-label:before {
+				content: "";
+				position: absolute;
+				top: 9px;
+				left: 9px;
+				height: 32px;
+				width: 32px;
+				opacity: 0.6;
+			}
+
+			.monaco-workbench > .activitybar > .content .monaco-action-bar.global .action-item .action-label.active:before {
+				border: none;
+			}
+
+			.monaco-workbench > .activitybar > .content .monaco-action-bar .action-item .action-label.active:before,
+			.monaco-workbench > .activitybar > .content .monaco-action-bar .action-item .action-label.active:hover:before {
+				outline: 1px solid;
+			}
+
+			.monaco-workbench > .activitybar > .content .monaco-action-bar .action-item .action-label:hover:before {
+				outline: 1px dashed;
+			}
+
+			.monaco-workbench > .activitybar > .content .monaco-action-bar .action-label,
+			.monaco-workbench > .activitybar > .content .monaco-action-bar .action-label.active,
+			.monaco-workbench > .activitybar > .content .monaco-action-bar .action-item .action-label.active:before,
+			.monaco-workbench > .activitybar > .content .monaco-action-bar .action-item:hover .action-label:before {
+				opacity: 1;
+			}
+
+			.monaco-workbench > .activitybar > .content .monaco-action-bar .action-item .action-label:focus:before {
+				border-left-color: ${outline};
+			}
+
+			.monaco-workbench > .activitybar > .content .monaco-action-bar .action-item .action-label.active:before,
+			.monaco-workbench > .activitybar > .content .monaco-action-bar .action-item .action-label.active:hover:before,
+			.monaco-workbench > .activitybar > .content .monaco-action-bar .action-item .action-label:hover:before {
+				outline-color: ${outline};
+			}
+		`);
+	}
+
+	// Non High Contrast Themes
+	else {
+		const focusBorder = theme.getColor(focus);
+
+		collector.addRule(`
+			.monaco-workbench > .activitybar > .content .monaco-action-bar .action-label {
+				opacity: 0.6;
+			}
+
+			.monaco-workbench > .activitybar > .content .monaco-action-bar .action-item .action-label:focus:before {
+				border-left-color: ${focusBorder};
+			}
+		`);
+	}
+});
\ No newline at end of file
--- a/src/vs/workbench/browser/parts/activitybar/media/activityaction.css
+++ b/src/vs/workbench/browser/parts/activitybar/media/activityaction.css
@@ -48,33 +48,10 @@
 }

 .monaco-workbench > .activitybar > .content .monaco-action-bar .action-label > .label {
-	flex: 1 1 auto;
 	flex: 1 1 auto;
 	overflow: hidden;
 }

-.hc-black .monaco-workbench > .activitybar > .content .monaco-action-bar .action-label:before {
-	content: "";
-	position: absolute;
-	top: 9px;
-	left: 9px;
-	height: 32px;
-	width: 32px;
-}
-
-.hc-black .monaco-workbench > .activitybar > .content .monaco-action-bar.global .action-item .action-label.active:before {
-	border: none;
-}
-
-.hc-black .monaco-workbench > .activitybar > .content .monaco-action-bar .action-item .action-label.active:before,
-.hc-black .monaco-workbench > .activitybar > .content .monaco-action-bar .action-item .action-label.active:hover:before {
-	outline: 1px solid;
-}
-
-.hc-black .monaco-workbench > .activitybar > .content .monaco-action-bar .action-item .action-label:hover:before {
-	outline: 1px dashed;
-}
-
 .monaco-workbench > .activitybar > .content .monaco-action-bar .badge {
 	position: absolute;
 	top: 5px;
@@ -122,43 +99,4 @@
 .monaco-workbench > .activitybar.right > .content .monaco-action-bar .badge {
 	left: auto;
 	right: 0;
-}
-
-/* TODO@theme */
-
-.vs .monaco-workbench > .activitybar > .content .monaco-action-bar .action-label,
-.vs-dark .monaco-workbench > .activitybar > .content .monaco-action-bar .action-label {
-	opacity: 0.6;
-}
-
-.hc-black .monaco-workbench > .activitybar > .content .monaco-action-bar .action-label,
-.hc-black .monaco-workbench > .activitybar > .content .monaco-action-bar .action-label.active {
-	opacity: 1;
-}
-
-.hc-black .monaco-workbench > .activitybar > .content .monaco-action-bar .action-label:before {
-	opacity: 0.6;
-}
-
-.hc-black .monaco-workbench > .activitybar > .content .monaco-action-bar .action-item .action-label.active:before,
-.hc-black .monaco-workbench > .activitybar > .content .monaco-action-bar .action-item:hover .action-label:before {
-	opacity: 1;
-}
-
-.vs .monaco-workbench > .activitybar > .content .monaco-action-bar .action-item .action-label:focus:before,
-.vs-dark .monaco-workbench > .activitybar > .content .monaco-action-bar .action-item .action-label:focus:before {
-	border-left-color: #007ACC;
-}
-
-.hc-black .monaco-workbench > .activitybar > .content .monaco-action-bar .action-item .action-label:focus:before {
-	border-left-color: #f38518;
-}
-
-.hc-black .monaco-workbench > .activitybar > .content .monaco-action-bar .action-item .action-label.active:before,
-.hc-black .monaco-workbench > .activitybar > .content .monaco-action-bar .action-item .action-label.active:hover:before {
-	outline-color: #f38518;
-}
-
-.hc-black .monaco-workbench > .activitybar > .content .monaco-action-bar .action-item .action-label:hover:before {
-	outline-color: #f38518;
 }
\ No newline at end of file
--- a/src/vs/workbench/browser/parts/editor/media/notabstitle.css
+++ b/src/vs/workbench/browser/parts/editor/media/notabstitle.css
@@ -21,6 +21,11 @@
 .monaco-workbench > .part.editor > .content > .one-editor-silo > .container > .title .title-actions {
 	display: flex;
 	flex: initial;
+	opacity: 0.5;
+}
+
+.monaco-workbench > .part.editor > .content > .one-editor-silo > .container > .title.active .title-actions {
+	opacity: 1;
 }

 .vs .monaco-workbench > .part.editor > .content > .one-editor-silo > .container > .title.dirty .title-actions .close-editor-action {
@@ -39,18 +44,4 @@
 .vs-dark .monaco-workbench > .part.editor > .content > .one-editor-silo > .container > .title.dirty .title-actions .close-editor-action:hover,
 .hc-black .monaco-workbench > .part.editor > .content > .one-editor-silo > .container > .title.dirty .title-actions .close-editor-action:hover {
 	background: url('close-inverse.svg') center center no-repeat;
-}
-
-/* TODO@theme (widgets) */
-
-.vs .monaco-workbench > .part.editor > .content > .one-editor-silo > .container > .title .title-actions,
-.vs-dark .monaco-workbench > .part.editor > .content > .one-editor-silo > .container > .title .title-actions,
-.hc-black .monaco-workbench > .part.editor > .content > .one-editor-silo > .container > .title .title-actions {
-	opacity: 0.5;
-}
-
-.vs .monaco-workbench > .part.editor > .content > .one-editor-silo > .container > .title.active .title-actions,
-.vs-dark .monaco-workbench > .part.editor > .content > .one-editor-silo > .container > .title.active .title-actions,
-.hc-black .monaco-workbench > .part.editor > .content > .one-editor-silo > .container > .title.active .title-actions {
-	opacity: 1;
 }
\ No newline at end of file
--- a/src/vs/workbench/browser/parts/panel/media/panelpart.css
+++ b/src/vs/workbench/browser/parts/panel/media/panelpart.css
@@ -41,29 +41,6 @@
 	border-bottom: 1px solid;
 }

-.hc-black .monaco-workbench > .part.panel > .title > .panel-switcher-container > .monaco-action-bar .action-item .action-label.checked,
-.hc-black .monaco-workbench > .part.panel > .title > .panel-switcher-container > .monaco-action-bar .action-item .action-label:hover {
-	outline: 1px solid;
-	border-bottom: none;
-	padding-bottom: 0;
-	outline-offset: 3px;
-}
-
-.hc-black .monaco-workbench > .part.panel > .title > .panel-switcher-container > .monaco-action-bar .action-item .action-label:hover:not(.checked) {
-	outline-style: dashed;
-}
-
-.vs .monaco-workbench > .part.panel > .title > .panel-switcher-container > .monaco-action-bar .action-item .action-label:focus,
-.vs-dark .monaco-workbench > .part.panel > .title > .panel-switcher-container > .monaco-action-bar .action-item .action-label:focus {
-	border-bottom: 1px solid;
-	outline: none !important;
-}
-
-.hc-black .monaco-workbench > .part.panel > .title > .panel-switcher-container > .monaco-action-bar .action-item .action-label:focus {
-	border-bottom: 1px solid;
-	outline: none !important;
-}
-
 /** Actions */

 .monaco-workbench .hide-panel-action {
@@ -91,50 +68,4 @@
 .vs-dark .monaco-workbench .hide-panel-action,
 .hc-black .monaco-workbench .hide-panel-action {
 	background: url('close-inverse.svg') center center no-repeat;
-}
-
-/** TODO@theme (widgets) */
-
-.vs .monaco-workbench > .part.panel > .title > .panel-switcher-container > .monaco-action-bar .action-item .action-label {
-	color: rgba(66, 66, 66, 0.75);
-}
-
-.vs-dark .monaco-workbench > .part.panel > .title > .panel-switcher-container > .monaco-action-bar .action-item .action-label {
-	color: rgba(231, 231, 231, 0.5);
-}
-
-.hc-black .monaco-workbench > .part.panel > .title > .panel-switcher-container > .monaco-action-bar .action-item .action-label {
-	color: #fff;
-}
-
-.vs .monaco-workbench > .part.panel > .title > .panel-switcher-container > .monaco-action-bar .action-item:hover .action-label,
-.vs .monaco-workbench > .part.panel > .title > .panel-switcher-container > .monaco-action-bar .action-item .action-label.checked {
-	color: rgb(66, 66, 66);
-}
-
-.vs-dark .monaco-workbench > .part.panel > .title > .panel-switcher-container > .monaco-action-bar .action-item:hover .action-label,
-.vs-dark .monaco-workbench > .part.panel > .title > .panel-switcher-container > .monaco-action-bar .action-item .action-label.checked {
-	color: rgb(231, 231, 231);
-}
-
-.vs .monaco-workbench > .part.panel > .title > .panel-switcher-container > .monaco-action-bar .action-item .action-label.checked {
-	border-bottom-color: #ccceda;
-}
-
-.vs-dark .monaco-workbench > .part.panel > .title > .panel-switcher-container > .monaco-action-bar .action-item .action-label.checked {
-	border-bottom-color: #404047;
-}
-
-.hc-black .monaco-workbench > .part.panel > .title > .panel-switcher-container > .monaco-action-bar .action-item .action-label.checked,
-.hc-black .monaco-workbench > .part.panel > .title > .panel-switcher-container > .monaco-action-bar .action-item .action-label:hover {
-	outline-color: #f38518;
-}
-
-.vs .monaco-workbench > .part.panel > .title > .panel-switcher-container > .monaco-action-bar .action-item .action-label:focus,
-.vs-dark .monaco-workbench > .part.panel > .title > .panel-switcher-container > .monaco-action-bar .action-item .action-label:focus {
-	border-bottom-color: #007ACC;
-}
-
-.hc-black .monaco-workbench > .part.panel > .title > .panel-switcher-container > .monaco-action-bar .action-item .action-label:focus {
-	border-bottom-color: #f38518;
 }
\ No newline at end of file
--- a/src/vs/workbench/browser/parts/panel/panelPart.ts
+++ b/src/vs/workbench/browser/parts/panel/panelPart.ts
@@ -24,8 +24,9 @@ import { IKeybindingService } from 'vs/platform/keybinding/common/keybinding';
 import { IInstantiationService } from 'vs/platform/instantiation/common/instantiation';
 import { ActionsOrientation, ActionBar } from 'vs/base/browser/ui/actionbar/actionbar';
 import { ClosePanelAction, PanelAction, ToggleMaximizedPanelAction } from 'vs/workbench/browser/parts/panel/panelActions';
-import { IThemeService } from 'vs/platform/theme/common/themeService';
-import { PANEL_BACKGROUND, PANEL_BORDER_TOP_COLOR } from 'vs/workbench/common/theme';
+import { IThemeService, registerThemingParticipant, ITheme, ICssStyleCollector } from 'vs/platform/theme/common/themeService';
+import { PANEL_BACKGROUND, PANEL_BORDER_TOP_COLOR, PANEL_ACTIVE_TITLE_COLOR, PANEL_INACTIVE_TITLE_COLOR, PANEL_ACTIVE_TITLE_BORDER } from 'vs/workbench/common/theme';
+import { highContrastOutline, focus } from "vs/platform/theme/common/colorRegistry";

 export class PanelPart extends CompositePart<Panel> implements IPanelService {

@@ -63,7 +64,7 @@ export class PanelPart extends CompositePart<Panel> implements IPanelService {
 			'panel',
 			'panel',
 			Scope.PANEL,
-			null, // TODO@theme
+			null,
 			id,
 			{ hasTitle: true }
 		);
@@ -172,7 +173,7 @@ export class PanelPart extends CompositePart<Panel> implements IPanelService {
 				}
 			},
 			updateStyles: () => {
-				// TODO@theme
+				// Handled via theming participant
 			}
 		};
 	}
@@ -189,4 +190,58 @@ export class PanelPart extends CompositePart<Panel> implements IPanelService {
 			return action;
 		}));
 	}
-}
\ No newline at end of file
+}
+
+registerThemingParticipant((theme: ITheme, collector: ICssStyleCollector) => {
+
+	// Title Active
+	const titleActive = theme.getColor(PANEL_ACTIVE_TITLE_COLOR);
+	const titleActiveBorder = theme.getColor(PANEL_ACTIVE_TITLE_BORDER);
+	collector.addRule(`
+		.monaco-workbench > .part.panel > .title > .panel-switcher-container > .monaco-action-bar .action-item:hover .action-label,
+		.monaco-workbench > .part.panel > .title > .panel-switcher-container > .monaco-action-bar .action-item .action-label.checked {
+			color: ${titleActive};
+			border-bottom-color: ${titleActiveBorder};
+		}
+	`);
+
+	// Title Inactive
+	const titleInactive = theme.getColor(PANEL_INACTIVE_TITLE_COLOR);
+	collector.addRule(`
+		.monaco-workbench > .part.panel > .title > .panel-switcher-container > .monaco-action-bar .action-item .action-label {
+			color: ${titleInactive};
+		}
+	`);
+
+	// Title focus
+	const focusBorder = theme.getColor(focus);
+	collector.addRule(`
+		.monaco-workbench > .part.panel > .title > .panel-switcher-container > .monaco-action-bar .action-item .action-label:focus {
+			color: ${titleActive};
+			border-bottom-color: ${focusBorder} !important;
+			border-bottom: 1px solid;
+			outline: none;
+		}
+	`);
+
+	// High Contrast Styling
+	if (theme.type === 'hc') {
+		const outline = theme.getColor(highContrastOutline);
+
+		collector.addRule(`
+			.monaco-workbench > .part.panel > .title > .panel-switcher-container > .monaco-action-bar .action-item .action-label.checked,
+			.monaco-workbench > .part.panel > .title > .panel-switcher-container > .monaco-action-bar .action-item .action-label:hover {
+				outline-color: ${outline};
+				outline-width: 1px;
+				outline-style: solid;
+				border-bottom: none;
+				padding-bottom: 0;
+				outline-offset: 3px;
+			}
+
+			.monaco-workbench > .part.panel > .title > .panel-switcher-container > .monaco-action-bar .action-item .action-label:hover:not(.checked) {
+				outline-style: dashed;
+			}
+		`);
+	}
+});
\ No newline at end of file
--- a/src/vs/workbench/common/theme.ts
+++ b/src/vs/workbench/common/theme.ts
@@ -108,6 +108,24 @@ export const PANEL_BORDER_TOP_COLOR = registerColor('panelBorderTopColor', {
 	hc: highContrastBorder
 }, nls.localize('panelBorderTopColor', "Panel border color on the top separating to the editor. Panels are shown below the editor area and contain views like output and integrated terminal."));

+export const PANEL_ACTIVE_TITLE_COLOR = registerColor('panelActiveTitleColor', {
+	dark: '#E7E7E7',
+	light: '#424242',
+	hc: Color.white
+}, nls.localize('panelActiveTitleColor', "Title color for the active panel. Panels are shown below the editor area and contain views like output and integrated terminal."));
+
+export const PANEL_INACTIVE_TITLE_COLOR = registerColor('panelInactiveTitleColor', {
+	dark: Color.fromRGBA(new RGBA(231, 231, 231)).transparent(0.5),
+	light: Color.fromRGBA(new RGBA(66, 66, 66)).transparent(0.75),
+	hc: Color.white
+}, nls.localize('panelInactiveTitleColor', "Title color for the inactive panel. Panels are shown below the editor area and contain views like output and integrated terminal."));
+
+export const PANEL_ACTIVE_TITLE_BORDER = registerColor('panelActiveTitleBorder', {
+	dark: '#404047',
+	light: '#CCCEDA',
+	hc: highContrastBorder
+}, nls.localize('panelActiveTitleBorder', "Border color for the active panel title. Panels are shown below the editor area and contain views like output and integrated terminal."));
+


 // < --- Status --- >

--- a/src/vs/workbench/electron-browser/media/workbench.css
+++ b/src/vs/workbench/electron-browser/media/workbench.css
@@ -35,26 +35,4 @@
 	height: 100%;
 	width: 100%;
 	z-index: 10000;
-}
-
-/* TODO@theme (widgets) */
-
-.vs-dark .monaco-workbench .monaco-scrollable-element .shadow.top {
-	box-shadow: #000 0 6px 6px -6px inset;
-}
-
-.vs-dark .monaco-workbench .monaco-scrollable-element .shadow.left {
-	box-shadow: #000 6px 0 6px -6px inset;
-}
-
-.vs-dark .monaco-workbench .monaco-scrollable-element .shadow.top.left {
-	box-shadow: #000 6px 6px 6px -6px inset;
-}
-
-.vs-dark .monaco-workbench .monaco-scrollable-element .slider.active {
-	background-color: rgba(85, 85, 85, .8);
-}
-
-.hc-black .monaco-workbench .monaco-action-bar .action-item.disabled .action-label.disabled {
-	opacity: 0.4;
 }
\ No newline at end of file
--- a/src/vs/workbench/parts/extensions/electron-browser/extensionsViewlet.ts
+++ b/src/vs/workbench/parts/extensions/electron-browser/extensionsViewlet.ts
@@ -50,7 +50,7 @@ import { IActivityBarService, ProgressBadge, NumberBadge } from 'vs/workbench/se
 import { IExtensionService } from 'vs/platform/extensions/common/extensions';
 import { IModeService } from 'vs/editor/common/services/modeService';
 import { IThemeService } from 'vs/platform/theme/common/themeService';
-import { inputForeground, inputBackground } from 'vs/platform/theme/common/colorRegistry';
+import { inputForeground, inputBackground, highContrastBorder } from 'vs/platform/theme/common/colorRegistry';

 interface SearchInputEvent extends Event {
 	target: HTMLInputElement;
@@ -144,8 +144,14 @@ export class ExtensionsViewlet extends Viewlet implements IExtensionsViewlet {
 	public updateStyles(): void {
 		super.updateStyles();

+		const hcBorder = this.isHighContrastTheme ? this.getColor(highContrastBorder) : null;
+
 		this.searchBox.style.backgroundColor = this.getColor(inputBackground);
 		this.searchBox.style.color = this.getColor(inputForeground);
+
+		this.searchBox.style.borderWidth = hcBorder ? '1px' : null;
+		this.searchBox.style.borderStyle = hcBorder ? 'solid' : null;
+		this.searchBox.style.borderColor = hcBorder;
 	}

 	setVisible(visible: boolean): TPromise<void> {

--- a/src/vs/workbench/parts/extensions/electron-browser/media/extensionsViewlet.css
+++ b/src/vs/workbench/parts/extensions/electron-browser/media/extensionsViewlet.css
@@ -167,8 +167,4 @@
 	background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxNCIgaGVpZ2h0PSIxNCIgdmlld0JveD0iMiAyIDE0IDE0IiBlbmFibGUtYmFja2dyb3VuZD0ibmV3IDIgMiAxNCAxNCI+PHBhdGggZmlsbD0iI2ZmZiIgZD0iTTkgMTZjLTMuODYgMC03LTMuMTQtNy03czMuMTQtNyA3LTdjMy44NTkgMCA3IDMuMTQxIDcgN3MtMy4xNDEgNy03IDd6bTAtMTIuNmMtMy4wODggMC01LjYgMi41MTMtNS42IDUuNnMyLjUxMiA1LjYgNS42IDUuNiA1LjYtMi41MTIgNS42LTUuNi0yLjUxMi01LjYtNS42LTUuNnptMy44NiA3LjFsLTMuMTYtMS44OTZ2LTMuODA0aC0xLjR2NC41OTZsMy44NCAyLjMwNS43Mi0xLjIwMXoiLz48L3N2Zz4=");
 	background-position: center center;
 	background-repeat: no-repeat;
-}
-
-.hc-black .monaco-workbench .extensions-viewlet > .header > .search-box {
-	border: 1px solid #6FC3DF;
 }
\ No newline at end of file