Skip to content

Commit bf21fb4

Browse files
author
Benjamin Pasero
committed
quick pick - introduce quickInputTitle.background color
1 parent 78774b8 commit bf21fb4

3 files changed

Lines changed: 6 additions & 8 deletions

File tree

src/vs/base/parts/quickinput/browser/quickInput.ts

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -60,9 +60,9 @@ export interface IQuickInputStyles {
6060
export interface IQuickInputWidgetStyles {
6161
quickInputBackground?: Color;
6262
quickInputForeground?: Color;
63+
quickInputTitleBackground?: Color;
6364
contrastBorder?: Color;
6465
widgetShadow?: Color;
65-
titleColor: string | undefined;
6666
}
6767

6868
const $ = dom.$;
@@ -1515,13 +1515,13 @@ export class QuickInputController extends Disposable {
15151515
private updateStyles() {
15161516
if (this.ui) {
15171517
const {
1518-
titleColor,
1518+
quickInputTitleBackground,
15191519
quickInputBackground,
15201520
quickInputForeground,
15211521
contrastBorder,
15221522
widgetShadow,
15231523
} = this.styles.widget;
1524-
this.ui.titleBar.style.backgroundColor = titleColor || '';
1524+
this.ui.titleBar.style.backgroundColor = quickInputTitleBackground ? quickInputTitleBackground.toString() : '';
15251525
this.ui.container.style.backgroundColor = quickInputBackground ? quickInputBackground.toString() : '';
15261526
this.ui.container.style.color = quickInputForeground ? quickInputForeground.toString() : '';
15271527
this.ui.container.style.border = contrastBorder ? `1px solid ${contrastBorder}` : '';

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

Lines changed: 1 addition & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -84,8 +84,6 @@ export interface IColorRegistry {
8484

8585
}
8686

87-
88-
8987
class ColorRegistry implements IColorRegistry {
9088

9189
private readonly _onDidChangeSchema = new Emitter<void>();
@@ -226,7 +224,6 @@ export const simpleCheckboxBackground = registerColor('checkbox.background', { d
226224
export const simpleCheckboxForeground = registerColor('checkbox.foreground', { dark: selectForeground, light: selectForeground, hc: selectForeground }, nls.localize('checkbox.foreground', "Foreground color of checkbox widget."));
227225
export const simpleCheckboxBorder = registerColor('checkbox.border', { dark: selectBorder, light: selectBorder, hc: selectBorder }, nls.localize('checkbox.border', "Border color of checkbox widget."));
228226

229-
230227
export const buttonForeground = registerColor('button.foreground', { dark: Color.white, light: Color.white, hc: Color.white }, nls.localize('buttonForeground', "Button foreground color."));
231228
export const buttonBackground = registerColor('button.background', { dark: '#0E639C', light: '#007ACC', hc: null }, nls.localize('buttonBackground', "Button background color."));
232229
export const buttonHoverBackground = registerColor('button.hoverBackground', { dark: lighten(buttonBackground, 0.2), light: darken(buttonBackground, 0.2), hc: null }, nls.localize('buttonHoverBackground', "Button background color when hovering."));
@@ -280,6 +277,7 @@ export const editorWidgetResizeBorder = registerColor('editorWidget.resizeBorder
280277
*/
281278
export const quickInputBackground = registerColor('quickInput.background', { dark: editorWidgetBackground, light: editorWidgetBackground, hc: editorWidgetBackground }, nls.localize('pickerBackground', "Quick picker background color. The quick picker widget is the container for pickers like the command palette."));
282279
export const quickInputForeground = registerColor('quickInput.foreground', { dark: editorWidgetForeground, light: editorWidgetForeground, hc: editorWidgetForeground }, nls.localize('pickerForeground', "Quick picker foreground color. The quick picker widget is the container for pickers like the command palette."));
280+
export const quickInputTitleBackground = registerColor('quickInputTitle.background', { dark: new Color(new RGBA(255, 255, 255, 0.105)), light: new Color(new RGBA(0, 0, 0, 0.06)), hc: '#000000' }, nls.localize('pickerTitleBackground', "Quick picker title background color. The quick picker widget is the container for pickers like the command palette."));
283281
export const pickerGroupForeground = registerColor('pickerGroup.foreground', { dark: '#3794FF', light: '#0066BF', hc: Color.white }, nls.localize('pickerGroupForeground', "Quick picker color for grouping labels."));
284282
export const pickerGroupBorder = registerColor('pickerGroup.border', { dark: '#3F3F46', light: '#CCCEDB', hc: Color.white }, nls.localize('pickerGroupBorder', "Quick picker color for grouping borders."));
285283

src/vs/workbench/browser/parts/quickinput/quickInput.ts

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@ import { IQuickInputService, IQuickPickItem, IPickOptions, IInputOptions, IQuick
77
import { ILayoutService } from 'vs/platform/layout/browser/layoutService';
88
import { IInstantiationService } from 'vs/platform/instantiation/common/instantiation';
99
import { IThemeService } from 'vs/platform/theme/common/themeService';
10-
import { inputBackground, inputForeground, inputBorder, inputValidationInfoBackground, inputValidationInfoForeground, inputValidationInfoBorder, inputValidationWarningBackground, inputValidationWarningForeground, inputValidationWarningBorder, inputValidationErrorBackground, inputValidationErrorForeground, inputValidationErrorBorder, badgeBackground, badgeForeground, contrastBorder, buttonForeground, buttonBackground, buttonHoverBackground, progressBarBackground, widgetShadow, listFocusForeground, listFocusBackground, activeContrastBorder, pickerGroupBorder, pickerGroupForeground, quickInputForeground, quickInputBackground } from 'vs/platform/theme/common/colorRegistry';
10+
import { inputBackground, inputForeground, inputBorder, inputValidationInfoBackground, inputValidationInfoForeground, inputValidationInfoBorder, inputValidationWarningBackground, inputValidationWarningForeground, inputValidationWarningBorder, inputValidationErrorBackground, inputValidationErrorForeground, inputValidationErrorBorder, badgeBackground, badgeForeground, contrastBorder, buttonForeground, buttonBackground, buttonHoverBackground, progressBarBackground, widgetShadow, listFocusForeground, listFocusBackground, activeContrastBorder, pickerGroupBorder, pickerGroupForeground, quickInputForeground, quickInputBackground, quickInputTitleBackground } from 'vs/platform/theme/common/colorRegistry';
1111
import { IQuickOpenService } from 'vs/platform/quickOpen/common/quickOpen';
1212
import { CancellationToken } from 'vs/base/common/cancellation';
1313
import { KeyCode, KeyMod } from 'vs/base/common/keyCodes';
@@ -171,12 +171,12 @@ export class QuickInputService extends PlatformQuickInputService {
171171
private computeStyles(): IQuickInputStyles {
172172
return {
173173
widget: {
174-
titleColor: { dark: 'rgba(255, 255, 255, 0.105)', light: 'rgba(0,0,0,.06)', hc: 'black' }[this.theme.type], // TODO
175174
...computeStyles(this.theme, {
176175
quickInputBackground,
177176
quickInputForeground,
178177
contrastBorder,
179178
widgetShadow,
179+
quickInputTitleBackground
180180
}),
181181
},
182182
inputBox: computeStyles(this.theme, {

0 commit comments

Comments
 (0)