Skip to content

Commit 54f0078

Browse files
author
Miguel Solorio
committed
Adopt icon font in dialog
1 parent a56c48e commit 54f0078

14 files changed

Lines changed: 21 additions & 186 deletions

File tree

‎src/vs/base/browser/ui/dialog/close-dark.svg‎

Lines changed: 0 additions & 3 deletions
This file was deleted.

‎src/vs/base/browser/ui/dialog/close-light.svg‎

Lines changed: 0 additions & 3 deletions
This file was deleted.

‎src/vs/base/browser/ui/dialog/dialog.css‎

Lines changed: 5 additions & 56 deletions
Original file line numberDiff line numberDiff line change
@@ -46,15 +46,6 @@
4646
}
4747

4848

49-
.monaco-workbench .dialog-box .dialog-close-action {
50-
background: url('close-light.svg') center center no-repeat;
51-
}
52-
53-
.vs-dark .monaco-workbench .dialog-box .dialog-close-action,
54-
.hc-black .monaco-workbench .dialog-box .dialog-close-action {
55-
background: url('close-dark.svg') center center no-repeat;
56-
}
57-
5849
/** Dialog: Message Row */
5950
.monaco-workbench .dialog-box .dialog-message-row {
6051
display: flex;
@@ -63,56 +54,11 @@
6354
padding: 0 10px;
6455
}
6556

66-
.monaco-workbench .dialog-box .dialog-message-row .dialog-icon {
57+
.monaco-workbench .dialog-box .dialog-message-row > .codicon {
6758
flex: 0 0 48px;
6859
height: 48px;
6960
align-self: baseline;
70-
background-position: center;
71-
background-repeat: no-repeat;
72-
background-size: 48px;
73-
}
74-
75-
.vs .monaco-workbench .dialog-box .dialog-message-row .dialog-icon.icon-pending {
76-
background-image: url('pending.svg');
77-
}
78-
79-
.vs .monaco-workbench .dialog-box .dialog-message-row .dialog-icon.icon-info {
80-
background-image: url('info-light.svg');
81-
}
82-
83-
.vs .monaco-workbench .dialog-box .dialog-message-row .dialog-icon.icon-warning {
84-
background-image: url('warning-light.svg');
85-
}
86-
87-
.vs .monaco-workbench .dialog-box .dialog-message-row .dialog-icon.icon-error {
88-
background-image: url('error-light.svg');
89-
}
90-
91-
.vs-dark .monaco-workbench .dialog-box .dialog-message-row .dialog-icon.icon-pending {
92-
background-image: url('pending-dark.svg');
93-
}
94-
95-
.vs-dark .monaco-workbench .dialog-box .dialog-message-row .dialog-icon.icon-info,
96-
.hc-black .monaco-workbench .dialog-box .dialog-message-row .dialog-icon.icon-info {
97-
background-image: url('info-dark.svg');
98-
}
99-
100-
.vs-dark .monaco-workbench .dialog-box .dialog-message-row .dialog-icon.icon-warning,
101-
.hc-black .monaco-workbench .dialog-box .dialog-message-row .dialog-icon.icon-warning {
102-
background-image: url('warning-dark.svg');
103-
}
104-
105-
.vs-dark .monaco-workbench .dialog-box .dialog-message-row .dialog-icon.icon-error,
106-
.hc-black .monaco-workbench .dialog-box .dialog-message-row .dialog-icon.icon-error {
107-
background-image: url('error-dark.svg');
108-
}
109-
110-
.hc-black .monaco-workbench .dialog-box .dialog-message-row .dialog-icon.icon-pending {
111-
background-image: url('pending-hc.svg');
112-
}
113-
114-
.monaco-workbench .dialog-box .dialog-message-row .dialog-icon.icon-pending {
115-
background-size: 30px;
61+
font-size: 48px;
11662
}
11763

11864
/** Dialog: Message Container */
@@ -136,6 +82,9 @@
13682
flex: 1; /* let the message always grow */
13783
white-space: normal;
13884
word-wrap: break-word; /* never overflow long words, but break to next line */
85+
min-height: 48px; /* matches icon height */
86+
display: flex;
87+
align-items: center;
13988
}
14089

