Skip to content

Commit 7cdd536

Browse files
cleidighcleidigh
committed
Use pickerGroupForeground for decoratorRight color
1 parent c8f368b commit 7cdd536

5 files changed

Lines changed: 16 additions & 9 deletions

File tree

‎src/vs/base/browser/ui/selectBox/selectBox.ts‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -44,7 +44,7 @@ export interface ISelectBoxOptions {
4444
// Utilize optionItem interface to capture all option parameters
4545
export interface ISelectOptionItem {
4646
text: string;
47-
decorationRight?: string;
47+
decoratorRight?: string;
4848
description?: string;
4949
descriptionIsMarkdown?: boolean;
5050
isDisabled?: boolean;
@@ -54,6 +54,7 @@ export interface ISelectBoxStyles extends IListStyles {
5454
selectBackground?: Color;
5555
selectListBackground?: Color;
5656
selectForeground?: Color;
57+
decoratorRightForeground?: Color;
5758
selectBorder?: Color;
5859
selectListBorder?: Color;
5960
focusBorder?: Color;

‎src/vs/base/browser/ui/selectBox/selectBoxCustom.css‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -83,7 +83,7 @@
8383
float: left;
8484
}
8585

86-
.monaco-select-box-dropdown-container > .select-box-dropdown-list-container .monaco-list .monaco-list-row > .option-decoration-right {
86+
.monaco-select-box-dropdown-container > .select-box-dropdown-list-container .monaco-list .monaco-list-row > .option-decorator-right {
8787
text-overflow: ellipsis;
8888
overflow: hidden;
8989
padding-right: 10px;

‎src/vs/base/browser/ui/selectBox/selectBoxCustom.ts‎

Lines changed: 10 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -28,7 +28,7 @@ interface ISelectListTemplateData {
2828
root: HTMLElement;
2929
text: HTMLElement;
3030
itemDescription: HTMLElement;
31-
decorationRight: HTMLElement;
31+
decoratorRight: HTMLElement;
3232
disposables: IDisposable[];
3333
}
3434

@@ -43,7 +43,7 @@ class SelectListRenderer implements IListRenderer<ISelectOptionItem, ISelectList
4343
data.disposables = [];
4444
data.root = container;
4545
data.text = dom.append(container, $('.option-text'));
46-
data.decorationRight = dom.append(container, $('.option-decoration-right'));
46+
data.decoratorRight = dom.append(container, $('.option-decorator-right'));
4747
data.itemDescription = dom.append(container, $('.option-text-description'));
4848
dom.addClass(data.itemDescription, 'visually-hidden');
4949

@@ -53,11 +53,11 @@ class SelectListRenderer implements IListRenderer<ISelectOptionItem, ISelectList
5353
renderElement(element: ISelectOptionItem, index: number, templateData: ISelectListTemplateData): void {
5454
const data = <ISelectListTemplateData>templateData;
5555
const text = (<ISelectOptionItem>element).text;
56-
const decorationRight = (<ISelectOptionItem>element).decorationRight;
56+
const decoratorRight = (<ISelectOptionItem>element).decoratorRight;
5757
const isDisabled = (<ISelectOptionItem>element).isDisabled;
5858

5959
data.text.textContent = text;
60-
data.decorationRight.innerText = (!!decorationRight ? decorationRight : '');
60+
data.decoratorRight.innerText = (!!decoratorRight ? decoratorRight : '');
6161

6262
if (typeof element.description === 'string') {
6363
const itemDescriptionId = (text.replace(/ /g, '_').toLowerCase() + '_description_' + data.root.id);
@@ -329,6 +329,10 @@ export class SelectBoxList implements ISelectBoxDelegate, IListVirtualDelegate<I
329329
content.push(`.monaco-select-box-dropdown-container > .select-box-dropdown-list-container .monaco-list .monaco-list-row.focused:not(:hover) { color: ${this.styles.listFocusForeground} !important; }`);
330330
}
331331

332+
if (this.styles.decoratorRightForeground) {
333+
content.push(`.monaco-select-box-dropdown-container > .select-box-dropdown-list-container .monaco-list .monaco-list-row .option-decorator-right { color: ${this.styles.decoratorRightForeground} !important; }`);
334+
}
335+
332336
if (this.styles.selectBackground && this.styles.selectBorder && !this.styles.selectBorder.equals(this.styles.selectBackground)) {
333337
content.push(`.monaco-select-box-dropdown-container { border: 1px solid ${this.styles.selectBorder} } `);
334338
content.push(`.monaco-select-box-dropdown-container > .select-box-details-pane.border-top { border-top: 1px solid ${this.styles.selectBorder} } `);
@@ -690,15 +694,15 @@ export class SelectBoxList implements ISelectBoxDelegate, IListVirtualDelegate<I
690694
let longestLength = 0;
691695

692696
this.options.forEach((option, index) => {
693-
const len = option.text.length + (!!option.decorationRight ? option.decorationRight.length : 0);
697+
const len = option.text.length + (!!option.decoratorRight ? option.decoratorRight.length : 0);
694698
if (len > longestLength) {
695699
longest = index;
696700
longestLength = len;
697701
}
698702
});
699703

700704

701-
container.innerHTML = this.options[longest].text + (!!this.options[longest].decorationRight ? (this.options[longest].decorationRight + ' ') : '');
705+
container.innerHTML = this.options[longest].text + (!!this.options[longest].decoratorRight ? (this.options[longest].decoratorRight + ' ') : '');
702706
elementWidth = dom.getTotalWidth(container);
703707
}
704708

‎src/vs/platform/theme/common/styler.ts‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -117,6 +117,7 @@ export interface ISelectBoxStyleOverrides extends IStyleOverrides, IListStyleOve
117117
selectBackground?: ColorIdentifier;
118118
selectListBackground?: ColorIdentifier;
119119
selectForeground?: ColorIdentifier;
120+
decoratorRightForeground?: ColorIdentifier;
120121
selectBorder?: ColorIdentifier;
121122
focusBorder?: ColorIdentifier;
122123
}
@@ -126,6 +127,7 @@ export function attachSelectBoxStyler(widget: IThemable, themeService: IThemeSer
126127
selectBackground: (style && style.selectBackground) || selectBackground,
127128
selectListBackground: (style && style.selectListBackground) || selectListBackground,
128129
selectForeground: (style && style.selectForeground) || selectForeground,
130+
decoratorRightForeground: (style && style.pickerGroupForeground) || pickerGroupForeground,
129131
selectBorder: (style && style.selectBorder) || selectBorder,
130132
focusBorder: (style && style.focusBorder) || focusBorder,
131133
listFocusBackground: (style && style.listFocusBackground) || listFocusBackground,

‎src/vs/workbench/parts/preferences/browser/settingsTree.ts‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1174,7 +1174,7 @@ export class SettingsRenderer implements ITreeRenderer {
11741174
text: data,
11751175
description: (enumDescriptions && enumDescriptions[index] && (enumDescriptionsAreMarkdown ? fixSettingLinks(enumDescriptions[index], false) : enumDescriptions[index])),
11761176
descriptionIsMarkdown: enumDescriptionsAreMarkdown,
1177-
decorationRight: (data === dataElement.defaultValue ? localize('settings.Default', "({0})", 'default') : '')
1177+
decoratorRight: (data === dataElement.defaultValue ? localize('settings.Default', "{0}", 'default') : '')
11781178
});
11791179

11801180
template.selectBox.setOptions(displayOptions);

0 commit comments

Comments
 (0)