mirror of
https://github.com/Microsoft/vscode
synced 2024-09-19 18:48:00 +00:00
Use pickerGroupForeground for decoratorRight color
This commit is contained in:
parent
c8f368baa7
commit
7cdd536bf3
|
@ -44,7 +44,7 @@ export interface ISelectBoxOptions {
|
|||
// Utilize optionItem interface to capture all option parameters
|
||||
export interface ISelectOptionItem {
|
||||
text: string;
|
||||
decorationRight?: string;
|
||||
decoratorRight?: string;
|
||||
description?: string;
|
||||
descriptionIsMarkdown?: boolean;
|
||||
isDisabled?: boolean;
|
||||
|
@ -54,6 +54,7 @@ export interface ISelectBoxStyles extends IListStyles {
|
|||
selectBackground?: Color;
|
||||
selectListBackground?: Color;
|
||||
selectForeground?: Color;
|
||||
decoratorRightForeground?: Color;
|
||||
selectBorder?: Color;
|
||||
selectListBorder?: Color;
|
||||
focusBorder?: Color;
|
||||
|
|
|
@ -83,7 +83,7 @@
|
|||
float: left;
|
||||
}
|
||||
|
||||
.monaco-select-box-dropdown-container > .select-box-dropdown-list-container .monaco-list .monaco-list-row > .option-decoration-right {
|
||||
.monaco-select-box-dropdown-container > .select-box-dropdown-list-container .monaco-list .monaco-list-row > .option-decorator-right {
|
||||
text-overflow: ellipsis;
|
||||
overflow: hidden;
|
||||
padding-right: 10px;
|
||||
|
|
|
@ -28,7 +28,7 @@ interface ISelectListTemplateData {
|
|||
root: HTMLElement;
|
||||
text: HTMLElement;
|
||||
itemDescription: HTMLElement;
|
||||
decorationRight: HTMLElement;
|
||||
decoratorRight: HTMLElement;
|
||||
disposables: IDisposable[];
|
||||
}
|
||||
|
||||
|
@ -43,7 +43,7 @@ class SelectListRenderer implements IListRenderer<ISelectOptionItem, ISelectList
|
|||
data.disposables = [];
|
||||
data.root = container;
|
||||
data.text = dom.append(container, $('.option-text'));
|
||||
data.decorationRight = dom.append(container, $('.option-decoration-right'));
|
||||
data.decoratorRight = dom.append(container, $('.option-decorator-right'));
|
||||
data.itemDescription = dom.append(container, $('.option-text-description'));
|
||||
dom.addClass(data.itemDescription, 'visually-hidden');
|
||||
|
||||
|
@ -53,11 +53,11 @@ class SelectListRenderer implements IListRenderer<ISelectOptionItem, ISelectList
|
|||
renderElement(element: ISelectOptionItem, index: number, templateData: ISelectListTemplateData): void {
|
||||
const data = <ISelectListTemplateData>templateData;
|
||||
const text = (<ISelectOptionItem>element).text;
|
||||
const decorationRight = (<ISelectOptionItem>element).decorationRight;
|
||||
const decoratorRight = (<ISelectOptionItem>element).decoratorRight;
|
||||
const isDisabled = (<ISelectOptionItem>element).isDisabled;
|
||||
|
||||
data.text.textContent = text;
|
||||
data.decorationRight.innerText = (!!decorationRight ? decorationRight : '');
|
||||
data.decoratorRight.innerText = (!!decoratorRight ? decoratorRight : '');
|
||||
|
||||
if (typeof element.description === 'string') {
|
||||
const itemDescriptionId = (text.replace(/ /g, '_').toLowerCase() + '_description_' + data.root.id);
|
||||
|
@ -329,6 +329,10 @@ export class SelectBoxList implements ISelectBoxDelegate, IListVirtualDelegate<I
|
|||
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; }`);
|
||||
}
|
||||
|
||||
if (this.styles.decoratorRightForeground) {
|
||||
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; }`);
|
||||
}
|
||||
|
||||
if (this.styles.selectBackground && this.styles.selectBorder && !this.styles.selectBorder.equals(this.styles.selectBackground)) {
|
||||
content.push(`.monaco-select-box-dropdown-container { border: 1px solid ${this.styles.selectBorder} } `);
|
||||
content.push(`.monaco-select-box-dropdown-container > .select-box-details-pane.border-top { border-top: 1px solid ${this.styles.selectBorder} } `);
|
||||
|
@ -690,7 +694,7 @@ export class SelectBoxList implements ISelectBoxDelegate, IListVirtualDelegate<I
|
|||
let longestLength = 0;
|
||||
|
||||
this.options.forEach((option, index) => {
|
||||
const len = option.text.length + (!!option.decorationRight ? option.decorationRight.length : 0);
|
||||
const len = option.text.length + (!!option.decoratorRight ? option.decoratorRight.length : 0);
|
||||
if (len > longestLength) {
|
||||
longest = index;
|
||||
longestLength = len;
|
||||
|
@ -698,7 +702,7 @@ export class SelectBoxList implements ISelectBoxDelegate, IListVirtualDelegate<I
|
|||
});
|
||||
|
||||
|
||||
container.innerHTML = this.options[longest].text + (!!this.options[longest].decorationRight ? (this.options[longest].decorationRight + ' ') : '');
|
||||
container.innerHTML = this.options[longest].text + (!!this.options[longest].decoratorRight ? (this.options[longest].decoratorRight + ' ') : '');
|
||||
elementWidth = dom.getTotalWidth(container);
|
||||
}
|
||||
|
||||
|
|
|
@ -117,6 +117,7 @@ export interface ISelectBoxStyleOverrides extends IStyleOverrides, IListStyleOve
|
|||
selectBackground?: ColorIdentifier;
|
||||
selectListBackground?: ColorIdentifier;
|
||||
selectForeground?: ColorIdentifier;
|
||||
decoratorRightForeground?: ColorIdentifier;
|
||||
selectBorder?: ColorIdentifier;
|
||||
focusBorder?: ColorIdentifier;
|
||||
}
|
||||
|
@ -126,6 +127,7 @@ export function attachSelectBoxStyler(widget: IThemable, themeService: IThemeSer
|
|||
selectBackground: (style && style.selectBackground) || selectBackground,
|
||||
selectListBackground: (style && style.selectListBackground) || selectListBackground,
|
||||
selectForeground: (style && style.selectForeground) || selectForeground,
|
||||
decoratorRightForeground: (style && style.pickerGroupForeground) || pickerGroupForeground,
|
||||
selectBorder: (style && style.selectBorder) || selectBorder,
|
||||
focusBorder: (style && style.focusBorder) || focusBorder,
|
||||
listFocusBackground: (style && style.listFocusBackground) || listFocusBackground,
|
||||
|
|
|
@ -1174,7 +1174,7 @@ export class SettingsRenderer implements ITreeRenderer {
|
|||
text: data,
|
||||
description: (enumDescriptions && enumDescriptions[index] && (enumDescriptionsAreMarkdown ? fixSettingLinks(enumDescriptions[index], false) : enumDescriptions[index])),
|
||||
descriptionIsMarkdown: enumDescriptionsAreMarkdown,
|
||||
decorationRight: (data === dataElement.defaultValue ? localize('settings.Default', "({0})", 'default') : '')
|
||||
decoratorRight: (data === dataElement.defaultValue ? localize('settings.Default', "{0}", 'default') : '')
|
||||
});
|
||||
|
||||
template.selectBox.setOptions(displayOptions);
|
||||
|
|
Loading…
Reference in a new issue