14190
/** Dialog: Details */

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

Lines changed: 10 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@
66
import 'vs/css!./dialog';
77
import * as nls from 'vs/nls';
88
import { Disposable } from 'vs/base/common/lifecycle';
9-
import { $, hide, show, EventHelper, clearNode, removeClasses, addClass, removeNode, isAncestor, addDisposableListener, EventType } from 'vs/base/browser/dom';
9+
import { $, hide, show, EventHelper, clearNode, removeClasses, addClass, addClasses, removeNode, isAncestor, addDisposableListener, EventType } from 'vs/base/browser/dom';
1010
import { domEvent } from 'vs/base/browser/event';
1111
import { StandardKeyboardEvent } from 'vs/base/browser/keyboardEvent';
1212
import { KeyCode, KeyMod } from 'vs/base/common/keyCodes';
@@ -75,7 +75,8 @@ export class Dialog extends Disposable {
7575

7676
if (this.options.detail) {
7777
const messageElement = messageContainer.appendChild($('.dialog-message'));
78-
messageElement.innerText = this.message;
78+
const messageTextElement = messageElement.appendChild($('.dialog-message-text'));
79+
messageTextElement.innerText = this.message;
7980
}
8081

8182
this.messageDetailElement = messageContainer.appendChild($('.dialog-message-detail'));
@@ -199,29 +200,30 @@ export class Dialog extends Disposable {
199200
}
200201
}));
201202

202-
removeClasses(this.iconElement, 'icon-error', 'icon-warning', 'icon-info');
203+
addClass(this.iconElement, 'codicon');
204+
removeClasses(this.iconElement, 'codicon-alert', 'codicon-warning', 'codicon-info');
203205

204206
switch (this.options.type) {
205207
case 'error':
206-
addClass(this.iconElement, 'icon-error');
208+
addClass(this.iconElement, 'codicon-error');
207209
break;
208210
case 'warning':
209-
addClass(this.iconElement, 'icon-warning');
211+
addClass(this.iconElement, 'codicon-warning');
210212
break;
211213
case 'pending':
212-
addClass(this.iconElement, 'icon-pending');
214+
addClasses(this.iconElement, 'codicon-loading', 'codicon-animation-spin');
213215
break;
214216
case 'none':
215217
case 'info':
216218
case 'question':
217219
default:
218-
addClass(this.iconElement, 'icon-info');
220+
addClass(this.iconElement, 'codicon-info');
219221
break;
220222
}
221223

222224
const actionBar = new ActionBar(this.toolbarContainer, {});
223225

224-
const action = new Action('dialog.close', nls.localize('dialogClose', "Close Dialog"), 'dialog-close-action', true, () => {
226+
const action = new Action('dialog.close', nls.localize('dialogClose', "Close Dialog"), 'codicon codicon-close', true, () => {
225227
resolve({ button: this.options.cancelId || 0, checkboxChecked: this.checkbox ? this.checkbox.checked : undefined });
226228
return Promise.resolve();
227229
});

‎src/vs/base/browser/ui/dialog/error-dark.svg‎

Lines changed: 0 additions & 3 deletions
This file was deleted.

‎src/vs/base/browser/ui/dialog/error-light.svg‎

Lines changed: 0 additions & 3 deletions
This file was deleted.

‎src/vs/base/browser/ui/dialog/info-dark.svg‎

Lines changed: 0 additions & 3 deletions
This file was deleted.

‎src/vs/base/browser/ui/dialog/info-light.svg‎

Lines changed: 0 additions & 4 deletions
This file was deleted.

‎src/vs/base/browser/ui/dialog/pending-dark.svg‎

Lines changed: 0 additions & 31 deletions
This file was deleted.

‎src/vs/base/browser/ui/dialog/pending-hc.svg‎

Lines changed: 0 additions & 31 deletions
This file was deleted.

0 commit comments

Comments
 (0)