Port of Vscode fix for colors too close (#17146)

* default light colors list.focusHighlightForeground too close to list.activeSelectionBackground. Fixes #127597

* remove activeSelectionBackground from theme-carbon as it conflicts with vscode.

* remove dark carbon background

Co-authored-by: Martin Aeschlimann <martinae@microsoft.com>

extensions/theme-carbon/themes/dark_carbon.json

@@ -52,7 +52,6 @@
 		"inputValidation.errorBorder": "#b62e00",
 
 		//List and trees
-		"list.activeSelectionBackground": "#3062d6",
 		"list.hoverBackground": "#444444",
 		"pickerGroup.border": "#0078d7",
 		"input.placeholderForeground": "#a6a6a6",

extensions/theme-carbon/themes/light_carbon.json

@@ -52,7 +52,6 @@
 		"inputValidation.errorBorder": "#b62e00",
 
 		//List and tree
-		"list.activeSelectionBackground": "#3062d6",
 		"list.hoverBackground": "#dcdcdc",
 		"pickerGroup.border": "#0078d7",
 

extensions/theme-defaults/themes/light_vs.json

@@ -24,8 +24,7 @@
 		"tab.lastPinnedBorder": "#61616130",
 		"notebook.cellBorderColor": "#E8E8E8",
 		"notebook.selectedCellBackground": "#c8ddf150",
-		"statusBarItem.errorBackground": "#c72e0f",
+		"statusBarItem.errorBackground": "#c72e0f"
-		"list.focusHighlightForeground": "#9DDDFF"
 	},
 	"tokenColors": [
 		{

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, listFocusHighlightForeground } from 'vs/platform/theme/common/colorRegistry';
+import { editorBackground, editorForeground, editorInactiveSelection, editorSelectionHighlight } from 'vs/platform/theme/common/colorRegistry';
 
 /* -------------------------------- Begin vs theme -------------------------------- */
 export const vs: IStandaloneThemeData = {
@@ -73,8 +73,7 @@ export const vs: IStandaloneThemeData = {
 		[editorInactiveSelection]: '#E5EBF1',
 		[editorIndentGuides]: '#D3D3D3',
 		[editorActiveIndentGuides]: '#939393',
-		[editorSelectionHighlight]: '#ADD6FF4D',
+		[editorSelectionHighlight]: '#ADD6FF4D'
-		[listFocusHighlightForeground]: '#9DDDFF'
 	}
 };
 /* -------------------------------- End vs theme -------------------------------- */

src/vs/platform/theme/common/colorRegistry.ts

@@ -31,6 +31,7 @@ export const enum ColorTransformType {
 	Transparent,
 	OneOf,
 	LessProminent,
+	IfDefinedThenElse
 }
 
 export type ColorTransform =
@@ -38,7 +39,8 @@ export type ColorTransform =
 	| { op: ColorTransformType.Lighten; value: ColorValue; factor: number }
 	| { op: ColorTransformType.Transparent; value: ColorValue; factor: number }
 	| { op: ColorTransformType.OneOf; values: readonly ColorValue[] }
-	| { op: ColorTransformType.LessProminent; value: ColorValue; background: ColorValue; factor: number; transparency: number };
+	| { op: ColorTransformType.LessProminent; value: ColorValue; background: ColorValue; factor: number; transparency: number }
+	| { op: ColorTransformType.IfDefinedThenElse; if: ColorIdentifier; then: ColorValue, else: ColorValue };
 
 export interface ColorDefaults {
 	light: ColorValue | null;
@@ -407,7 +409,7 @@ export const listHoverBackground = registerColor('list.hoverBackground', { dark:
 export const listHoverForeground = registerColor('list.hoverForeground', { dark: null, light: null, hc: null }, nls.localize('listHoverForeground', "List/Tree foreground when hovering over items using the mouse."));
 export const listDropBackground = registerColor('list.dropBackground', { dark: '#062F4A', light: '#D6EBFF', hc: null }, nls.localize('listDropBackground', "List/Tree drag and drop background when moving items around using the mouse."));
 export const listHighlightForeground = registerColor('list.highlightForeground', { dark: '#18A3FF', light: '#0066BF', hc: focusBorder }, nls.localize('highlight', 'List/Tree foreground color of the match highlights when searching inside the list/tree.'));
-export const listFocusHighlightForeground = registerColor('list.focusHighlightForeground', { dark: listHighlightForeground, light: listHighlightForeground, hc: listHighlightForeground }, nls.localize('listFocusHighlightForeground', 'List/Tree foreground color of the match highlights on actively focused items when searching inside the list/tree.'));
+export const listFocusHighlightForeground = registerColor('list.focusHighlightForeground', { dark: listHighlightForeground, light: ifDefinedThenElse(listActiveSelectionBackground, listHighlightForeground, '#9DDDFF'), hc: listHighlightForeground }, nls.localize('listFocusHighlightForeground', 'List/Tree foreground color of the match highlights on actively focused items when searching inside the list/tree.'));
 export const listInvalidItemForeground = registerColor('list.invalidItemForeground', { dark: '#B89500', light: '#B89500', hc: '#B89500' }, nls.localize('invalidItemForeground', 'List/Tree foreground color for invalid items, for example an unresolved root in explorer.'));
 export const listErrorForeground = registerColor('list.errorForeground', { dark: '#F88070', light: '#B01011', hc: null }, nls.localize('listErrorForeground', 'Foreground color of list items containing errors.'));
 export const listWarningForeground = registerColor('list.warningForeground', { dark: '#CCA700', light: '#855F00', hc: null }, nls.localize('listWarningForeground', 'Foreground color of list items containing warnings.'));
@@ -425,7 +427,7 @@ export const listDeemphasizedForeground = registerColor('list.deemphasizedForegr
  */
 export const _deprecatedQuickInputListFocusBackground = registerColor('quickInput.list.focusBackground', { dark: null, light: null, hc: null }, '', undefined, nls.localize('quickInput.list.focusBackground deprecation', "Please use quickInputList.focusBackground instead"));
 export const quickInputListFocusForeground = registerColor('quickInputList.focusForeground', { dark: listActiveSelectionForeground, light: listActiveSelectionForeground, hc: listActiveSelectionForeground }, nls.localize('quickInput.listFocusForeground', "Quick picker foreground color for the focused item."));
-export const quickInputListFocusBackground = registerColor('quickInputList.focusBackground', { dark: oneOf(_deprecatedQuickInputListFocusBackground, listActiveSelectionBackground, '#062F4A'), light: oneOf(_deprecatedQuickInputListFocusBackground, listActiveSelectionBackground, '#D6EBFF'), hc: null }, nls.localize('quickInput.listFocusBackground', "Quick picker background color for the focused item."));
+export const quickInputListFocusBackground = registerColor('quickInputList.focusBackground', { dark: oneOf(_deprecatedQuickInputListFocusBackground, listActiveSelectionBackground), light: oneOf(_deprecatedQuickInputListFocusBackground, listActiveSelectionBackground), hc: null }, nls.localize('quickInput.listFocusBackground', "Quick picker background color for the focused item."));
 
 /**
  * Menu colors
@@ -538,6 +540,9 @@ export function executeTransform(transform: ColorTransform, theme: IColorTheme)
 			}
 			return undefined;
 
+		case ColorTransformType.IfDefinedThenElse:
+			return resolveColorValue(theme.defines(transform.if) ? transform.then : transform.else, theme);
+
 		case ColorTransformType.LessProminent:
 			const from = resolveColorValue(transform.value, theme);
 			if (!from) {
@@ -573,6 +578,10 @@ export function oneOf(...colorValues: ColorValue[]): ColorTransform {
 	return { op: ColorTransformType.OneOf, values: colorValues };
 }
 
+export function ifDefinedThenElse(ifArg: ColorIdentifier, thenArg: ColorValue, elseArg: ColorValue): ColorTransform {
+	return { op: ColorTransformType.IfDefinedThenElse, if: ifArg, then: thenArg, else: elseArg };
+}
+
 function lessProminent(colorValue: ColorValue, backgroundColorValue: ColorValue, factor: number, transparency: number): ColorTransform {
 	return { op: ColorTransformType.LessProminent, value: colorValue, background: backgroundColorValue, factor, transparency };
 }