From 7653d836944892f83ce9e1f95c1204bafa1aec31 Mon Sep 17 00:00:00 2001 From: Miguel Solorio Date: Thu, 7 May 2020 20:26:56 -0700 Subject: [PATCH] Update pills style to use mix (ref #96608) --- src/vs/base/browser/ui/countBadge/countBadge.css | 5 +++++ src/vs/base/parts/quickinput/browser/media/quickInput.css | 2 ++ src/vs/workbench/contrib/debug/browser/callStackView.ts | 2 +- .../contrib/files/browser/media/explorerviewlet.css | 3 +-- .../workbench/contrib/files/browser/views/openEditorsView.ts | 2 +- .../contrib/preferences/browser/keybindingsEditor.ts | 2 +- .../workbench/contrib/preferences/browser/settingsEditor2.ts | 2 +- 7 files changed, 12 insertions(+), 6 deletions(-) diff --git a/src/vs/base/browser/ui/countBadge/countBadge.css b/src/vs/base/browser/ui/countBadge/countBadge.css index db90e7ae5529..ce26af5e6a1b 100644 --- a/src/vs/base/browser/ui/countBadge/countBadge.css +++ b/src/vs/base/browser/ui/countBadge/countBadge.css @@ -15,3 +15,8 @@ display: inline-block; box-sizing: border-box; } + +.monaco-count-badge.long { + padding: 2px 3px; + border-radius: 2px; +} diff --git a/src/vs/base/parts/quickinput/browser/media/quickInput.css b/src/vs/base/parts/quickinput/browser/media/quickInput.css index d45840ee38ce..c086b587c141 100644 --- a/src/vs/base/parts/quickinput/browser/media/quickInput.css +++ b/src/vs/base/parts/quickinput/browser/media/quickInput.css @@ -103,6 +103,8 @@ .quick-input-count .monaco-count-badge { vertical-align: middle; + padding: 2px 4px; + border-radius: 2px; } .quick-input-action { diff --git a/src/vs/workbench/contrib/debug/browser/callStackView.ts b/src/vs/workbench/contrib/debug/browser/callStackView.ts index 4a1a948276a4..9f65698bf2de 100644 --- a/src/vs/workbench/contrib/debug/browser/callStackView.ts +++ b/src/vs/workbench/contrib/debug/browser/callStackView.ts @@ -475,7 +475,7 @@ class SessionsRenderer implements ITreeRenderer { diff --git a/src/vs/workbench/contrib/files/browser/media/explorerviewlet.css b/src/vs/workbench/contrib/files/browser/media/explorerviewlet.css index f0078fb7192c..b77e6fb7065a 100644 --- a/src/vs/workbench/contrib/files/browser/media/explorerviewlet.css +++ b/src/vs/workbench/contrib/files/browser/media/explorerviewlet.css @@ -60,8 +60,7 @@ } .dirty-count.monaco-count-badge { - padding-top: 2px; - padding-bottom: 2px; + padding: 2px 4px; margin-left: 6px; min-height: auto; } diff --git a/src/vs/workbench/contrib/files/browser/views/openEditorsView.ts b/src/vs/workbench/contrib/files/browser/views/openEditorsView.ts index f6dd1068a03b..dfdbc4bac2c5 100644 --- a/src/vs/workbench/contrib/files/browser/views/openEditorsView.ts +++ b/src/vs/workbench/contrib/files/browser/views/openEditorsView.ts @@ -184,7 +184,7 @@ export class OpenEditorsView extends ViewPane { super.renderHeaderTitle(container, this.title); const count = dom.append(container, $('.count')); - this.dirtyCountElement = dom.append(count, $('.dirty-count.monaco-count-badge')); + this.dirtyCountElement = dom.append(count, $('.dirty-count.monaco-count-badge.long')); this._register((attachStylerCallback(this.themeService, { badgeBackground, badgeForeground, contrastBorder }, colors => { const background = colors.badgeBackground ? colors.badgeBackground.toString() : ''; diff --git a/src/vs/workbench/contrib/preferences/browser/keybindingsEditor.ts b/src/vs/workbench/contrib/preferences/browser/keybindingsEditor.ts index f20dcdfbcbe4..8b7b0145b91c 100644 --- a/src/vs/workbench/contrib/preferences/browser/keybindingsEditor.ts +++ b/src/vs/workbench/contrib/preferences/browser/keybindingsEditor.ts @@ -401,7 +401,7 @@ export class KeybindingsEditor extends BaseEditor implements IKeybindingsEditorP } private createRecordingBadge(container: HTMLElement): HTMLElement { - const recordingBadge = DOM.append(container, DOM.$('.recording-badge.monaco-count-badge.disabled')); + const recordingBadge = DOM.append(container, DOM.$('.recording-badge.monaco-count-badge.long.disabled')); recordingBadge.textContent = localize('recording', "Recording Keys"); this._register(attachStylerCallback(this.themeService, { badgeBackground, contrastBorder, badgeForeground }, colors => { const background = colors.badgeBackground ? colors.badgeBackground.toString() : ''; diff --git a/src/vs/workbench/contrib/preferences/browser/settingsEditor2.ts b/src/vs/workbench/contrib/preferences/browser/settingsEditor2.ts index 9a7443f2aafb..f7fbfb25ba0e 100644 --- a/src/vs/workbench/contrib/preferences/browser/settingsEditor2.ts +++ b/src/vs/workbench/contrib/preferences/browser/settingsEditor2.ts @@ -442,7 +442,7 @@ export class SettingsEditor2 extends BaseEditor { inputBorder: settingsTextInputBorder })); - this.countElement = DOM.append(searchContainer, DOM.$('.settings-count-widget.monaco-count-badge')); + this.countElement = DOM.append(searchContainer, DOM.$('.settings-count-widget.monaco-count-badge.long')); this._register(attachStylerCallback(this.themeService, { badgeBackground, contrastBorder, badgeForeground }, colors => { const background = colors.badgeBackground ? colors.badgeBackground.toString() : ''; const border = colors.contrastBorder ? colors.contrastBorder.toString() : '';