Support standalone editor quick pick changes

Author: Miguel Solorio

src/vs/editor/contrib/suggest/suggestWidget.ts

@@ -21,7 +21,7 @@ import { Context as SuggestContext, CompletionItem } from './suggest';
 import { CompletionModel } from './completionModel';
 import { attachListStyler } from 'vs/platform/theme/common/styler';
 import { IThemeService, IColorTheme, registerThemingParticipant } from 'vs/platform/theme/common/themeService';
-import { registerColor, editorWidgetBackground, quickInputListFocusBackground, activeContrastBorder, listHighlightForeground, editorForeground, editorWidgetBorder, focusBorder, textLinkForeground, textCodeBlockBackground, quickInputListFocusForeground } from 'vs/platform/theme/common/colorRegistry';
+import { registerColor, editorWidgetBackground, quickInputListFocusBackground, activeContrastBorder, listHighlightForeground, editorForeground, editorWidgetBorder, focusBorder, textLinkForeground, textCodeBlockBackground, quickInputListFocusForeground, listFocusHighlightForeground } from 'vs/platform/theme/common/colorRegistry';
 import { IStorageService, StorageScope, StorageTarget } from 'vs/platform/storage/common/storage';
 import { TimeoutTimer, CancelablePromise, createCancelablePromise, disposableTimeout } from 'vs/base/common/async';
 import { IInstantiationService } from 'vs/platform/instantiation/common/instantiation';
@@ -43,6 +43,7 @@ export const editorSuggestWidgetForeground = registerColor('editorSuggestWidget.
 export const editorSuggestWidgetSelectedForeground = registerColor('editorSuggestWidget.selectedForeground', { dark: quickInputListFocusForeground, light: quickInputListFocusForeground, hc: quickInputListFocusForeground }, nls.localize('editorSuggestWidgetSelectedForeground', 'Foreground color of the selected entry in the suggest widget.'));
 export const editorSuggestWidgetSelectedBackground = registerColor('editorSuggestWidget.selectedBackground', { dark: quickInputListFocusBackground, light: quickInputListFocusBackground, hc: quickInputListFocusBackground }, nls.localize('editorSuggestWidgetSelectedBackground', 'Background color of the selected entry in the suggest widget.'));
 export const editorSuggestWidgetHighlightForeground = registerColor('editorSuggestWidget.highlightForeground', { dark: listHighlightForeground, light: listHighlightForeground, hc: listHighlightForeground }, nls.localize('editorSuggestWidgetHighlightForeground', 'Color of the match highlights in the suggest widget.'));
+export const editorSuggestWidgetHighlightFocusForeground = registerColor('editorSuggestWidget.focusHighlightForeground', { dark: listFocusHighlightForeground, light: listFocusHighlightForeground, hc: listFocusHighlightForeground }, nls.localize('editorSuggestWidgetFocusHighlightForeground', 'Color of the match highlights in the suggest widget when an item is focused.'));
 
 const enum State {
 	Hidden,
@@ -973,6 +974,12 @@ registerThemingParticipant((theme, collector) => {
 	if (matchHighlight) {
 		collector.addRule(`.monaco-editor .suggest-widget .monaco-list .monaco-list-row .monaco-highlighted-label .highlight { color: ${matchHighlight}; }`);
 	}
+
+	const matchHighlightFocus = theme.getColor(editorSuggestWidgetHighlightFocusForeground);
+	if (matchHighlight) {
+		collector.addRule(`.monaco-editor .suggest-widget .monaco-list .monaco-list-row.focused .monaco-highlighted-label .highlight { color: ${matchHighlightFocus}; }`);
+	}
+
 	const foreground = theme.getColor(editorSuggestWidgetForeground);
 	if (foreground) {
 		collector.addRule(`.monaco-editor .suggest-widget, .monaco-editor .suggest-details { color: ${foreground}; }`);

src/vs/editor/standalone/browser/quickInput/standaloneQuickInput.css

@@ -12,6 +12,11 @@
 	color: #0066BF;
 }
 
+.quick-input-widget .monaco-list-row.focused .monaco-highlighted-label .highlight,
+.quick-input-widget .monaco-list-row.focused .monaco-highlighted-label .highlight {
+	color: #33B6FF;
+}
+
 .vs-dark .quick-input-widget .monaco-highlighted-label .highlight,
 .vs-dark .quick-input-widget .monaco-highlighted-label .highlight {
 	color: #0097fb;

src/vs/editor/standalone/common/themes.ts

@@ -5,7 +5,7 @@
 
 import { editorActiveIndentGuides, editorIndentGuides } from 'vs/editor/common/view/editorColorRegistry';
 import { IStandaloneThemeData } from 'vs/editor/standalone/common/standaloneThemeService';
-import { editorBackground, editorForeground, editorInactiveSelection, editorSelectionHighlight } from 'vs/platform/theme/common/colorRegistry';
+import { editorBackground, editorForeground, editorInactiveSelection, editorSelectionHighlight, listFocusHighlightForeground } from 'vs/platform/theme/common/colorRegistry';
 
 /* -------------------------------- Begin vs theme -------------------------------- */
 export const vs: IStandaloneThemeData = {
@@ -73,7 +73,8 @@ export const vs: IStandaloneThemeData = {
 		[editorInactiveSelection]: '#E5EBF1',
 		[editorIndentGuides]: '#D3D3D3',
 		[editorActiveIndentGuides]: '#939393',
-		[editorSelectionHighlight]: '#ADD6FF4D'
+		[editorSelectionHighlight]: '#ADD6FF4D',
+		[listFocusHighlightForeground]: '#33B6FF'
 	}
 };
 /* -------------------------------- End vs theme -------------------------------- */
@@ -144,7 +145,8 @@ export const vs_dark: IStandaloneThemeData = {
 		[editorInactiveSelection]: '#3A3D41',
 		[editorIndentGuides]: '#404040',
 		[editorActiveIndentGuides]: '#707070',
-		[editorSelectionHighlight]: '#ADD6FF26'
+		[editorSelectionHighlight]: '#ADD6FF26',
+		[listFocusHighlightForeground]: '#ff0000'
 	}
 };
 /* -------------------------------- End vs-dark theme -------------------------------- */

src/vs/workbench/browser/style.ts

@@ -63,7 +63,7 @@ registerThemingParticipant((theme, collector) => {
 
 	// List highlight w/ focus
 	const listHighlightFocusForegroundColor = theme.getColor(listFocusHighlightForeground);
-	if (listHighlightForegroundColor) {
+	if (listHighlightFocusForegroundColor) {
 		collector.addRule(`
 			.monaco-workbench .monaco-list .monaco-list-row.focused .monaco-highlighted-label .highlight {
 				color: ${listHighlightFocusForegroundColor} !important;