@omnia/runtime 8.0.20-vnext → 8.0.22-vnext

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -14,6 +14,8 @@
14
14
 
15
15
  .monaco-editor .bracket-match {
16
16
  box-sizing: border-box;
17
+ background-color: var(--vscode-editorBracketMatch-background);
18
+ border: 1px solid var(--vscode-editorBracketMatch-border);
17
19
  }
18
20
 
19
21
  /*---------------------------------------------------------------------------------------------
@@ -26,37 +28,56 @@
26
28
  display: inline-block;
27
29
  text-overflow: ellipsis;
28
30
  white-space: nowrap;
31
+ color: var(--vscode-editorCodeLens-foreground);
32
+ line-height: var(--vscode-editorCodeLens-lineHeight);
33
+ font-size: var(--vscode-editorCodeLens-fontSize);
34
+ padding-right: calc(var(--vscode-editorCodeLens-fontSize)*0.5);
35
+ font-feature-settings: var(--vscode-editorCodeLens-fontFeatureSettings);
36
+ font-family: var(--vscode-editorCodeLens-fontFamily), var(--vscode-editorCodeLens-fontFamilyDefault);
29
37
  }
30
38
 
31
- .monaco-editor .codelens-decoration > span,
32
- .monaco-editor .codelens-decoration > a {
39
+ .monaco-editor .codelens-decoration>span,
40
+ .monaco-editor .codelens-decoration>a {
33
41
  user-select: none;
34
42
  -webkit-user-select: none;
35
- -ms-user-select: none;
36
43
  white-space: nowrap;
37
44
  vertical-align: sub;
38
45
  }
39
46
 
40
- .monaco-editor .codelens-decoration > a {
47
+ .monaco-editor .codelens-decoration>a {
41
48
  text-decoration: none;
42
49
  }
43
50
 
44
- .monaco-editor .codelens-decoration > a:hover {
51
+ .monaco-editor .codelens-decoration>a:hover {
45
52
  cursor: pointer;
53
+ color: var(--vscode-editorLink-activeForeground) !important;
54
+ }
55
+
56
+ .monaco-editor .codelens-decoration>a:hover .codicon {
57
+ color: var(--vscode-editorLink-activeForeground) !important;
46
58
  }
47
59
 
48
60
  .monaco-editor .codelens-decoration .codicon {
49
61
  vertical-align: middle;
50
62
  color: currentColor !important;
63
+ color: var(--vscode-editorCodeLens-foreground);
64
+ line-height: var(--vscode-editorCodeLens-lineHeight);
65
+ font-size: var(--vscode-editorCodeLens-fontSize);
51
66
  }
52
67
 
53
- .monaco-editor .codelens-decoration > a:hover .codicon::before {
68
+ .monaco-editor .codelens-decoration>a:hover .codicon::before {
54
69
  cursor: pointer;
55
70
  }
56
71
 
57
72
  @keyframes fadein {
58
- 0% { opacity: 0; visibility: visible;}
59
- 100% { opacity: 1; }
73
+ 0% {
74
+ opacity: 0;
75
+ visibility: visible;
76
+ }
77
+
78
+ 100% {
79
+ opacity: 1;
80
+ }
60
81
  }
61
82
 
62
83
  .monaco-editor .codelens-decoration.fadein {
@@ -68,100 +89,158 @@
68
89
  * Licensed under the MIT License. See License.txt in the project root for license information.
69
90
  *--------------------------------------------------------------------------------------------*/
70
91
 
71
- .monaco-action-bar {
72
- white-space: nowrap;
92
+ .monaco-list {
93
+ position: relative;
73
94
  height: 100%;
95
+ width: 100%;
96
+ white-space: nowrap;
74
97
  }
75
98
 
76
- .monaco-action-bar .actions-container {
77
- display: flex;
78
- margin: 0 auto;
79
- padding: 0;
99
+ .monaco-list.mouse-support {
100
+ user-select: none;
101
+ -webkit-user-select: none;
102
+ }
103
+
104
+ .monaco-list > .monaco-scrollable-element {
80
105
  height: 100%;
106
+ }
107
+
108
+ .monaco-list-rows {
109
+ position: relative;
81
110
  width: 100%;
82
- align-items: center;
111
+ height: 100%;
83
112
  }
84
113
 
85
- .monaco-action-bar.vertical .actions-container {
86
- display: inline-block;
114
+ .monaco-list.horizontal-scrolling .monaco-list-rows {
115
+ width: auto;
116
+ min-width: 100%;
87
117
  }
88
118
 
89
- .monaco-action-bar .action-item {
90
- display: block;
91
- align-items: center;
92
- justify-content: center;
119
+ .monaco-list-row {
120
+ position: absolute;
121
+ box-sizing: border-box;
122
+ overflow: hidden;
123
+ width: 100%;
124
+ }
125
+
126
+ .monaco-list.mouse-support .monaco-list-row {
93
127
  cursor: pointer;
94
- position: relative; /* DO NOT REMOVE - this is the key to preventing the ghosting icon bug in Chrome 42 */
128
+ touch-action: none;
95
129
  }
96
130
 
97
- .monaco-action-bar .action-item.disabled {
98
- cursor: default;
131
+ /* for OS X ballistic scrolling */
132
+ .monaco-list-row.scrolling {
133
+ display: none !important;
99
134
  }
100
135
 
101
- .monaco-action-bar .action-item .icon,
102
- .monaco-action-bar .action-item .codicon {
103
- display: block;
136
+ /* Focus */
137
+ .monaco-list.element-focused,
138
+ .monaco-list.selection-single,
139
+ .monaco-list.selection-multiple {
140
+ outline: 0 !important;
104
141
  }
105
142
 
106
- .monaco-action-bar .action-item .codicon {
107
- display: flex;
108
- align-items: center;
109
- width: 16px;
110
- height: 16px;
143
+ /* Dnd */
144
+ .monaco-drag-image {
145
+ display: inline-block;
146
+ padding: 1px 7px;
147
+ border-radius: 10px;
148
+ font-size: 12px;
149
+ position: absolute;
150
+ z-index: 1000;
111
151
  }
112
152
 
113
- .monaco-action-bar .action-label {
114
- font-size: 11px;
115
- padding: 3px;
116
- border-radius: 5px;
153
+ /* Filter */
154
+
155
+ .monaco-list-type-filter-message {
156
+ position: absolute;
157
+ box-sizing: border-box;
158
+ width: 100%;
159
+ height: 100%;
160
+ top: 0;
161
+ left: 0;
162
+ padding: 40px 1em 1em 1em;
163
+ text-align: center;
164
+ white-space: normal;
165
+ opacity: 0.7;
166
+ pointer-events: none;
117
167
  }
118
168
 
119
- .monaco-action-bar .action-item.disabled .action-label,
120
- .monaco-action-bar .action-item.disabled .action-label::before,
121
- .monaco-action-bar .action-item.disabled .action-label:hover {
122
- opacity: 0.4;
169
+ .monaco-list-type-filter-message:empty {
170
+ display: none;
123
171
  }
124
172
 
125
- /* Vertical actions */
173
+ /*---------------------------------------------------------------------------------------------
174
+ * Copyright (c) Microsoft Corporation. All rights reserved.
175
+ * Licensed under the MIT License. See License.txt in the project root for license information.
176
+ *--------------------------------------------------------------------------------------------*/
126
177
 
127
- .monaco-action-bar.vertical {
128
- text-align: left;
178
+ /* Arrows */
179
+ .monaco-scrollable-element > .scrollbar > .scra {
180
+ cursor: pointer;
181
+ font-size: 11px !important;
129
182
  }
130
183
 
131
- .monaco-action-bar.vertical .action-item {
132
- display: block;
184
+ .monaco-scrollable-element > .visible {
185
+ opacity: 1;
186
+
187
+ /* Background rule added for IE9 - to allow clicks on dom node */
188
+ background:rgba(0,0,0,0);
189
+
190
+ transition: opacity 100ms linear;
191
+ /* In front of peek view */
192
+ z-index: 11;
193
+ }
194
+ .monaco-scrollable-element > .invisible {
195
+ opacity: 0;
196
+ pointer-events: none;
197
+ }
198
+ .monaco-scrollable-element > .invisible.fade {
199
+ transition: opacity 800ms linear;
133
200
  }
134
201
 
135
- .monaco-action-bar.vertical .action-label.separator {
202
+ /* Scrollable Content Inset Shadow */
203
+ .monaco-scrollable-element > .shadow {
204
+ position: absolute;
205
+ display: none;
206
+ }
207
+ .monaco-scrollable-element > .shadow.top {
136
208
  display: block;
137
- border-bottom: 1px solid #bbb;
138
- padding-top: 1px;
139
- margin-left: .8em;
140
- margin-right: .8em;
209
+ top: 0;
210
+ left: 3px;
211
+ height: 3px;
212
+ width: 100%;
213
+ box-shadow: var(--vscode-scrollbar-shadow) 0 6px 6px -6px inset;
141
214
  }
142
-
143
- .secondary-actions .monaco-action-bar .action-label {
144
- margin-left: 6px;
215
+ .monaco-scrollable-element > .shadow.left {
216
+ display: block;
217
+ top: 3px;
218
+ left: 0;
219
+ height: 100%;
220
+ width: 3px;
221
+ box-shadow: var(--vscode-scrollbar-shadow) 6px 0 6px -6px inset;
222
+ }
223
+ .monaco-scrollable-element > .shadow.top-left-corner {
224
+ display: block;
225
+ top: 0;
226
+ left: 0;
227
+ height: 3px;
228
+ width: 3px;
229
+ }
230
+ .monaco-scrollable-element > .shadow.top.left {
231
+ box-shadow: var(--vscode-scrollbar-shadow) 6px 0 6px -6px inset;
145
232
  }
146
233
 
147
- /* Action Items */
148
- .monaco-action-bar .action-item.select-container {
149
- overflow: hidden; /* somehow the dropdown overflows its container, we prevent it here to not push */
150
- flex: 1;
151
- max-width: 170px;
152
- min-width: 60px;
153
- display: flex;
154
- align-items: center;
155
- justify-content: center;
156
- margin-right: 10px;
234
+ .monaco-scrollable-element > .scrollbar > .slider {
235
+ background: var(--vscode-scrollbarSlider-background);
157
236
  }
158
237
 
159
- .monaco-action-bar .action-item.action-dropdown-item {
160
- display: flex;
238
+ .monaco-scrollable-element > .scrollbar > .slider:hover {
239
+ background: var(--vscode-scrollbarSlider-hoverBackground);
161
240
  }
162
241
 
163
- .monaco-action-bar .action-item.action-dropdown-item > .action-label {
164
- margin-right: 1px;
242
+ .monaco-scrollable-element > .scrollbar > .slider.active {
243
+ background: var(--vscode-scrollbarSlider-activeBackground);
165
244
  }
166
245
 
167
246
  /*---------------------------------------------------------------------------------------------
@@ -169,436 +248,534 @@
169
248
  * Licensed under the MIT License. See License.txt in the project root for license information.
170
249
  *--------------------------------------------------------------------------------------------*/
171
250
 
172
- .monaco-editor .snippet-placeholder {
173
- min-width: 2px;
174
- outline-style: solid;
175
- outline-width: 1px;
251
+ /* Use custom CSS vars to expose padding into parent select for padding calculation */
252
+ .monaco-select-box-dropdown-padding {
253
+ --dropdown-padding-top: 1px;
254
+ --dropdown-padding-bottom: 1px;
176
255
  }
177
256
 
178
- .monaco-editor .finish-snippet-placeholder {
179
- outline-style: solid;
180
- outline-width: 1px;
257
+ .hc-black .monaco-select-box-dropdown-padding,
258
+ .hc-light .monaco-select-box-dropdown-padding {
259
+ --dropdown-padding-top: 3px;
260
+ --dropdown-padding-bottom: 4px;
181
261
  }
182
262
 
183
- /*---------------------------------------------------------------------------------------------
184
- * Copyright (c) Microsoft Corporation. All rights reserved.
185
- * Licensed under the MIT License. See License.txt in the project root for license information.
186
- *--------------------------------------------------------------------------------------------*/
187
-
188
- /* Suggest widget*/
189
-
190
- .monaco-editor .suggest-widget {
191
- width: 430px;
192
- z-index: 40;
193
- display: flex;
194
- flex-direction: column;
263
+ .monaco-select-box-dropdown-container {
264
+ display: none;
265
+ box-sizing: border-box;
195
266
  }
196
267
 
197
- .monaco-editor .suggest-widget.message {
198
- flex-direction: row;
199
- align-items: center;
268
+ .monaco-select-box-dropdown-container > .select-box-details-pane > .select-box-description-markdown * {
269
+ margin: 0;
200
270
  }
201
271
 
202
- .monaco-editor .suggest-widget,
203
- .monaco-editor .suggest-details {
204
- flex: 0 1 auto;
205
- width: 100%;
206
- border-style: solid;
207
- border-width: 1px;
272
+ .monaco-select-box-dropdown-container > .select-box-details-pane > .select-box-description-markdown a:focus {
273
+ outline: 1px solid -webkit-focus-ring-color;
274
+ outline-offset: -1px;
208
275
  }
209
276
 
210
- .monaco-editor.hc-black .suggest-widget,
211
- .monaco-editor.hc-black .suggest-details {
212
- border-width: 2px;
277
+ .monaco-select-box-dropdown-container > .select-box-details-pane > .select-box-description-markdown code {
278
+ line-height: 15px; /** For some reason, this is needed, otherwise <code> will take up 20px height */
279
+ font-family: var(--monaco-monospace-font);
213
280
  }
214
281
 
215
- /* Styles for status bar part */
216
282
 
283
+ .monaco-select-box-dropdown-container.visible {
284
+ display: flex;
285
+ flex-direction: column;
286
+ text-align: left;
287
+ width: 1px;
288
+ overflow: hidden;
289
+ border-bottom-left-radius: 3px;
290
+ border-bottom-right-radius: 3px;
291
+ }
217
292
 
218
- .monaco-editor .suggest-widget .suggest-status-bar {
219
- box-sizing: border-box;
220
- display: none;
221
- flex-flow: row nowrap;
222
- justify-content: space-between;
293
+ .monaco-select-box-dropdown-container > .select-box-dropdown-list-container {
294
+ flex: 0 0 auto;
295
+ align-self: flex-start;
296
+ padding-top: var(--dropdown-padding-top);
297
+ padding-bottom: var(--dropdown-padding-bottom);
298
+ padding-left: 1px;
299
+ padding-right: 1px;
223
300
  width: 100%;
224
- font-size: 80%;
225
- padding: 0 4px 0 4px;
226
- border-top: 1px solid transparent;
227
301
  overflow: hidden;
302
+ box-sizing: border-box;
228
303
  }
229
304
 
230
- .monaco-editor .suggest-widget.with-status-bar .suggest-status-bar {
231
- display: flex;
305
+ .monaco-select-box-dropdown-container > .select-box-details-pane {
306
+ padding: 5px;
232
307
  }
233
308
 
234
- .monaco-editor .suggest-widget .suggest-status-bar .left {
235
- padding-right: 8px;
309
+ .hc-black .monaco-select-box-dropdown-container > .select-box-dropdown-list-container {
310
+ padding-top: var(--dropdown-padding-top);
311
+ padding-bottom: var(--dropdown-padding-bottom);
236
312
  }
237
313
 
238
- .monaco-editor .suggest-widget.with-status-bar .suggest-status-bar .action-label {
239
- opacity: 0.5;
240
- color: inherit;
314
+ .monaco-select-box-dropdown-container > .select-box-dropdown-list-container .monaco-list .monaco-list-row {
315
+ cursor: pointer;
241
316
  }
242
317
 
243
- .monaco-editor .suggest-widget.with-status-bar .suggest-status-bar .action-item:not(:last-of-type) .action-label {
244
- margin-right: 0;
318
+ .monaco-select-box-dropdown-container > .select-box-dropdown-list-container .monaco-list .monaco-list-row > .option-text {
319
+ text-overflow: ellipsis;
320
+ overflow: hidden;
321
+ padding-left: 3.5px;
322
+ white-space: nowrap;
323
+ float: left;
245
324
  }
246
325
 
247
- .monaco-editor .suggest-widget.with-status-bar .suggest-status-bar .action-item:not(:last-of-type) .action-label::after {
248
- content: ', ';
249
- margin-right: 0.3em;
326
+ .monaco-select-box-dropdown-container > .select-box-dropdown-list-container .monaco-list .monaco-list-row > .option-detail {
327
+ text-overflow: ellipsis;
328
+ overflow: hidden;
329
+ padding-left: 3.5px;
330
+ white-space: nowrap;
331
+ float: left;
332
+ opacity: 0.7;
250
333
  }
251
334
 
252
- .monaco-editor .suggest-widget.with-status-bar .monaco-list .monaco-list-row>.contents>.main>.right>.readMore,
253
- .monaco-editor .suggest-widget.with-status-bar .monaco-list .monaco-list-row.focused.string-label>.contents>.main>.right>.readMore {
254
- display: none;
335
+ .monaco-select-box-dropdown-container > .select-box-dropdown-list-container .monaco-list .monaco-list-row > .option-decorator-right {
336
+ text-overflow: ellipsis;
337
+ overflow: hidden;
338
+ padding-right: 10px;
339
+ white-space: nowrap;
340
+ float: right;
255
341
  }
256
342
 
257
- .monaco-editor .suggest-widget.with-status-bar:not(.docs-side) .monaco-list .monaco-list-row:hover>.contents>.main>.right.can-expand-details>.details-label {
258
- width: 100%;
259
- }
260
343
 
261
- /* Styles for Message element for when widget is loading or is empty */
344
+ /* Accepted CSS hiding technique for accessibility reader text */
345
+ /* https://webaim.org/techniques/css/invisiblecontent/ */
262
346
 
263
- .monaco-editor .suggest-widget>.message {
264
- padding-left: 22px;
347
+ .monaco-select-box-dropdown-container > .select-box-dropdown-list-container .monaco-list .monaco-list-row > .visually-hidden {
348
+ position: absolute;
349
+ left: -10000px;
350
+ top: auto;
351
+ width: 1px;
352
+ height: 1px;
353
+ overflow: hidden;
265
354
  }
266
355
 
267
- /** Styles for the list element **/
356
+ .monaco-select-box-dropdown-container > .select-box-dropdown-container-width-control {
357
+ flex: 1 1 auto;
358
+ align-self: flex-start;
359
+ opacity: 0;
360
+ }
268
361
 
269
- .monaco-editor .suggest-widget>.tree {
270
- height: 100%;
271
- width: 100%;
362
+ .monaco-select-box-dropdown-container > .select-box-dropdown-container-width-control > .width-control-div {
363
+ overflow: hidden;
364
+ max-height: 0px;
272
365
  }
273
366
 
274
- .monaco-editor .suggest-widget .monaco-list {
275
- user-select: none;
276
- -webkit-user-select: none;
277
- -ms-user-select: none;
367
+ .monaco-select-box-dropdown-container > .select-box-dropdown-container-width-control > .width-control-div > .option-text-width-control {
368
+ padding-left: 4px;
369
+ padding-right: 8px;
370
+ white-space: nowrap;
278
371
  }
279
372
 
280
- /** Styles for each row in the list element **/
373
+ /*---------------------------------------------------------------------------------------------
374
+ * Copyright (c) Microsoft Corporation. All rights reserved.
375
+ * Licensed under the MIT License. See License.txt in the project root for license information.
376
+ *--------------------------------------------------------------------------------------------*/
281
377
 
282
- .monaco-editor .suggest-widget .monaco-list .monaco-list-row {
283
- display: flex;
284
- -mox-box-sizing: border-box;
285
- box-sizing: border-box;
286
- padding-right: 10px;
287
- background-repeat: no-repeat;
288
- background-position: 2px 2px;
289
- white-space: nowrap;
378
+ .monaco-select-box {
379
+ width: 100%;
290
380
  cursor: pointer;
291
- touch-action: none;
381
+ border-radius: 2px;
292
382
  }
293
383
 
294
- .monaco-editor .suggest-widget .monaco-list .monaco-list-row>.contents {
295
- flex: 1;
296
- height: 100%;
297
- overflow: hidden;
298
- padding-left: 2px;
384
+ .monaco-select-box-dropdown-container {
385
+ font-size: 13px;
386
+ font-weight: normal;
387
+ text-transform: none;
299
388
  }
300
389
 
301
- .monaco-editor .suggest-widget .monaco-list .monaco-list-row>.contents>.main {
302
- display: flex;
303
- overflow: hidden;
304
- text-overflow: ellipsis;
305
- white-space: pre;
306
- justify-content: space-between;
390
+ /** Actions */
391
+
392
+ .monaco-action-bar .action-item.select-container {
393
+ cursor: default;
307
394
  }
308
395
 
309
- .monaco-editor .suggest-widget .monaco-list .monaco-list-row>.contents>.main>.left, .monaco-editor .suggest-widget .monaco-list .monaco-list-row>.contents>.main>.right {
310
- display: flex;
396
+ .monaco-action-bar .action-item .monaco-select-box {
397
+ cursor: pointer;
398
+ min-width: 100px;
399
+ min-height: 18px;
400
+ padding: 2px 23px 2px 8px;
311
401
  }
312
402
 
313
- .monaco-editor .suggest-widget:not(.frozen) .monaco-highlighted-label .highlight {
314
- font-weight: bold;
403
+ .mac .monaco-action-bar .action-item .monaco-select-box {
404
+ font-size: 11px;
405
+ border-radius: 5px;
315
406
  }
316
407
 
317
- /** ReadMore Icon styles **/
408
+ /*---------------------------------------------------------------------------------------------
409
+ * Copyright (c) Microsoft Corporation. All rights reserved.
410
+ * Licensed under the MIT License. See License.txt in the project root for license information.
411
+ *--------------------------------------------------------------------------------------------*/
318
412
 
319
- .monaco-editor .suggest-details>.monaco-scrollable-element>.body>.header>.codicon-close,
320
- .monaco-editor .suggest-widget .monaco-list .monaco-list-row>.contents>.main>.right>.readMore::before {
321
- color: inherit;
322
- opacity: 1;
323
- font-size: 14px;
324
- cursor: pointer;
413
+ .monaco-action-bar {
414
+ white-space: nowrap;
415
+ height: 100%;
325
416
  }
326
417
 
327
- .monaco-editor .suggest-details>.monaco-scrollable-element>.body>.header>.codicon-close {
328
- position: absolute;
329
- top: 6px;
330
- right: 2px;
418
+ .monaco-action-bar .actions-container {
419
+ display: flex;
420
+ margin: 0 auto;
421
+ padding: 0;
422
+ height: 100%;
423
+ width: 100%;
424
+ align-items: center;
331
425
  }
332
426
 
333
- .monaco-editor .suggest-details>.monaco-scrollable-element>.body>.header>.codicon-close:hover,
334
- .monaco-editor .suggest-widget .monaco-list .monaco-list-row>.contents>.main>.right>.readMore:hover {
335
- opacity: 1;
427
+ .monaco-action-bar.vertical .actions-container {
428
+ display: inline-block;
336
429
  }
337
430
 
338
- /** signature, qualifier, type/details opacity **/
339
-
340
- .monaco-editor .suggest-widget .monaco-list .monaco-list-row>.contents>.main>.left>.signature-label,
341
- .monaco-editor .suggest-widget .monaco-list .monaco-list-row>.contents>.main>.left>.qualifier-label,
342
- .monaco-editor .suggest-widget .monaco-list .monaco-list-row>.contents>.main>.right>.details-label {
343
- opacity: 0.7;
431
+ .monaco-action-bar .action-item {
432
+ display: block;
433
+ align-items: center;
434
+ justify-content: center;
435
+ cursor: pointer;
436
+ position: relative; /* DO NOT REMOVE - this is the key to preventing the ghosting icon bug in Chrome 42 */
344
437
  }
345
438
 
346
- .monaco-editor .suggest-widget .monaco-list .monaco-list-row>.contents>.main>.left>.signature-label {
347
- overflow: hidden;
348
- text-overflow: ellipsis;
439
+ .monaco-action-bar .action-item.disabled {
440
+ cursor: default;
349
441
  }
350
442
 
351
- .monaco-editor .suggest-widget .monaco-list .monaco-list-row>.contents>.main>.left>.qualifier-label {
352
- margin-left: 4px;
353
- opacity: 0.4;
354
- font-size: 90%;
355
- text-overflow: ellipsis;
356
- overflow: hidden;
357
- align-self: center;
443
+ .monaco-action-bar .action-item .icon,
444
+ .monaco-action-bar .action-item .codicon {
445
+ display: block;
358
446
  }
359
447
 
360
- /** Type Info and icon next to the label in the focused completion item **/
448
+ .monaco-action-bar .action-item .codicon {
449
+ display: flex;
450
+ align-items: center;
451
+ width: 16px;
452
+ height: 16px;
453
+ }
361
454
 
362
- .monaco-editor .suggest-widget .monaco-list .monaco-list-row>.contents>.main>.right>.details-label {
363
- margin-left: 1.1em;
364
- overflow: hidden;
365
- text-overflow: ellipsis;
366
- white-space: nowrap;
455
+ .monaco-action-bar .action-label {
456
+ display: flex;
457
+ font-size: 11px;
458
+ padding: 3px;
459
+ border-radius: 5px;
367
460
  }
368
461
 
369
- .monaco-editor .suggest-widget .monaco-list .monaco-list-row>.contents>.main>.right>.details-label>.monaco-tokenized-source {
370
- display: inline;
462
+ .monaco-action-bar .action-item.disabled .action-label,
463
+ .monaco-action-bar .action-item.disabled .action-label::before,
464
+ .monaco-action-bar .action-item.disabled .action-label:hover {
465
+ opacity: 0.6;
371
466
  }
372
467
 
373
- /** Details: if using CompletionItem#details, show on focus **/
468
+ /* Vertical actions */
374
469
 
375
- .monaco-editor .suggest-widget .monaco-list .monaco-list-row>.contents>.main>.right>.details-label {
376
- display: none;
470
+ .monaco-action-bar.vertical {
471
+ text-align: left;
377
472
  }
378
473
 
379
- .monaco-editor .suggest-widget:not(.shows-details) .monaco-list .monaco-list-row.focused>.contents>.main>.right>.details-label {
380
- display: inline;
474
+ .monaco-action-bar.vertical .action-item {
475
+ display: block;
381
476
  }
382
477
 
383
- /** Details: if using CompletionItemLabel#details, always show **/
384
-
385
- .monaco-editor .suggest-widget .monaco-list .monaco-list-row:not(.string-label)>.contents>.main>.right>.details-label,
386
- .monaco-editor .suggest-widget.docs-side .monaco-list .monaco-list-row.focused:not(.string-label)>.contents>.main>.right>.details-label {
387
- display: inline;
478
+ .monaco-action-bar.vertical .action-label.separator {
479
+ display: block;
480
+ border-bottom: 1px solid #bbb;
481
+ padding-top: 1px;
482
+ margin-left: .8em;
483
+ margin-right: .8em;
388
484
  }
389
485
 
390
- /** Ellipsis on hover **/
486
+ .monaco-action-bar .action-item .action-label.separator {
487
+ width: 1px;
488
+ height: 16px;
489
+ margin: 5px 4px !important;
490
+ cursor: default;
491
+ min-width: 1px;
492
+ padding: 0;
493
+ background-color: #bbb;
494
+ }
391
495
 
392
- .monaco-editor .suggest-widget:not(.docs-side) .monaco-list .monaco-list-row:hover>.contents>.main>.right.can-expand-details>.details-label {
393
- width: calc(100% - 26px);
496
+ .secondary-actions .monaco-action-bar .action-label {
497
+ margin-left: 6px;
394
498
  }
395
499
 
396
- .monaco-editor .suggest-widget .monaco-list .monaco-list-row>.contents>.main>.left {
397
- flex-shrink: 1;
398
- flex-grow: 1;
399
- overflow: hidden;
500
+ /* Action Items */
501
+ .monaco-action-bar .action-item.select-container {
502
+ overflow: hidden; /* somehow the dropdown overflows its container, we prevent it here to not push */
503
+ flex: 1;
504
+ max-width: 170px;
505
+ min-width: 60px;
506
+ display: flex;
507
+ align-items: center;
508
+ justify-content: center;
509
+ margin-right: 10px;
400
510
  }
401
511
 
402
- .monaco-editor .suggest-widget .monaco-list .monaco-list-row>.contents>.main>.left>.monaco-icon-label {
403
- flex-shrink: 0;
512
+ .monaco-action-bar .action-item.action-dropdown-item {
513
+ display: flex;
404
514
  }
405
515
 
406
- .monaco-editor .suggest-widget .monaco-list .monaco-list-row:not(.string-label)>.contents>.main>.left>.monaco-icon-label {
407
- max-width: 100%;
516
+ .monaco-action-bar .action-item.action-dropdown-item > .action-dropdown-item-separator {
517
+ display: flex;
518
+ align-items: center;
519
+ cursor: default;
408
520
  }
409
521
 
410
- .monaco-editor .suggest-widget .monaco-list .monaco-list-row.string-label>.contents>.main>.left>.monaco-icon-label {
411
- flex-shrink: 1;
522
+ .monaco-action-bar .action-item.action-dropdown-item > .action-dropdown-item-separator > div {
523
+ width: 1px;
412
524
  }
413
525
 
414
- .monaco-editor .suggest-widget .monaco-list .monaco-list-row>.contents>.main>.right {
526
+ /*---------------------------------------------------------------------------------------------
527
+ * Copyright (c) Microsoft Corporation. All rights reserved.
528
+ * Licensed under the MIT License. See License.txt in the project root for license information.
529
+ *--------------------------------------------------------------------------------------------*/
530
+
531
+ .monaco-custom-toggle {
532
+ margin-left: 2px;
533
+ float: left;
534
+ cursor: pointer;
415
535
  overflow: hidden;
416
- flex-shrink: 4;
417
- max-width: 70%;
536
+ width: 20px;
537
+ height: 20px;
538
+ border-radius: 3px;
539
+ border: 1px solid transparent;
540
+ padding: 1px;
541
+ box-sizing: border-box;
542
+ user-select: none;
543
+ -webkit-user-select: none;
418
544
  }
419
545
 
420
- .monaco-editor .suggest-widget .monaco-list .monaco-list-row>.contents>.main>.right>.readMore {
421
- display: inline-block;
422
- position: absolute;
423
- right: 10px;
424
- width: 18px;
425
- height: 18px;
426
- visibility: hidden;
546
+ .monaco-custom-toggle:hover {
547
+ background-color: var(--vscode-inputOption-hoverBackground);
427
548
  }
428
549
 
429
- /** Do NOT display ReadMore when docs is side/below **/
430
-
431
- .monaco-editor .suggest-widget.docs-side .monaco-list .monaco-list-row>.contents>.main>.right>.readMore, .monaco-editor .suggest-widget.docs-below .monaco-list .monaco-list-row>.contents>.main>.right>.readMore {
432
- display: none !important;
550
+ .hc-black .monaco-custom-toggle:hover,
551
+ .hc-light .monaco-custom-toggle:hover {
552
+ border: 1px dashed var(--vscode-focusBorder);
433
553
  }
434
554
 
435
- /** Do NOT display ReadMore when using plain CompletionItemLabel (details/documentation might not be resolved) **/
436
-
437
- .monaco-editor .suggest-widget .monaco-list .monaco-list-row.string-label>.contents>.main>.right>.readMore {
438
- display: none;
555
+ .hc-black .monaco-custom-toggle,
556
+ .hc-light .monaco-custom-toggle {
557
+ background: none;
439
558
  }
440
559
 
441
- /** Focused item can show ReadMore, but can't when docs is side/below **/
442
-
443
- .monaco-editor .suggest-widget .monaco-list .monaco-list-row.focused.string-label>.contents>.main>.right>.readMore {
444
- display: inline-block;
560
+ .hc-black .monaco-custom-toggle:hover,
561
+ .hc-light .monaco-custom-toggle:hover {
562
+ background: none;
445
563
  }
446
564
 
447
- .monaco-editor .suggest-widget.docs-side .monaco-list .monaco-list-row>.contents>.main>.right>.readMore,
448
- .monaco-editor .suggest-widget.docs-below .monaco-list .monaco-list-row>.contents>.main>.right>.readMore {
449
- display: none;
565
+ .monaco-custom-toggle.monaco-checkbox {
566
+ height: 18px;
567
+ width: 18px;
568
+ border: 1px solid transparent;
569
+ border-radius: 3px;
570
+ margin-right: 9px;
571
+ margin-left: 0px;
572
+ padding: 0px;
573
+ opacity: 1;
574
+ background-size: 16px !important;
450
575
  }
451
576
 
452
- .monaco-editor .suggest-widget .monaco-list .monaco-list-row:hover>.contents>.main>.right>.readMore {
453
- visibility: visible;
577
+ /* hide check when unchecked */
578
+ .monaco-custom-toggle.monaco-checkbox:not(.checked)::before {
579
+ visibility: hidden;
454
580
  }
455
581
 
456
- /** Styles for each row in the list **/
582
+ /*---------------------------------------------------------------------------------------------
583
+ * Copyright (c) Microsoft Corporation. All rights reserved.
584
+ * Licensed under the MIT License. See License.txt in the project root for license information.
585
+ *--------------------------------------------------------------------------------------------*/
457
586
 
458
- .monaco-editor .suggest-widget .monaco-list .monaco-list-row .monaco-icon-label.deprecated {
459
- opacity: 0.66;
460
- text-decoration: unset;
587
+ .monaco-inputbox {
588
+ position: relative;
589
+ display: block;
590
+ padding: 0;
591
+ box-sizing: border-box;
592
+ border-radius: 2px;
593
+
594
+ /* Customizable */
595
+ font-size: inherit;
461
596
  }
462
597
 
463
- .monaco-editor .suggest-widget .monaco-list .monaco-list-row .monaco-icon-label.deprecated>.monaco-icon-label-container>.monaco-icon-name-container {
464
- text-decoration: line-through;
598
+ .monaco-inputbox > .ibwrapper > .input,
599
+ .monaco-inputbox > .ibwrapper > .mirror {
600
+
601
+ /* Customizable */
602
+ padding: 4px 6px;
465
603
  }
466
604
 
467
- .monaco-editor .suggest-widget .monaco-list .monaco-list-row .monaco-icon-label::before {
605
+ .monaco-inputbox > .ibwrapper {
606
+ position: relative;
607
+ width: 100%;
468
608
  height: 100%;
469
609
  }
470
610
 
471
- .monaco-editor .suggest-widget .monaco-list .monaco-list-row .icon {
472
- display: block;
473
- height: 16px;
474
- width: 16px;
475
- margin-left: 2px;
476
- background-repeat: no-repeat;
477
- background-size: 80%;
478
- background-position: center;
611
+ .monaco-inputbox > .ibwrapper > .input {
612
+ display: inline-block;
613
+ box-sizing: border-box;
614
+ width: 100%;
615
+ height: 100%;
616
+ line-height: inherit;
617
+ border: none;
618
+ font-family: inherit;
619
+ font-size: inherit;
620
+ resize: none;
621
+ color: inherit;
479
622
  }
480
623
 
481
- .monaco-editor .suggest-widget .monaco-list .monaco-list-row .icon.hide {
482
- display: none;
624
+ .monaco-inputbox > .ibwrapper > input {
625
+ text-overflow: ellipsis;
483
626
  }
484
627
 
485
- .monaco-editor .suggest-widget .monaco-list .monaco-list-row .suggest-icon {
486
- display: flex;
487
- align-items: center;
488
- margin-right: 4px;
628
+ .monaco-inputbox > .ibwrapper > textarea.input {
629
+ display: block;
630
+ scrollbar-width: none; /* Firefox: hide scrollbars */
631
+ outline: none;
489
632
  }
490
633
 
491
- .monaco-editor .suggest-widget.no-icons .monaco-list .monaco-list-row .icon, .monaco-editor .suggest-widget.no-icons .monaco-list .monaco-list-row .suggest-icon::before {
492
- display: none;
634
+ .monaco-inputbox > .ibwrapper > textarea.input::-webkit-scrollbar {
635
+ display: none; /* Chrome + Safari: hide scrollbar */
493
636
  }
494
637
 
495
- .monaco-editor .suggest-widget .monaco-list .monaco-list-row .icon.customcolor .colorspan {
496
- margin: 0 0 0 0.3em;
497
- border: 0.1em solid #000;
498
- width: 0.7em;
499
- height: 0.7em;
500
- display: inline-block;
638
+ .monaco-inputbox > .ibwrapper > textarea.input.empty {
639
+ white-space: nowrap;
501
640
  }
502
641
 
503
- /** Styles for the docs of the completion item in focus **/
504
-
505
- .monaco-editor .suggest-details-container {
506
- z-index: 41;
642
+ .monaco-inputbox > .ibwrapper > .mirror {
643
+ position: absolute;
644
+ display: inline-block;
645
+ width: 100%;
646
+ top: 0;
647
+ left: 0;
648
+ box-sizing: border-box;
649
+ white-space: pre-wrap;
650
+ visibility: hidden;
651
+ word-wrap: break-word;
507
652
  }
508
653
 
509
- .monaco-editor .suggest-details {
510
- display: flex;
511
- flex-direction: column;
512
- cursor: default;
513
- }
654
+ /* Context view */
514
655
 
515
- .monaco-editor .suggest-details.no-docs {
516
- display: none;
656
+ .monaco-inputbox-container {
657
+ text-align: right;
517
658
  }
518
659
 
519
- .monaco-editor .suggest-details>.monaco-scrollable-element {
520
- flex: 1;
660
+ .monaco-inputbox-container .monaco-inputbox-message {
661
+ display: inline-block;
662
+ overflow: hidden;
663
+ text-align: left;
664
+ width: 100%;
665
+ box-sizing: border-box;
666
+ padding: 0.4em;
667
+ font-size: 12px;
668
+ line-height: 17px;
669
+ margin-top: -1px;
670
+ word-wrap: break-word;
521
671
  }
522
672
 
523
- .monaco-editor .suggest-details>.monaco-scrollable-element>.body {
524
- box-sizing: border-box;
525
- height: 100%;
526
- width: 100%;
673
+ /* Action bar support */
674
+ .monaco-inputbox .monaco-action-bar {
675
+ position: absolute;
676
+ right: 2px;
677
+ top: 4px;
527
678
  }
528
679
 
529
- .monaco-editor .suggest-details>.monaco-scrollable-element>.body>.header>.type {
530
- flex: 2;
531
- overflow: hidden;
532
- text-overflow: ellipsis;
533
- opacity: 0.7;
534
- white-space: pre;
535
- margin: 0 24px 0 0;
536
- padding: 4px 0 12px 5px;
680
+ .monaco-inputbox .monaco-action-bar .action-item {
681
+ margin-left: 2px;
537
682
  }
538
683
 
539
- .monaco-editor .suggest-details>.monaco-scrollable-element>.body>.header>.type.auto-wrap {
540
- white-space: normal;
541
- word-break: break-all;
684
+ .monaco-inputbox .monaco-action-bar .action-item .codicon {
685
+ background-repeat: no-repeat;
686
+ width: 16px;
687
+ height: 16px;
542
688
  }
543
689
 
690
+ /*---------------------------------------------------------------------------------------------
691
+ * Copyright (c) Microsoft Corporation. All rights reserved.
692
+ * Licensed under the MIT License. See License.txt in the project root for license information.
693
+ *--------------------------------------------------------------------------------------------*/
694
+ /* ---------- Find input ---------- */
544
695
 
545
- .monaco-editor .suggest-details>.monaco-scrollable-element>.body>.docs {
546
- margin: 0;
547
- padding: 4px 5px;
548
- white-space: pre-wrap;
696
+ .monaco-findInput {
697
+ position: relative;
549
698
  }
550
699
 
551
- .monaco-editor .suggest-details.no-type>.monaco-scrollable-element>.body>.docs {
552
- margin-right: 24px;
700
+ .monaco-findInput .monaco-inputbox {
701
+ font-size: 13px;
702
+ width: 100%;
553
703
  }
554
704
 
555
- .monaco-editor .suggest-details>.monaco-scrollable-element>.body>.docs.markdown-docs {
556
- padding: 0;
557
- white-space: initial;
558
- min-height: calc(1rem + 8px);
705
+ .monaco-findInput > .controls {
706
+ position: absolute;
707
+ top: 3px;
708
+ right: 2px;
559
709
  }
560
710
 
561
- .monaco-editor .suggest-details>.monaco-scrollable-element>.body>.docs.markdown-docs>div,
562
- .monaco-editor .suggest-details>.monaco-scrollable-element>.body>.docs.markdown-docs>span:not(:empty) {
563
- padding: 4px 5px;
711
+ .vs .monaco-findInput.disabled {
712
+ background-color: #E1E1E1;
564
713
  }
565
714
 
566
- .monaco-editor .suggest-details>.monaco-scrollable-element>.body>.docs.markdown-docs>div>p:first-child {
567
- margin-top: 0;
715
+ /* Theming */
716
+ .vs-dark .monaco-findInput.disabled {
717
+ background-color: #333;
568
718
  }
569
719
 
570
- .monaco-editor .suggest-details>.monaco-scrollable-element>.body>.docs.markdown-docs>div>p:last-child {
571
- margin-bottom: 0;
720
+ /* Highlighting */
721
+ .monaco-findInput.highlight-0 .controls,
722
+ .hc-light .monaco-findInput.highlight-0 .controls {
723
+ animation: monaco-findInput-highlight-0 100ms linear 0s;
572
724
  }
573
725
 
574
- .monaco-editor .suggest-details>.monaco-scrollable-element>.body>.docs .code {
575
- white-space: pre-wrap;
576
- word-wrap: break-word;
726
+ .monaco-findInput.highlight-1 .controls,
727
+ .hc-light .monaco-findInput.highlight-1 .controls {
728
+ animation: monaco-findInput-highlight-1 100ms linear 0s;
577
729
  }
578
730
 
579
- .monaco-editor .suggest-details>.monaco-scrollable-element>.body>.docs.markdown-docs .codicon {
580
- vertical-align: sub;
731
+ .hc-black .monaco-findInput.highlight-0 .controls,
732
+ .vs-dark .monaco-findInput.highlight-0 .controls {
733
+ animation: monaco-findInput-highlight-dark-0 100ms linear 0s;
581
734
  }
582
735
 
583
- .monaco-editor .suggest-details>.monaco-scrollable-element>.body>p:empty {
584
- display: none;
736
+ .hc-black .monaco-findInput.highlight-1 .controls,
737
+ .vs-dark .monaco-findInput.highlight-1 .controls {
738
+ animation: monaco-findInput-highlight-dark-1 100ms linear 0s;
585
739
  }
586
740
 
587
- .monaco-editor .suggest-details code {
588
- border-radius: 3px;
589
- padding: 0 0.4em;
741
+ @keyframes monaco-findInput-highlight-0 {
742
+ 0% { background: rgba(253, 255, 0, 0.8); }
743
+ 100% { background: transparent; }
744
+ }
745
+ @keyframes monaco-findInput-highlight-1 {
746
+ 0% { background: rgba(253, 255, 0, 0.8); }
747
+ /* Made intentionally different such that the CSS minifier does not collapse the two animations into a single one*/
748
+ 99% { background: transparent; }
590
749
  }
591
750
 
592
- .monaco-editor .suggest-details ul {
593
- padding-left: 20px;
751
+ @keyframes monaco-findInput-highlight-dark-0 {
752
+ 0% { background: rgba(255, 255, 255, 0.44); }
753
+ 100% { background: transparent; }
754
+ }
755
+ @keyframes monaco-findInput-highlight-dark-1 {
756
+ 0% { background: rgba(255, 255, 255, 0.44); }
757
+ /* Made intentionally different such that the CSS minifier does not collapse the two animations into a single one*/
758
+ 99% { background: transparent; }
594
759
  }
595
760
 
596
- .monaco-editor .suggest-details ol {
597
- padding-left: 20px;
761
+ /*---------------------------------------------------------------------------------------------
762
+ * Copyright (c) Microsoft Corporation. All rights reserved.
763
+ * Licensed under the MIT License. See License.txt in the project root for license information.
764
+ *--------------------------------------------------------------------------------------------*/
765
+
766
+ .monaco-editor .snippet-placeholder {
767
+ min-width: 2px;
768
+ outline-style: solid;
769
+ outline-width: 1px;
770
+ background-color: var(--vscode-editor-snippetTabstopHighlightBackground, transparent);
771
+ outline-color: var(--vscode-editor-snippetTabstopHighlightBorder, transparent);
598
772
  }
599
773
 
600
- .monaco-editor .suggest-details p code {
601
- font-family: var(--monaco-monospace-font);
774
+ .monaco-editor .finish-snippet-placeholder {
775
+ outline-style: solid;
776
+ outline-width: 1px;
777
+ background-color: var(--vscode-editor-snippetFinalTabstopHighlightBackground, transparent);
778
+ outline-color: var(--vscode-editor-snippetFinalTabstopHighlightBorder, transparent);
602
779
  }
603
780
 
604
781
  /*---------------------------------------------------------------------------------------------
@@ -608,6 +785,7 @@
608
785
 
609
786
  @font-face {
610
787
  font-family: "codicon";
788
+ font-display: block;
611
789
  src: url(/omnia/fonts/codicon_80a4c25b73c1f97077ed2ea63fb85cae.ttf) format("truetype");
612
790
  }
613
791
 
@@ -617,14 +795,14 @@
617
795
  text-decoration: none;
618
796
  text-rendering: auto;
619
797
  text-align: center;
798
+ text-transform: none;
620
799
  -webkit-font-smoothing: antialiased;
621
800
  -moz-osx-font-smoothing: grayscale;
622
801
  user-select: none;
623
802
  -webkit-user-select: none;
624
- -ms-user-select: none;
625
803
  }
626
804
 
627
- /* icon rules are dynamically created in codiconStyles */
805
+ /* icon rules are dynamically created by the platform theme service (see iconsStyleSheet.ts) */
628
806
 
629
807
  /*---------------------------------------------------------------------------------------------
630
808
  * Copyright (c) Microsoft Corporation. All rights reserved.
@@ -665,581 +843,461 @@
665
843
  * Licensed under the MIT License. See License.txt in the project root for license information.
666
844
  *--------------------------------------------------------------------------------------------*/
667
845
 
668
- .monaco-list {
669
- position: relative;
670
- height: 100%;
671
- width: 100%;
672
- white-space: nowrap;
673
- }
846
+ /* Suggest widget*/
674
847
 
675
- .monaco-list.mouse-support {
676
- user-select: none;
677
- -webkit-user-select: none;
678
- -ms-user-select: none;
848
+ .monaco-editor .suggest-widget {
849
+ width: 430px;
850
+ z-index: 40;
851
+ display: flex;
852
+ flex-direction: column;
679
853
  }
680
854
 
681
- .monaco-list > .monaco-scrollable-element {
682
- height: 100%;
855
+ .monaco-editor .suggest-widget.message {
856
+ flex-direction: row;
857
+ align-items: center;
683
858
  }
684
859
 
685
- .monaco-list-rows {
686
- position: relative;
860
+ .monaco-editor .suggest-widget,
861
+ .monaco-editor .suggest-details {
862
+ flex: 0 1 auto;
687
863
  width: 100%;
688
- height: 100%;
864
+ border-style: solid;
865
+ border-width: 1px;
866
+ border-color: var(--vscode-editorSuggestWidget-border);
867
+ background-color: var(--vscode-editorSuggestWidget-background);
689
868
  }
690
869
 
691
- .monaco-list.horizontal-scrolling .monaco-list-rows {
692
- width: auto;
693
- min-width: 100%;
870
+ .monaco-editor.hc-black .suggest-widget,
871
+ .monaco-editor.hc-black .suggest-details,
872
+ .monaco-editor.hc-light .suggest-widget,
873
+ .monaco-editor.hc-light .suggest-details {
874
+ border-width: 2px;
694
875
  }
695
876
 
696
- .monaco-list-row {
697
- position: absolute;
877
+ /* Styles for status bar part */
878
+
879
+
880
+ .monaco-editor .suggest-widget .suggest-status-bar {
698
881
  box-sizing: border-box;
699
- overflow: hidden;
882
+ display: none;
883
+ flex-flow: row nowrap;
884
+ justify-content: space-between;
700
885
  width: 100%;
886
+ font-size: 80%;
887
+ padding: 0 4px 0 4px;
888
+ border-top: 1px solid var(--vscode-editorSuggestWidget-border);
889
+ overflow: hidden;
701
890
  }
702
891
 
703
- .monaco-list.mouse-support .monaco-list-row {
704
- cursor: pointer;
705
- touch-action: none;
892
+ .monaco-editor .suggest-widget.with-status-bar .suggest-status-bar {
893
+ display: flex;
706
894
  }
707
895
 
708
- /* for OS X ballistic scrolling */
709
- .monaco-list-row.scrolling {
710
- display: none !important;
896
+ .monaco-editor .suggest-widget .suggest-status-bar .left {
897
+ padding-right: 8px;
711
898
  }
712
899
 
713
- /* Focus */
714
- .monaco-list.element-focused,
715
- .monaco-list.selection-single,
716
- .monaco-list.selection-multiple {
717
- outline: 0 !important;
900
+ .monaco-editor .suggest-widget.with-status-bar .suggest-status-bar .action-label {
901
+ color: var(--vscode-editorSuggestWidgetStatus-foreground);
718
902
  }
719
903
 
720
- .monaco-list:focus .monaco-list-row.selected .codicon {
721
- color: inherit;
904
+ .monaco-editor .suggest-widget.with-status-bar .suggest-status-bar .action-item:not(:last-of-type) .action-label {
905
+ margin-right: 0;
722
906
  }
723
907
 
724
- /* Dnd */
725
- .monaco-drag-image {
726
- display: inline-block;
727
- padding: 1px 7px;
728
- border-radius: 10px;
729
- font-size: 12px;
730
- position: absolute;
731
- z-index: 1000;
908
+ .monaco-editor .suggest-widget.with-status-bar .suggest-status-bar .action-item:not(:last-of-type) .action-label::after {
909
+ content: ', ';
910
+ margin-right: 0.3em;
732
911
  }
733
912
 
734
- /* Type filter */
735
-
736
- .monaco-list-type-filter {
737
- display: flex;
738
- align-items: center;
739
- position: absolute;
740
- border-radius: 2px;
741
- padding: 0px 3px;
742
- max-width: calc(100% - 10px);
743
- text-overflow: ellipsis;
744
- overflow: hidden;
745
- text-align: right;
746
- box-sizing: border-box;
747
- cursor: all-scroll;
748
- font-size: 13px;
749
- line-height: 18px;
750
- height: 20px;
751
- z-index: 1;
752
- top: 4px;
913
+ .monaco-editor .suggest-widget.with-status-bar .monaco-list .monaco-list-row>.contents>.main>.right>.readMore,
914
+ .monaco-editor .suggest-widget.with-status-bar .monaco-list .monaco-list-row.focused.string-label>.contents>.main>.right>.readMore {
915
+ display: none;
753
916
  }
754
917
 
755
- .monaco-list-type-filter.dragging {
756
- transition: top 0.2s, left 0.2s;
918
+ .monaco-editor .suggest-widget.with-status-bar:not(.docs-side) .monaco-list .monaco-list-row:hover>.contents>.main>.right.can-expand-details>.details-label {
919
+ width: 100%;
757
920
  }
758
921
 
759
- .monaco-list-type-filter.ne {
760
- right: 4px;
761
- }
922
+ /* Styles for Message element for when widget is loading or is empty */
762
923
 
763
- .monaco-list-type-filter.nw {
764
- left: 4px;
924
+ .monaco-editor .suggest-widget>.message {
925
+ padding-left: 22px;
765
926
  }
766
927
 
767
- .monaco-list-type-filter > .controls {
768
- display: flex;
769
- align-items: center;
770
- box-sizing: border-box;
771
- transition: width 0.2s;
772
- width: 0;
928
+ /** Styles for the list element **/
929
+
930
+ .monaco-editor .suggest-widget>.tree {
931
+ height: 100%;
932
+ width: 100%;
773
933
  }
774
934
 
775
- .monaco-list-type-filter.dragging > .controls,
776
- .monaco-list-type-filter:hover > .controls {
777
- width: 36px;
935
+ .monaco-editor .suggest-widget .monaco-list {
936
+ user-select: none;
937
+ -webkit-user-select: none;
778
938
  }
779
939
 
780
- .monaco-list-type-filter > .controls > * {
781
- border: none;
782
- box-sizing: border-box;
783
- -webkit-appearance: none;
784
- -moz-appearance: none;
785
- background: none;
786
- width: 16px;
787
- height: 16px;
788
- flex-shrink: 0;
789
- margin: 0;
790
- padding: 0;
940
+ /** Styles for each row in the list element **/
941
+
942
+ .monaco-editor .suggest-widget .monaco-list .monaco-list-row {
791
943
  display: flex;
792
- align-items: center;
793
- justify-content: center;
944
+ -mox-box-sizing: border-box;
945
+ box-sizing: border-box;
946
+ padding-right: 10px;
947
+ background-repeat: no-repeat;
948
+ background-position: 2px 2px;
949
+ white-space: nowrap;
794
950
  cursor: pointer;
951
+ touch-action: none;
795
952
  }
796
953
 
797
- .monaco-list-type-filter > .controls > .filter {
798
- margin-left: 4px;
954
+ .monaco-editor .suggest-widget .monaco-list .monaco-list-row.focused {
955
+ color: var(--vscode-editorSuggestWidget-selectedForeground);
799
956
  }
800
957
 
801
- .monaco-list-type-filter-message {
802
- position: absolute;
803
- box-sizing: border-box;
804
- width: 100%;
805
- height: 100%;
806
- top: 0;
807
- left: 0;
808
- padding: 40px 1em 1em 1em;
809
- text-align: center;
810
- white-space: normal;
811
- opacity: 0.7;
812
- pointer-events: none;
958
+ .monaco-editor .suggest-widget .monaco-list .monaco-list-row.focused .codicon {
959
+ color: var(--vscode-editorSuggestWidget-selectedIconForeground);
813
960
  }
814
961
 
815
- .monaco-list-type-filter-message:empty {
816
- display: none;
962
+ .monaco-editor .suggest-widget .monaco-list .monaco-list-row>.contents {
963
+ flex: 1;
964
+ height: 100%;
965
+ overflow: hidden;
966
+ padding-left: 2px;
817
967
  }
818
968
 
819
- /* Electron */
969
+ .monaco-editor .suggest-widget .monaco-list .monaco-list-row>.contents>.main {
970
+ display: flex;
971
+ overflow: hidden;
972
+ text-overflow: ellipsis;
973
+ white-space: pre;
974
+ justify-content: space-between;
975
+ }
820
976
 
821
- .monaco-list-type-filter {
822
- cursor: grab;
977
+ .monaco-editor .suggest-widget .monaco-list .monaco-list-row>.contents>.main>.left,
978
+ .monaco-editor .suggest-widget .monaco-list .monaco-list-row>.contents>.main>.right {
979
+ display: flex;
823
980
  }
824
981
 
825
- .monaco-list-type-filter.dragging {
826
- cursor: grabbing;
982
+ .monaco-editor .suggest-widget .monaco-list .monaco-list-row:not(.focused)>.contents>.main .monaco-icon-label {
983
+ color: var(--vscode-editorSuggestWidget-foreground);
827
984
  }
828
985
 
829
- /*---------------------------------------------------------------------------------------------
830
- * Copyright (c) Microsoft Corporation. All rights reserved.
831
- * Licensed under the MIT License. See License.txt in the project root for license information.
832
- *--------------------------------------------------------------------------------------------*/
986
+ .monaco-editor .suggest-widget:not(.frozen) .monaco-highlighted-label .highlight {
987
+ font-weight: bold;
988
+ }
833
989
 
834
- /* Arrows */
835
- .monaco-scrollable-element > .scrollbar > .scra {
836
- cursor: pointer;
837
- font-size: 11px !important;
990
+ .monaco-editor .suggest-widget .monaco-list .monaco-list-row>.contents>.main .monaco-highlighted-label .highlight {
991
+ color: var(--vscode-editorSuggestWidget-highlightForeground);
838
992
  }
839
993
 
840
- .monaco-scrollable-element > .visible {
841
- opacity: 1;
994
+ .monaco-editor .suggest-widget .monaco-list .monaco-list-row.focused>.contents>.main .monaco-highlighted-label .highlight {
995
+ color: var(--vscode-editorSuggestWidget-focusHighlightForeground);
996
+ }
842
997
 
843
- /* Background rule added for IE9 - to allow clicks on dom node */
844
- background:rgba(0,0,0,0);
998
+ /** ReadMore Icon styles **/
845
999
 
846
- transition: opacity 100ms linear;
847
- }
848
- .monaco-scrollable-element > .invisible {
849
- opacity: 0;
850
- pointer-events: none;
851
- }
852
- .monaco-scrollable-element > .invisible.fade {
853
- transition: opacity 800ms linear;
1000
+ .monaco-editor .suggest-details>.monaco-scrollable-element>.body>.header>.codicon-close,
1001
+ .monaco-editor .suggest-widget .monaco-list .monaco-list-row>.contents>.main>.right>.readMore::before {
1002
+ color: inherit;
1003
+ opacity: 1;
1004
+ font-size: 14px;
1005
+ cursor: pointer;
854
1006
  }
855
1007
 
856
- /* Scrollable Content Inset Shadow */
857
- .monaco-scrollable-element > .shadow {
1008
+ .monaco-editor .suggest-details>.monaco-scrollable-element>.body>.header>.codicon-close {
858
1009
  position: absolute;
859
- display: none;
860
- }
861
- .monaco-scrollable-element > .shadow.top {
862
- display: block;
863
- top: 0;
864
- left: 3px;
865
- height: 3px;
866
- width: 100%;
867
- box-shadow: #DDD 0 6px 6px -6px inset;
868
- }
869
- .monaco-scrollable-element > .shadow.left {
870
- display: block;
871
- top: 3px;
872
- left: 0;
873
- height: 100%;
874
- width: 3px;
875
- box-shadow: #DDD 6px 0 6px -6px inset;
876
- }
877
- .monaco-scrollable-element > .shadow.top-left-corner {
878
- display: block;
879
- top: 0;
880
- left: 0;
881
- height: 3px;
882
- width: 3px;
1010
+ top: 6px;
1011
+ right: 2px;
883
1012
  }
884
- .monaco-scrollable-element > .shadow.top.left {
885
- box-shadow: #DDD 6px 6px 6px -6px inset;
1013
+
1014
+ .monaco-editor .suggest-details>.monaco-scrollable-element>.body>.header>.codicon-close:hover,
1015
+ .monaco-editor .suggest-widget .monaco-list .monaco-list-row>.contents>.main>.right>.readMore:hover {
1016
+ opacity: 1;
886
1017
  }
887
1018
 
888
- /* ---------- Default Style ---------- */
1019
+ /** signature, qualifier, type/details opacity **/
889
1020
 
890
- .vs .monaco-scrollable-element > .scrollbar > .slider {
891
- background: rgba(100, 100, 100, .4);
892
- }
893
- .vs-dark .monaco-scrollable-element > .scrollbar > .slider {
894
- background: rgba(121, 121, 121, .4);
895
- }
896
- .hc-black .monaco-scrollable-element > .scrollbar > .slider {
897
- background: rgba(111, 195, 223, .6);
1021
+ .monaco-editor .suggest-widget .monaco-list .monaco-list-row>.contents>.main>.right>.details-label {
1022
+ opacity: 0.7;
898
1023
  }
899
1024
 
900
- .monaco-scrollable-element > .scrollbar > .slider:hover {
901
- background: rgba(100, 100, 100, .7);
1025
+ .monaco-editor .suggest-widget .monaco-list .monaco-list-row>.contents>.main>.left>.signature-label {
1026
+ overflow: hidden;
1027
+ text-overflow: ellipsis;
1028
+ opacity: 0.6;
902
1029
  }
903
- .hc-black .monaco-scrollable-element > .scrollbar > .slider:hover {
904
- background: rgba(111, 195, 223, .8);
1030
+
1031
+ .monaco-editor .suggest-widget .monaco-list .monaco-list-row>.contents>.main>.left>.qualifier-label {
1032
+ margin-left: 12px;
1033
+ opacity: 0.4;
1034
+ font-size: 85%;
1035
+ line-height: initial;
1036
+ text-overflow: ellipsis;
1037
+ overflow: hidden;
1038
+ align-self: center;
905
1039
  }
906
1040
 
907
- .monaco-scrollable-element > .scrollbar > .slider.active {
908
- background: rgba(0, 0, 0, .6);
1041
+ /** Type Info and icon next to the label in the focused completion item **/
1042
+
1043
+ .monaco-editor .suggest-widget .monaco-list .monaco-list-row>.contents>.main>.right>.details-label {
1044
+ font-size: 85%;
1045
+ margin-left: 1.1em;
1046
+ overflow: hidden;
1047
+ text-overflow: ellipsis;
1048
+ white-space: nowrap;
909
1049
  }
910
- .vs-dark .monaco-scrollable-element > .scrollbar > .slider.active {
911
- background: rgba(191, 191, 191, .4);
1050
+
1051
+ .monaco-editor .suggest-widget .monaco-list .monaco-list-row>.contents>.main>.right>.details-label>.monaco-tokenized-source {
1052
+ display: inline;
912
1053
  }
913
- .hc-black .monaco-scrollable-element > .scrollbar > .slider.active {
914
- background: rgba(111, 195, 223, 1);
1054
+
1055
+ /** Details: if using CompletionItem#details, show on focus **/
1056
+
1057
+ .monaco-editor .suggest-widget .monaco-list .monaco-list-row>.contents>.main>.right>.details-label {
1058
+ display: none;
915
1059
  }
916
1060
 
917
- .vs-dark .monaco-scrollable-element .shadow.top {
918
- box-shadow: none;
1061
+ .monaco-editor .suggest-widget:not(.shows-details) .monaco-list .monaco-list-row.focused>.contents>.main>.right>.details-label {
1062
+ display: inline;
919
1063
  }
920
1064
 
921
- .vs-dark .monaco-scrollable-element .shadow.left {
922
- box-shadow: #000 6px 0 6px -6px inset;
1065
+ /** Details: if using CompletionItemLabel#details, always show **/
1066
+
1067
+ .monaco-editor .suggest-widget .monaco-list .monaco-list-row:not(.string-label)>.contents>.main>.right>.details-label,
1068
+ .monaco-editor .suggest-widget.docs-side .monaco-list .monaco-list-row.focused:not(.string-label)>.contents>.main>.right>.details-label {
1069
+ display: inline;
923
1070
  }
924
1071
 
925
- .vs-dark .monaco-scrollable-element .shadow.top.left {
926
- box-shadow: #000 6px 6px 6px -6px inset;
1072
+ /** Ellipsis on hover **/
1073
+
1074
+ .monaco-editor .suggest-widget:not(.docs-side) .monaco-list .monaco-list-row.focused:hover>.contents>.main>.right.can-expand-details>.details-label {
1075
+ width: calc(100% - 26px);
927
1076
  }
928
1077
 
929
- .hc-black .monaco-scrollable-element .shadow.top {
930
- box-shadow: none;
1078
+ .monaco-editor .suggest-widget .monaco-list .monaco-list-row>.contents>.main>.left {
1079
+ flex-shrink: 1;
1080
+ flex-grow: 1;
1081
+ overflow: hidden;
931
1082
  }
932
1083
 
933
- .hc-black .monaco-scrollable-element .shadow.left {
934
- box-shadow: none;
1084
+ .monaco-editor .suggest-widget .monaco-list .monaco-list-row>.contents>.main>.left>.monaco-icon-label {
1085
+ flex-shrink: 0;
935
1086
  }
936
1087
 
937
- .hc-black .monaco-scrollable-element .shadow.top.left {
938
- box-shadow: none;
1088
+ .monaco-editor .suggest-widget .monaco-list .monaco-list-row:not(.string-label)>.contents>.main>.left>.monaco-icon-label {
1089
+ max-width: 100%;
939
1090
  }
940
1091
 
941
- /*---------------------------------------------------------------------------------------------
942
- * Copyright (c) Microsoft Corporation. All rights reserved.
943
- * Licensed under the MIT License. See License.txt in the project root for license information.
944
- *--------------------------------------------------------------------------------------------*/
1092
+ .monaco-editor .suggest-widget .monaco-list .monaco-list-row.string-label>.contents>.main>.left>.monaco-icon-label {
1093
+ flex-shrink: 1;
1094
+ }
945
1095
 
946
- :root {
947
- --sash-size: 4px;
1096
+ .monaco-editor .suggest-widget .monaco-list .monaco-list-row>.contents>.main>.right {
1097
+ overflow: hidden;
1098
+ flex-shrink: 4;
1099
+ max-width: 70%;
948
1100
  }
949
1101
 
950
- .monaco-sash {
1102
+ .monaco-editor .suggest-widget .monaco-list .monaco-list-row>.contents>.main>.right>.readMore {
1103
+ display: inline-block;
951
1104
  position: absolute;
952
- z-index: 35;
953
- touch-action: none;
1105
+ right: 10px;
1106
+ width: 18px;
1107
+ height: 18px;
1108
+ visibility: hidden;
954
1109
  }
955
1110
 
956
- .monaco-sash.disabled {
957
- pointer-events: none;
958
- }
1111
+ /** Do NOT display ReadMore when docs is side/below **/
959
1112
 
960
- .monaco-sash.mac.vertical {
961
- cursor: col-resize;
1113
+ .monaco-editor .suggest-widget.docs-side .monaco-list .monaco-list-row>.contents>.main>.right>.readMore {
1114
+ display: none !important;
962
1115
  }
963
1116
 
964
- .monaco-sash.vertical.minimum {
965
- cursor: e-resize;
966
- }
1117
+ /** Do NOT display ReadMore when using plain CompletionItemLabel (details/documentation might not be resolved) **/
967
1118
 
968
- .monaco-sash.vertical.maximum {
969
- cursor: w-resize;
1119
+ .monaco-editor .suggest-widget .monaco-list .monaco-list-row.string-label>.contents>.main>.right>.readMore {
1120
+ display: none;
970
1121
  }
971
1122
 
972
- .monaco-sash.mac.horizontal {
973
- cursor: row-resize;
1123
+ /** Focused item can show ReadMore, but can't when docs is side/below **/
1124
+
1125
+ .monaco-editor .suggest-widget .monaco-list .monaco-list-row.focused.string-label>.contents>.main>.right>.readMore {
1126
+ display: inline-block;
974
1127
  }
975
1128
 
976
- .monaco-sash.horizontal.minimum {
977
- cursor: s-resize;
1129
+ .monaco-editor .suggest-widget .monaco-list .monaco-list-row.focused:hover>.contents>.main>.right>.readMore {
1130
+ visibility: visible;
978
1131
  }
979
1132
 
980
- .monaco-sash.horizontal.maximum {
981
- cursor: n-resize;
1133
+ /** Styles for each row in the list **/
1134
+
1135
+ .monaco-editor .suggest-widget .monaco-list .monaco-list-row .monaco-icon-label.deprecated {
1136
+ opacity: 0.66;
1137
+ text-decoration: unset;
982
1138
  }
983
1139
 
984
- .monaco-sash.disabled {
985
- cursor: default !important;
986
- pointer-events: none !important;
1140
+ .monaco-editor .suggest-widget .monaco-list .monaco-list-row .monaco-icon-label.deprecated>.monaco-icon-label-container>.monaco-icon-name-container {
1141
+ text-decoration: line-through;
987
1142
  }
988
1143
 
989
- .monaco-sash.vertical {
990
- cursor: ew-resize;
991
- top: 0;
992
- width: var(--sash-size);
1144
+ .monaco-editor .suggest-widget .monaco-list .monaco-list-row .monaco-icon-label::before {
993
1145
  height: 100%;
994
1146
  }
995
1147
 
996
- .monaco-sash.horizontal {
997
- cursor: ns-resize;
998
- left: 0;
999
- width: 100%;
1000
- height: var(--sash-size);
1148
+ .monaco-editor .suggest-widget .monaco-list .monaco-list-row .icon {
1149
+ display: block;
1150
+ height: 16px;
1151
+ width: 16px;
1152
+ margin-left: 2px;
1153
+ background-repeat: no-repeat;
1154
+ background-size: 80%;
1155
+ background-position: center;
1001
1156
  }
1002
1157
 
1003
- .monaco-sash:not(.disabled) > .orthogonal-drag-handle {
1004
- content: " ";
1005
- height: calc(var(--sash-size) * 2);
1006
- width: calc(var(--sash-size) * 2);
1007
- z-index: 100;
1008
- display: block;
1009
- cursor: all-scroll;
1010
- position: absolute;
1011
- }
1012
-
1013
- .monaco-sash.horizontal.orthogonal-edge-north:not(.disabled)
1014
- > .orthogonal-drag-handle.start,
1015
- .monaco-sash.horizontal.orthogonal-edge-south:not(.disabled)
1016
- > .orthogonal-drag-handle.end {
1017
- cursor: nwse-resize;
1158
+ .monaco-editor .suggest-widget .monaco-list .monaco-list-row .icon.hide {
1159
+ display: none;
1018
1160
  }
1019
1161
 
1020
- .monaco-sash.horizontal.orthogonal-edge-north:not(.disabled)
1021
- > .orthogonal-drag-handle.end,
1022
- .monaco-sash.horizontal.orthogonal-edge-south:not(.disabled)
1023
- > .orthogonal-drag-handle.start {
1024
- cursor: nesw-resize;
1162
+ .monaco-editor .suggest-widget .monaco-list .monaco-list-row .suggest-icon {
1163
+ display: flex;
1164
+ align-items: center;
1165
+ margin-right: 4px;
1025
1166
  }
1026
1167
 
1027
- .monaco-sash.vertical > .orthogonal-drag-handle.start {
1028
- left: calc(var(--sash-size) * -0.5);
1029
- top: calc(var(--sash-size) * -1);
1030
- }
1031
- .monaco-sash.vertical > .orthogonal-drag-handle.end {
1032
- left: calc(var(--sash-size) * -0.5);
1033
- bottom: calc(var(--sash-size) * -1);
1034
- }
1035
- .monaco-sash.horizontal > .orthogonal-drag-handle.start {
1036
- top: calc(var(--sash-size) * -0.5);
1037
- left: calc(var(--sash-size) * -1);
1038
- }
1039
- .monaco-sash.horizontal > .orthogonal-drag-handle.end {
1040
- top: calc(var(--sash-size) * -0.5);
1041
- right: calc(var(--sash-size) * -1);
1168
+ .monaco-editor .suggest-widget.no-icons .monaco-list .monaco-list-row .icon,
1169
+ .monaco-editor .suggest-widget.no-icons .monaco-list .monaco-list-row .suggest-icon::before {
1170
+ display: none;
1042
1171
  }
1043
1172
 
1044
- .monaco-sash:before {
1045
- content: '';
1046
- pointer-events: none;
1047
- position: absolute;
1048
- width: 100%;
1049
- height: 100%;
1050
- transition: background-color 0.1s ease-out;
1051
- background: transparent;
1173
+ .monaco-editor .suggest-widget .monaco-list .monaco-list-row .icon.customcolor .colorspan {
1174
+ margin: 0 0 0 0.3em;
1175
+ border: 0.1em solid #000;
1176
+ width: 0.7em;
1177
+ height: 0.7em;
1178
+ display: inline-block;
1052
1179
  }
1053
1180
 
1054
- .monaco-sash.vertical:before {
1055
- width: var(--sash-hover-size);
1056
- left: calc(50% - (var(--sash-hover-size) / 2));
1057
- }
1181
+ /** Styles for the docs of the completion item in focus **/
1058
1182
 
1059
- .monaco-sash.horizontal:before {
1060
- height: var(--sash-hover-size);
1061
- top: calc(50% - (var(--sash-hover-size) / 2));
1183
+ .monaco-editor .suggest-details-container {
1184
+ z-index: 41;
1062
1185
  }
1063
1186
 
1064
- /** Debug **/
1065
-
1066
- .monaco-sash.debug {
1067
- background: cyan;
1187
+ .monaco-editor .suggest-details {
1188
+ display: flex;
1189
+ flex-direction: column;
1190
+ cursor: default;
1191
+ color: var(--vscode-editorSuggestWidget-foreground);
1068
1192
  }
1069
1193
 
1070
- .monaco-sash.debug.disabled {
1071
- background: rgba(0, 255, 255, 0.2);
1194
+ .monaco-editor .suggest-details.focused {
1195
+ border-color: var(--vscode-focusBorder);
1072
1196
  }
1073
1197
 
1074
- .monaco-sash.debug:not(.disabled) > .orthogonal-drag-handle {
1075
- background: red;
1198
+ .monaco-editor .suggest-details a {
1199
+ color: var(--vscode-textLink-foreground);
1076
1200
  }
1077
1201
 
1078
- /*---------------------------------------------------------------------------------------------
1079
- * Copyright (c) Microsoft Corporation. All rights reserved.
1080
- * Licensed under the MIT License. See License.txt in the project root for license information.
1081
- *--------------------------------------------------------------------------------------------*/
1082
-
1083
- .monaco-action-bar .action-item.menu-entry .action-label.icon {
1084
- width: 16px;
1085
- height: 16px;
1086
- background-repeat: no-repeat;
1087
- background-position: 50%;
1088
- background-size: 16px;
1202
+ .monaco-editor .suggest-details a:hover {
1203
+ color: var(--vscode-textLink-activeForeground);
1089
1204
  }
1090
1205
 
1091
- .monaco-action-bar .action-item.menu-entry .action-label {
1092
- background-image: var(--menu-entry-icon-light);
1206
+ .monaco-editor .suggest-details code {
1207
+ background-color: var(--vscode-textCodeBlock-background);
1093
1208
  }
1094
1209
 
1095
- .vs-dark .monaco-action-bar .action-item.menu-entry .action-label,
1096
- .hc-black .monaco-action-bar .action-item.menu-entry .action-label {
1097
- background-image: var(--menu-entry-icon-dark);
1210
+ .monaco-editor .suggest-details.no-docs {
1211
+ display: none;
1098
1212
  }
1099
1213
 
1100
- /*---------------------------------------------------------------------------------------------
1101
- * Copyright (c) Microsoft Corporation. All rights reserved.
1102
- * Licensed under the MIT License. See License.txt in the project root for license information.
1103
- *--------------------------------------------------------------------------------------------*/
1104
-
1105
- .monaco-dropdown {
1106
- height: 100%;
1107
- padding: 0;
1214
+ .monaco-editor .suggest-details>.monaco-scrollable-element {
1215
+ flex: 1;
1108
1216
  }
1109
1217
 
1110
- .monaco-dropdown > .dropdown-label {
1111
- cursor: pointer;
1218
+ .monaco-editor .suggest-details>.monaco-scrollable-element>.body {
1219
+ box-sizing: border-box;
1112
1220
  height: 100%;
1113
- display: flex;
1114
- align-items: center;
1115
- justify-content: center;
1116
- }
1117
-
1118
- .monaco-dropdown > .dropdown-label > .action-label.disabled {
1119
- cursor: default;
1120
- }
1121
-
1122
- .monaco-dropdown-with-primary {
1123
- display: flex !important;
1124
- flex-direction: row;
1125
- border-radius: 5px;
1126
- }
1127
-
1128
- .monaco-dropdown-with-primary > .action-container > .action-label {
1129
- margin-right: 0;
1130
- }
1131
-
1132
- .monaco-dropdown-with-primary > .dropdown-action-container > .monaco-dropdown > .dropdown-label .codicon[class*='codicon-'] {
1133
- font-size: 12px;
1134
- padding-left: 0px;
1135
- padding-right: 0px;
1136
- line-height: 16px;
1137
- margin-left: -4px;
1221
+ width: 100%;
1138
1222
  }
1139
1223
 
1140
- /*---------------------------------------------------------------------------------------------
1141
- * Copyright (c) Microsoft Corporation. All rights reserved.
1142
- * Licensed under the MIT License. See License.txt in the project root for license information.
1143
- *--------------------------------------------------------------------------------------------*/
1144
-
1145
- /* ---------- Icon label ---------- */
1146
-
1147
- .monaco-icon-label {
1148
- display: flex; /* required for icons support :before rule */
1224
+ .monaco-editor .suggest-details>.monaco-scrollable-element>.body>.header>.type {
1225
+ flex: 2;
1149
1226
  overflow: hidden;
1150
1227
  text-overflow: ellipsis;
1228
+ opacity: 0.7;
1229
+ white-space: pre;
1230
+ margin: 0 24px 0 0;
1231
+ padding: 4px 0 12px 5px;
1151
1232
  }
1152
1233
 
1153
- .monaco-icon-label::before {
1154
-
1155
- /* svg icons rendered as background image */
1156
- background-size: 16px;
1157
- background-position: left center;
1158
- background-repeat: no-repeat;
1159
- padding-right: 6px;
1160
- width: 16px;
1161
- height: 22px;
1162
- line-height: inherit !important;
1163
- display: inline-block;
1164
-
1165
- /* fonts icons */
1166
- -webkit-font-smoothing: antialiased;
1167
- -moz-osx-font-smoothing: grayscale;
1168
- vertical-align: top;
1234
+ .monaco-editor .suggest-details>.monaco-scrollable-element>.body>.header>.type.auto-wrap {
1235
+ white-space: normal;
1236
+ word-break: break-all;
1237
+ }
1169
1238
 
1170
- flex-shrink: 0; /* fix for https://github.com/microsoft/vscode/issues/13787 */
1239
+ .monaco-editor .suggest-details>.monaco-scrollable-element>.body>.docs {
1240
+ margin: 0;
1241
+ padding: 4px 5px;
1242
+ white-space: pre-wrap;
1171
1243
  }
1172
1244
 
1173
- .monaco-icon-label > .monaco-icon-label-container {
1174
- min-width: 0;
1245
+ .monaco-editor .suggest-details.no-type>.monaco-scrollable-element>.body>.docs {
1246
+ margin-right: 24px;
1175
1247
  overflow: hidden;
1176
- text-overflow: ellipsis;
1177
- flex: 1;
1178
1248
  }
1179
1249
 
1180
- .monaco-icon-label > .monaco-icon-label-container > .monaco-icon-name-container > .label-name {
1181
- color: inherit;
1182
- white-space: pre; /* enable to show labels that include multiple whitespaces */
1250
+ .monaco-editor .suggest-details>.monaco-scrollable-element>.body>.docs.markdown-docs {
1251
+ padding: 0;
1252
+ white-space: initial;
1253
+ min-height: calc(1rem + 8px);
1183
1254
  }
1184
1255
 
1185
- .monaco-icon-label > .monaco-icon-label-container > .monaco-icon-name-container > .label-name > .label-separator {
1186
- margin: 0 2px;
1187
- opacity: 0.5;
1256
+ .monaco-editor .suggest-details>.monaco-scrollable-element>.body>.docs.markdown-docs>div,
1257
+ .monaco-editor .suggest-details>.monaco-scrollable-element>.body>.docs.markdown-docs>span:not(:empty) {
1258
+ padding: 4px 5px;
1188
1259
  }
1189
1260
 
1190
- .monaco-icon-label > .monaco-icon-label-container > .monaco-icon-description-container > .label-description {
1191
- opacity: .7;
1192
- margin-left: 0.5em;
1193
- font-size: 0.9em;
1194
- white-space: pre; /* enable to show labels that include multiple whitespaces */
1261
+ .monaco-editor .suggest-details>.monaco-scrollable-element>.body>.docs.markdown-docs>div>p:first-child {
1262
+ margin-top: 0;
1195
1263
  }
1196
1264
 
1197
- .monaco-icon-label.nowrap > .monaco-icon-label-container > .monaco-icon-description-container > .label-description{
1198
- white-space: nowrap
1265
+ .monaco-editor .suggest-details>.monaco-scrollable-element>.body>.docs.markdown-docs>div>p:last-child {
1266
+ margin-bottom: 0;
1199
1267
  }
1200
1268
 
1201
- .vs .monaco-icon-label > .monaco-icon-label-container > .monaco-icon-description-container > .label-description {
1202
- opacity: .95;
1269
+ .monaco-editor .suggest-details>.monaco-scrollable-element>.body>.docs.markdown-docs .monaco-tokenized-source {
1270
+ white-space: pre;
1203
1271
  }
1204
1272
 
1205
- .monaco-icon-label.italic > .monaco-icon-label-container > .monaco-icon-name-container > .label-name,
1206
- .monaco-icon-label.italic > .monaco-icon-label-container > .monaco-icon-description-container > .label-description {
1207
- font-style: italic;
1273
+ .monaco-editor .suggest-details>.monaco-scrollable-element>.body>.docs .code {
1274
+ white-space: pre-wrap;
1275
+ word-wrap: break-word;
1208
1276
  }
1209
1277
 
1210
- .monaco-icon-label.deprecated {
1211
- text-decoration: line-through;
1212
- opacity: 0.66;
1278
+ .monaco-editor .suggest-details>.monaco-scrollable-element>.body>.docs.markdown-docs .codicon {
1279
+ vertical-align: sub;
1213
1280
  }
1214
1281
 
1215
- /* make sure apply italic font style to decorations as well */
1216
- .monaco-icon-label.italic::after {
1217
- font-style: italic;
1282
+ .monaco-editor .suggest-details>.monaco-scrollable-element>.body>p:empty {
1283
+ display: none;
1218
1284
  }
1219
1285
 
1220
- .monaco-icon-label.strikethrough > .monaco-icon-label-container > .monaco-icon-name-container > .label-name,
1221
- .monaco-icon-label.strikethrough > .monaco-icon-label-container > .monaco-icon-description-container > .label-description {
1222
- text-decoration: line-through;
1286
+ .monaco-editor .suggest-details code {
1287
+ border-radius: 3px;
1288
+ padding: 0 0.4em;
1223
1289
  }
1224
1290
 
1225
- .monaco-icon-label::after {
1226
- opacity: 0.75;
1227
- font-size: 90%;
1228
- font-weight: 600;
1229
- padding: 0 16px 0 5px;
1230
- text-align: center;
1291
+ .monaco-editor .suggest-details ul {
1292
+ padding-left: 20px;
1231
1293
  }
1232
1294
 
1233
- /* make sure selection color wins when a label is being selected */
1234
- .monaco-list:focus .selected .monaco-icon-label, /* list */
1235
- .monaco-list:focus .selected .monaco-icon-label::after
1236
- {
1237
- color: inherit !important;
1295
+ .monaco-editor .suggest-details ol {
1296
+ padding-left: 20px;
1238
1297
  }
1239
1298
 
1240
- .monaco-list-row.focused.selected .label-description,
1241
- .monaco-list-row.selected .label-description {
1242
- opacity: .8;
1299
+ .monaco-editor .suggest-details p code {
1300
+ font-family: var(--monaco-monospace-font);
1243
1301
  }
1244
1302
 
1245
1303
  /*---------------------------------------------------------------------------------------------
@@ -1265,6 +1323,27 @@
1265
1323
  position: relative;
1266
1324
  overflow: visible;
1267
1325
  -webkit-text-size-adjust: 100%;
1326
+ color: var(--vscode-editor-foreground);
1327
+ background-color: var(--vscode-editor-background);
1328
+ }
1329
+ .monaco-editor-background {
1330
+ background-color: var(--vscode-editor-background);
1331
+ }
1332
+ .monaco-editor .rangeHighlight {
1333
+ background-color: var(--vscode-editor-rangeHighlightBackground);
1334
+ box-sizing: border-box;
1335
+ border: 1px solid var(--vscode-editor-rangeHighlightBorder);
1336
+ }
1337
+ .monaco-editor.hc-black .rangeHighlight, .monaco-editor.hc-light .rangeHighlight {
1338
+ border-style: dotted;
1339
+ }
1340
+ .monaco-editor .symbolHighlight {
1341
+ background-color: var(--vscode-editor-symbolHighlightBackground);
1342
+ box-sizing: border-box;
1343
+ border: 1px solid var(--vscode-editor-symbolHighlightBorder);
1344
+ }
1345
+ .monaco-editor.hc-black .symbolHighlight, .monaco-editor.hc-light .symbolHighlight {
1346
+ border-style: dotted;
1268
1347
  }
1269
1348
 
1270
1349
  /* -------------------- Misc -------------------- */
@@ -1285,26 +1364,69 @@
1285
1364
  }
1286
1365
  */
1287
1366
 
1288
- /*---------------------------------------------------------------------------------------------
1289
- * Copyright (c) Microsoft Corporation. All rights reserved.
1290
- * Licensed under the MIT License. See License.txt in the project root for license information.
1291
- *--------------------------------------------------------------------------------------------*/
1292
1367
 
1293
- .monaco-editor .inputarea {
1294
- min-width: 0;
1295
- min-height: 0;
1296
- margin: 0;
1297
- padding: 0;
1298
- position: absolute;
1299
- outline: none !important;
1300
- resize: none;
1301
- border: none;
1302
- overflow: hidden;
1303
- color: transparent;
1304
- background-color: transparent;
1368
+ .monaco-editor .squiggly-error {
1369
+ border-bottom: 4px double var(--vscode-editorError-border);
1305
1370
  }
1306
- /*.monaco-editor .inputarea {
1307
- position: fixed !important;
1371
+ .monaco-editor .squiggly-error::before {
1372
+ display: block;
1373
+ content: '';
1374
+ width: 100%;
1375
+ height: 100%;
1376
+ background: var(--vscode-editorError-background);
1377
+ }
1378
+ .monaco-editor .squiggly-warning {
1379
+ border-bottom: 4px double var(--vscode-editorWarning-border);
1380
+ }
1381
+ .monaco-editor .squiggly-warning::before {
1382
+ display: block;
1383
+ content: '';
1384
+ width: 100%;
1385
+ height: 100%;
1386
+ background: var(--vscode-editorWarning-background);
1387
+ }
1388
+ .monaco-editor .squiggly-info {
1389
+ border-bottom: 4px double var(--vscode-editorInfo-border);
1390
+ }
1391
+ .monaco-editor .squiggly-info::before {
1392
+ display: block;
1393
+ content: '';
1394
+ width: 100%;
1395
+ height: 100%;
1396
+ background: var(--vscode-editorInfo-background);
1397
+ }
1398
+ .monaco-editor .squiggly-hint {
1399
+ border-bottom: 2px dotted var(--vscode-editorHint-border);
1400
+ }
1401
+ .monaco-editor.showUnused .squiggly-unnecessary {
1402
+ border-bottom: 2px dashed var(--vscode-editorUnnecessaryCode-border);
1403
+ }
1404
+ .monaco-editor.showDeprecated .squiggly-inline-deprecated {
1405
+ text-decoration: line-through;
1406
+ text-decoration-color: var(--vscode-editor-foreground, inherit);
1407
+ }
1408
+
1409
+ /*---------------------------------------------------------------------------------------------
1410
+ * Copyright (c) Microsoft Corporation. All rights reserved.
1411
+ * Licensed under the MIT License. See License.txt in the project root for license information.
1412
+ *--------------------------------------------------------------------------------------------*/
1413
+
1414
+ .monaco-editor .inputarea {
1415
+ min-width: 0;
1416
+ min-height: 0;
1417
+ margin: 0;
1418
+ padding: 0;
1419
+ position: absolute;
1420
+ outline: none !important;
1421
+ resize: none;
1422
+ border: none;
1423
+ overflow: hidden;
1424
+ color: transparent;
1425
+ background-color: transparent;
1426
+ z-index: -10;
1427
+ }
1428
+ /*.monaco-editor .inputarea {
1429
+ position: fixed !important;
1308
1430
  width: 800px !important;
1309
1431
  height: 500px !important;
1310
1432
  top: initial !important;
@@ -1315,9 +1437,12 @@
1315
1437
  background: white !important;
1316
1438
  line-height: 15px !important;
1317
1439
  font-size: 14px !important;
1440
+ z-index: 10 !important;
1318
1441
  }*/
1319
1442
  .monaco-editor .inputarea.ime-input {
1320
1443
  z-index: 10;
1444
+ caret-color: var(--vscode-editorCursor-foreground);
1445
+ color: var(--vscode-editor-foreground);
1321
1446
  }
1322
1447
 
1323
1448
  /*---------------------------------------------------------------------------------------------
@@ -1346,19 +1471,30 @@
1346
1471
  margin-top: 1px;
1347
1472
  }
1348
1473
 
1474
+ .monaco-editor .line-numbers {
1475
+ color: var(--vscode-editorLineNumber-foreground);
1476
+ }
1477
+
1478
+ .monaco-editor .line-numbers.active-line-number {
1479
+ color: var(--vscode-editorLineNumber-activeForeground);
1480
+ }
1481
+
1349
1482
  /*---------------------------------------------------------------------------------------------
1350
1483
  * Copyright (c) Microsoft Corporation. All rights reserved.
1351
1484
  * Licensed under the MIT License. See License.txt in the project root for license information.
1352
1485
  *--------------------------------------------------------------------------------------------*/
1353
1486
 
1354
- .monaco-mouse-cursor-text {
1355
- cursor: text;
1487
+ .monaco-editor .margin {
1488
+ background-color: var(--vscode-editorGutter-background);
1356
1489
  }
1357
1490
 
1358
- /* The following selector looks a bit funny, but that is needed to cover all the workbench and the editor!! */
1359
- .vs-dark .mac .monaco-mouse-cursor-text, .hc-black .mac .monaco-mouse-cursor-text,
1360
- .vs-dark.mac .monaco-mouse-cursor-text, .hc-black.mac .monaco-mouse-cursor-text {
1361
- cursor: -webkit-image-set(url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAQAAAC1+jfqAAAAL0lEQVQoz2NgCD3x//9/BhBYBWdhgFVAiVW4JBFKGIa4AqD0//9D3pt4I4tAdAMAHTQ/j5Zom30AAAAASUVORK5CYII=) 1x, url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAQAAADZc7J/AAAAz0lEQVRIx2NgYGBY/R8I/vx5eelX3n82IJ9FxGf6tksvf/8FiTMQAcAGQMDvSwu09abffY8QYSAScNk45G198eX//yev73/4///701eh//kZSARckrNBRvz//+8+6ZohwCzjGNjdgQxkAg7B9WADeBjIBqtJCbhRA0YNoIkBSNmaPEMoNmA0FkYNoFKhapJ6FGyAH3nauaSmPfwI0v/3OukVi0CIZ+F25KrtYcx/CTIy0e+rC7R1Z4KMICVTQQ14feVXIbR695u14+Ir4gwAAD49E54wc1kWAAAAAElFTkSuQmCC) 2x) 5 8, text;
1491
+ /*---------------------------------------------------------------------------------------------
1492
+ * Copyright (c) Microsoft Corporation. All rights reserved.
1493
+ * Licensed under the MIT License. See License.txt in the project root for license information.
1494
+ *--------------------------------------------------------------------------------------------*/
1495
+
1496
+ .monaco-mouse-cursor-text {
1497
+ cursor: text;
1362
1498
  }
1363
1499
 
1364
1500
  /*---------------------------------------------------------------------------------------------
@@ -1424,15 +1560,17 @@
1424
1560
  * Licensed under the MIT License. See License.txt in the project root for license information.
1425
1561
  *--------------------------------------------------------------------------------------------*/
1426
1562
 
1427
- /*
1428
- Keeping name short for faster parsing.
1429
- cigr = core ident guides rendering (div)
1430
- */
1431
- .monaco-editor .lines-content .cigr {
1563
+ .monaco-editor .lines-content .core-guide {
1432
1564
  position: absolute;
1565
+ box-sizing: border-box;
1433
1566
  }
1434
- .monaco-editor .lines-content .cigra {
1435
- position: absolute;
1567
+
1568
+ .monaco-editor .lines-content .core-guide-indent {
1569
+ box-shadow: 1px 0 0 0 var(--vscode-editorIndentGuide-background) inset;
1570
+ }
1571
+
1572
+ .monaco-editor .lines-content .core-guide-indent-active {
1573
+ box-shadow: 1px 0 0 0 var(--vscode-editorIndentGuide-activeBackground, --vscode-editorIndentGuide-background) inset;
1436
1574
  }
1437
1575
 
1438
1576
  /*---------------------------------------------------------------------------------------------
@@ -1451,12 +1589,44 @@
1451
1589
  100% { background-color: none }
1452
1590
  }*/
1453
1591
 
1592
+ .mtkcontrol {
1593
+ color: rgb(255, 255, 255) !important;
1594
+ background: rgb(150, 0, 0) !important;
1595
+ }
1596
+
1597
+ .mtkoverflow {
1598
+ background-color: var(--vscode-button-background, --vscode-editor-background);
1599
+ color: var(--vscode-button-foreground, --vscode-editor-foreground);
1600
+ border-width: 1px;
1601
+ border-style: solid;
1602
+ border-color: var(--vscode-contrastBorder);
1603
+ border-radius: 2px;
1604
+ padding: 4px;
1605
+ cursor: pointer;
1606
+ }
1607
+ .mtkoverflow:hover {
1608
+ background-color: var(--vscode-button-hoverBackground);
1609
+ }
1610
+
1454
1611
  .monaco-editor.no-user-select .lines-content,
1455
1612
  .monaco-editor.no-user-select .view-line,
1456
1613
  .monaco-editor.no-user-select .view-lines {
1457
1614
  user-select: none;
1458
1615
  -webkit-user-select: none;
1459
- -ms-user-select: none;
1616
+ }
1617
+ /* Use user-select: text for lookup feature on macOS */
1618
+ /* https://github.com/microsoft/vscode/issues/85632 */
1619
+ .monaco-editor.mac .lines-content:hover,
1620
+ .monaco-editor.mac .view-line:hover,
1621
+ .monaco-editor.mac .view-lines:hover {
1622
+ user-select: text;
1623
+ -webkit-user-select: text;
1624
+ -ms-user-select: text;
1625
+ }
1626
+
1627
+ .monaco-editor.enable-user-select {
1628
+ user-select: initial;
1629
+ -webkit-user-select: initial;
1460
1630
  }
1461
1631
 
1462
1632
  .monaco-editor .view-lines {
@@ -1468,8 +1638,13 @@
1468
1638
  width: 100%;
1469
1639
  }
1470
1640
 
1641
+ .monaco-editor .mtkw {
1642
+ color: var(--vscode-editorWhitespace-foreground) !important;
1643
+ }
1644
+
1471
1645
  .monaco-editor .mtkz {
1472
1646
  display: inline-block;
1647
+ color: var(--vscode-editorWhitespace-foreground) !important;
1473
1648
  }
1474
1649
 
1475
1650
  /* TODO@tokenization bootstrap fix */
@@ -1529,7 +1704,18 @@
1529
1704
  opacity: 1;
1530
1705
  }
1531
1706
  /* END cover the case that slider is visible on mouseover */
1532
-
1707
+ .monaco-editor .minimap-slider .minimap-slider-horizontal {
1708
+ background: var(--vscode-minimapSlider-background);
1709
+ }
1710
+ .monaco-editor .minimap-slider:hover .minimap-slider-horizontal {
1711
+ background: var(--vscode-minimapSlider-hoverBackground);
1712
+ }
1713
+ .monaco-editor .minimap-slider.active .minimap-slider-horizontal {
1714
+ background: var(--vscode-minimapSlider-activeBackground);
1715
+ }
1716
+ .monaco-editor .minimap-shadow-visible {
1717
+ box-shadow: var(--vscode-scrollbar-shadow) -6px 0 6px -6px inset;
1718
+ }
1533
1719
  .monaco-editor .minimap-shadow-hidden {
1534
1720
  position: absolute;
1535
1721
  width: 0;
@@ -1545,6 +1731,15 @@
1545
1731
  width: 1px;
1546
1732
  }
1547
1733
 
1734
+ /* 0.5s fade in/out for the minimap */
1735
+ .minimap.autohide {
1736
+ opacity: 0;
1737
+ transition: opacity 0.5s;
1738
+ }
1739
+ .minimap.autohide:hover {
1740
+ opacity: 1;
1741
+ }
1742
+
1548
1743
  /*---------------------------------------------------------------------------------------------
1549
1744
  * Copyright (c) Microsoft Corporation. All rights reserved.
1550
1745
  * Licensed under the MIT License. See License.txt in the project root for license information.
@@ -1562,7 +1757,9 @@
1562
1757
  .monaco-editor .view-ruler {
1563
1758
  position: absolute;
1564
1759
  top: 0;
1760
+ box-shadow: 1px 0 0 0 var(--vscode-editorRuler-foreground) inset;
1565
1761
  }
1762
+
1566
1763
  /*---------------------------------------------------------------------------------------------
1567
1764
  * Copyright (c) Microsoft Corporation. All rights reserved.
1568
1765
  * Licensed under the MIT License. See License.txt in the project root for license information.
@@ -1573,7 +1770,9 @@
1573
1770
  top: 0;
1574
1771
  left: 0;
1575
1772
  height: 6px;
1773
+ box-shadow: var(--vscode-scrollbar-shadow) 0 6px 6px -6px inset;
1576
1774
  }
1775
+
1577
1776
  /*---------------------------------------------------------------------------------------------
1578
1777
  * Copyright (c) Microsoft Corporation. All rights reserved.
1579
1778
  * Licensed under the MIT License. See License.txt in the project root for license information.
@@ -1587,6 +1786,14 @@
1587
1786
  position: absolute;
1588
1787
  }
1589
1788
 
1789
+ .monaco-editor .focused .selected-text {
1790
+ background-color: var(--vscode-editor-selectionBackground);
1791
+ }
1792
+
1793
+ .monaco-editor .selected-text {
1794
+ background-color: var(--vscode-editor-inactiveSelectionBackground);
1795
+ }
1796
+
1590
1797
  .monaco-editor .top-left-radius { border-top-left-radius: 3px; }
1591
1798
  .monaco-editor .bottom-left-radius { border-bottom-left-radius: 3px; }
1592
1799
  .monaco-editor .top-right-radius { border-top-right-radius: 3px; }
@@ -1597,6 +1804,11 @@
1597
1804
  .monaco-editor.hc-black .top-right-radius { border-top-right-radius: 0; }
1598
1805
  .monaco-editor.hc-black .bottom-right-radius { border-bottom-right-radius: 0; }
1599
1806
 
1807
+ .monaco-editor.hc-light .top-left-radius { border-top-left-radius: 0; }
1808
+ .monaco-editor.hc-light .bottom-left-radius { border-bottom-left-radius: 0; }
1809
+ .monaco-editor.hc-light .top-right-radius { border-top-right-radius: 0; }
1810
+ .monaco-editor.hc-light .bottom-right-radius { border-bottom-right-radius: 0; }
1811
+
1600
1812
  /*---------------------------------------------------------------------------------------------
1601
1813
  * Copyright (c) Microsoft Corporation. All rights reserved.
1602
1814
  * Licensed under the MIT License. See License.txt in the project root for license information.
@@ -1609,6 +1821,7 @@
1609
1821
  .monaco-editor .cursors-layer > .cursor {
1610
1822
  position: absolute;
1611
1823
  overflow: hidden;
1824
+ box-sizing: border-box;
1612
1825
  }
1613
1826
 
1614
1827
  /* -- smooth-caret-animation -- */
@@ -1618,7 +1831,6 @@
1618
1831
 
1619
1832
  /* -- block-outline-style -- */
1620
1833
  .monaco-editor .cursors-layer.cursor-block-outline-style > .cursor {
1621
- box-sizing: border-box;
1622
1834
  background: transparent !important;
1623
1835
  border-style: solid;
1624
1836
  border-width: 1px;
@@ -1629,7 +1841,6 @@
1629
1841
  border-bottom-width: 2px;
1630
1842
  border-bottom-style: solid;
1631
1843
  background: transparent !important;
1632
- box-sizing: border-box;
1633
1844
  }
1634
1845
 
1635
1846
  /* -- underline-thin-style -- */
@@ -1637,7 +1848,6 @@
1637
1848
  border-bottom-width: 1px;
1638
1849
  border-bottom-style: solid;
1639
1850
  background: transparent !important;
1640
- box-sizing: border-box;
1641
1851
  }
1642
1852
 
1643
1853
  @keyframes monaco-cursor-smooth {
@@ -1690,246 +1900,521 @@
1690
1900
  * Licensed under the MIT License. See License.txt in the project root for license information.
1691
1901
  *--------------------------------------------------------------------------------------------*/
1692
1902
 
1693
- .monaco-editor .accessibilityHelpWidget {
1694
- padding: 10px;
1695
- vertical-align: middle;
1696
- overflow: scroll;
1903
+ .monaco-editor .blockDecorations-container {
1904
+ position: absolute;
1905
+ top: 0;
1906
+ pointer-events: none;
1907
+ }
1908
+
1909
+ .monaco-editor .blockDecorations-block {
1910
+ position: absolute;
1911
+ box-sizing: border-box;
1697
1912
  }
1913
+
1698
1914
  /*---------------------------------------------------------------------------------------------
1699
1915
  * Copyright (c) Microsoft Corporation. All rights reserved.
1700
1916
  * Licensed under the MIT License. See License.txt in the project root for license information.
1701
1917
  *--------------------------------------------------------------------------------------------*/
1702
1918
 
1919
+ .monaco-editor .mwh {
1920
+ position: absolute;
1921
+ color: var(--vscode-editorWhitespace-foreground) !important;
1922
+ }
1703
1923
 
1704
- /* Default standalone editor fonts */
1705
- .monaco-editor {
1706
- font-family: -apple-system, BlinkMacSystemFont, "Segoe WPC", "Segoe UI", "HelveticaNeue-Light", system-ui, "Ubuntu", "Droid Sans", sans-serif;
1707
- --monaco-monospace-font: "SF Mono", Monaco, Menlo, Consolas, "Ubuntu Mono", "Liberation Mono", "DejaVu Sans Mono", "Courier New", monospace;
1924
+ /*---------------------------------------------------------------------------------------------
1925
+ * Copyright (c) Microsoft Corporation. All rights reserved.
1926
+ * Licensed under the MIT License. See License.txt in the project root for license information.
1927
+ *--------------------------------------------------------------------------------------------*/
1928
+
1929
+ .monaco-dropdown {
1930
+ height: 100%;
1931
+ padding: 0;
1708
1932
  }
1709
1933
 
1710
- .monaco-menu .monaco-action-bar.vertical .action-item .action-menu-item:focus .action-label {
1711
- stroke-width: 1.2px;
1934
+ .monaco-dropdown > .dropdown-label {
1935
+ cursor: pointer;
1936
+ height: 100%;
1937
+ display: flex;
1938
+ align-items: center;
1939
+ justify-content: center;
1712
1940
  }
1713
1941
 
1714
- .monaco-editor.vs-dark .monaco-menu .monaco-action-bar.vertical .action-menu-item:focus .action-label,
1715
- .monaco-editor.hc-black .monaco-menu .monaco-action-bar.vertical .action-menu-item:focus .action-label {
1716
- stroke-width: 1.2px;
1942
+ .monaco-dropdown > .dropdown-label > .action-label.disabled {
1943
+ cursor: default;
1717
1944
  }
1718
1945
 
1719
- .monaco-hover p {
1720
- margin: 0;
1946
+ .monaco-dropdown-with-primary {
1947
+ display: flex !important;
1948
+ flex-direction: row;
1949
+ border-radius: 5px;
1721
1950
  }
1722
1951
 
1723
- /* See https://github.com/microsoft/monaco-editor/issues/2168#issuecomment-780078600 */
1724
- .monaco-aria-container {
1725
- position: absolute !important;
1726
- height: 1px;
1727
- width: 1px;
1728
- margin: -1px;
1952
+ .monaco-dropdown-with-primary > .action-container > .action-label {
1953
+ margin-right: 0;
1954
+ }
1955
+
1956
+ .monaco-dropdown-with-primary > .dropdown-action-container > .monaco-dropdown > .dropdown-label .codicon[class*='codicon-'] {
1957
+ font-size: 12px;
1958
+ padding-left: 0px;
1959
+ padding-right: 0px;
1960
+ line-height: 16px;
1961
+ margin-left: -3px;
1962
+ }
1963
+
1964
+ .monaco-dropdown-with-primary > .dropdown-action-container > .monaco-dropdown > .dropdown-label > .action-label {
1965
+ display: block;
1966
+ background-size: 16px;
1967
+ background-position: center center;
1968
+ background-repeat: no-repeat;
1969
+ }
1970
+
1971
+ /*---------------------------------------------------------------------------------------------
1972
+ * Copyright (c) Microsoft Corporation. All rights reserved.
1973
+ * Licensed under the MIT License. See License.txt in the project root for license information.
1974
+ *--------------------------------------------------------------------------------------------*/
1975
+
1976
+ .monaco-action-bar .action-item.menu-entry .action-label.icon {
1977
+ width: 16px;
1978
+ height: 16px;
1979
+ background-repeat: no-repeat;
1980
+ background-position: 50%;
1981
+ background-size: 16px;
1982
+ }
1983
+
1984
+ .monaco-dropdown-with-default {
1985
+ display: flex !important;
1986
+ flex-direction: row;
1987
+ border-radius: 5px;
1988
+ }
1989
+
1990
+ .monaco-dropdown-with-default > .action-container > .action-label {
1991
+ margin-right: 0;
1992
+ }
1993
+
1994
+ .monaco-dropdown-with-default > .action-container.menu-entry > .action-label.icon {
1995
+ width: 16px;
1996
+ height: 16px;
1997
+ background-repeat: no-repeat;
1998
+ background-position: 50%;
1999
+ background-size: 16px;
2000
+ }
2001
+
2002
+ .monaco-dropdown-with-default > .dropdown-action-container > .monaco-dropdown > .dropdown-label .codicon[class*='codicon-'] {
2003
+ font-size: 12px;
2004
+ padding-left: 0px;
2005
+ padding-right: 0px;
2006
+ line-height: 16px;
2007
+ margin-left: -3px;
2008
+ }
2009
+
2010
+ .monaco-dropdown-with-default > .dropdown-action-container > .monaco-dropdown > .dropdown-label > .action-label {
2011
+ display: block;
2012
+ background-size: 16px;
2013
+ background-position: center center;
2014
+ background-repeat: no-repeat;
2015
+ }
2016
+
2017
+ /*---------------------------------------------------------------------------------------------
2018
+ * Copyright (c) Microsoft Corporation. All rights reserved.
2019
+ * Licensed under the MIT License. See License.txt in the project root for license information.
2020
+ *--------------------------------------------------------------------------------------------*/
2021
+
2022
+ .monaco-editor .codicon.codicon-symbol-array,
2023
+ .monaco-workbench .codicon.codicon-symbol-array { color: var(--vscode-symbolIcon-arrayForeground); }
2024
+ .monaco-editor .codicon.codicon-symbol-boolean,
2025
+ .monaco-workbench .codicon.codicon-symbol-boolean { color: var(--vscode-symbolIcon-booleanForeground); }
2026
+ .monaco-editor .codicon.codicon-symbol-class,
2027
+ .monaco-workbench .codicon.codicon-symbol-class { color: var(--vscode-symbolIcon-classForeground); }
2028
+ .monaco-editor .codicon.codicon-symbol-method,
2029
+ .monaco-workbench .codicon.codicon-symbol-method { color: var(--vscode-symbolIcon-methodForeground); }
2030
+ .monaco-editor .codicon.codicon-symbol-color,
2031
+ .monaco-workbench .codicon.codicon-symbol-color { color: var(--vscode-symbolIcon-colorForeground); }
2032
+ .monaco-editor .codicon.codicon-symbol-constant,
2033
+ .monaco-workbench .codicon.codicon-symbol-constant { color: var(--vscode-symbolIcon-constantForeground); }
2034
+ .monaco-editor .codicon.codicon-symbol-constructor,
2035
+ .monaco-workbench .codicon.codicon-symbol-constructor { color: var(--vscode-symbolIcon-constructorForeground); }
2036
+ .monaco-editor .codicon.codicon-symbol-value,
2037
+ .monaco-workbench .codicon.codicon-symbol-value,
2038
+ .monaco-editor .codicon.codicon-symbol-enum,
2039
+ .monaco-workbench .codicon.codicon-symbol-enum { color: var(--vscode-symbolIcon-enumeratorForeground); }
2040
+ .monaco-editor .codicon.codicon-symbol-enum-member,
2041
+ .monaco-workbench .codicon.codicon-symbol-enum-member { color: var(--vscode-symbolIcon-enumeratorMemberForeground); }
2042
+ .monaco-editor .codicon.codicon-symbol-event,
2043
+ .monaco-workbench .codicon.codicon-symbol-event { color: var(--vscode-symbolIcon-eventForeground); }
2044
+ .monaco-editor .codicon.codicon-symbol-field,
2045
+ .monaco-workbench .codicon.codicon-symbol-field { color: var(--vscode-symbolIcon-fieldForeground); }
2046
+ .monaco-editor .codicon.codicon-symbol-file,
2047
+ .monaco-workbench .codicon.codicon-symbol-file { color: var(--vscode-symbolIcon-fileForeground); }
2048
+ .monaco-editor .codicon.codicon-symbol-folder,
2049
+ .monaco-workbench .codicon.codicon-symbol-folder { color: var(--vscode-symbolIcon-folderForeground); }
2050
+ .monaco-editor .codicon.codicon-symbol-function,
2051
+ .monaco-workbench .codicon.codicon-symbol-function { color: var(--vscode-symbolIcon-functionForeground); }
2052
+ .monaco-editor .codicon.codicon-symbol-interface,
2053
+ .monaco-workbench .codicon.codicon-symbol-interface { color: var(--vscode-symbolIcon-interfaceForeground); }
2054
+ .monaco-editor .codicon.codicon-symbol-key,
2055
+ .monaco-workbench .codicon.codicon-symbol-key { color: var(--vscode-symbolIcon-keyForeground); }
2056
+ .monaco-editor .codicon.codicon-symbol-keyword,
2057
+ .monaco-workbench .codicon.codicon-symbol-keyword { color: var(--vscode-symbolIcon-keywordForeground); }
2058
+ .monaco-editor .codicon.codicon-symbol-module,
2059
+ .monaco-workbench .codicon.codicon-symbol-module { color: var(--vscode-symbolIcon-moduleForeground); }
2060
+ .monaco-editor .codicon.codicon-symbol-namespace,
2061
+ .monaco-workbench .codicon.codicon-symbol-namespace { color: var(--vscode-symbolIcon-namespaceForeground); }
2062
+ .monaco-editor .codicon.codicon-symbol-null,
2063
+ .monaco-workbench .codicon.codicon-symbol-null { color: var(--vscode-symbolIcon-nullForeground); }
2064
+ .monaco-editor .codicon.codicon-symbol-number,
2065
+ .monaco-workbench .codicon.codicon-symbol-number { color: var(--vscode-symbolIcon-numberForeground); }
2066
+ .monaco-editor .codicon.codicon-symbol-object,
2067
+ .monaco-workbench .codicon.codicon-symbol-object { color: var(--vscode-symbolIcon-objectForeground); }
2068
+ .monaco-editor .codicon.codicon-symbol-operator,
2069
+ .monaco-workbench .codicon.codicon-symbol-operator { color: var(--vscode-symbolIcon-operatorForeground); }
2070
+ .monaco-editor .codicon.codicon-symbol-package,
2071
+ .monaco-workbench .codicon.codicon-symbol-package { color: var(--vscode-symbolIcon-packageForeground); }
2072
+ .monaco-editor .codicon.codicon-symbol-property,
2073
+ .monaco-workbench .codicon.codicon-symbol-property { color: var(--vscode-symbolIcon-propertyForeground); }
2074
+ .monaco-editor .codicon.codicon-symbol-reference,
2075
+ .monaco-workbench .codicon.codicon-symbol-reference { color: var(--vscode-symbolIcon-referenceForeground); }
2076
+ .monaco-editor .codicon.codicon-symbol-snippet,
2077
+ .monaco-workbench .codicon.codicon-symbol-snippet { color: var(--vscode-symbolIcon-snippetForeground); }
2078
+ .monaco-editor .codicon.codicon-symbol-string,
2079
+ .monaco-workbench .codicon.codicon-symbol-string { color: var(--vscode-symbolIcon-stringForeground); }
2080
+ .monaco-editor .codicon.codicon-symbol-struct,
2081
+ .monaco-workbench .codicon.codicon-symbol-struct { color: var(--vscode-symbolIcon-structForeground); }
2082
+ .monaco-editor .codicon.codicon-symbol-text,
2083
+ .monaco-workbench .codicon.codicon-symbol-text { color: var(--vscode-symbolIcon-textForeground); }
2084
+ .monaco-editor .codicon.codicon-symbol-type-parameter,
2085
+ .monaco-workbench .codicon.codicon-symbol-type-parameter { color: var(--vscode-symbolIcon-typeParameterForeground); }
2086
+ .monaco-editor .codicon.codicon-symbol-unit,
2087
+ .monaco-workbench .codicon.codicon-symbol-unit { color: var(--vscode-symbolIcon-unitForeground); }
2088
+ .monaco-editor .codicon.codicon-symbol-variable,
2089
+ .monaco-workbench .codicon.codicon-symbol-variable { color: var(--vscode-symbolIcon-variableForeground); }
2090
+
2091
+ /*---------------------------------------------------------------------------------------------
2092
+ * Copyright (c) Microsoft Corporation. All rights reserved.
2093
+ * Licensed under the MIT License. See License.txt in the project root for license information.
2094
+ *--------------------------------------------------------------------------------------------*/
2095
+
2096
+ :root {
2097
+ --vscode-sash-size: 4px;
2098
+ }
2099
+
2100
+ .monaco-sash {
2101
+ position: absolute;
2102
+ z-index: 35;
2103
+ touch-action: none;
2104
+ }
2105
+
2106
+ .monaco-sash.disabled {
2107
+ pointer-events: none;
2108
+ }
2109
+
2110
+ .monaco-sash.mac.vertical {
2111
+ cursor: col-resize;
2112
+ }
2113
+
2114
+ .monaco-sash.vertical.minimum {
2115
+ cursor: e-resize;
2116
+ }
2117
+
2118
+ .monaco-sash.vertical.maximum {
2119
+ cursor: w-resize;
2120
+ }
2121
+
2122
+ .monaco-sash.mac.horizontal {
2123
+ cursor: row-resize;
2124
+ }
2125
+
2126
+ .monaco-sash.horizontal.minimum {
2127
+ cursor: s-resize;
2128
+ }
2129
+
2130
+ .monaco-sash.horizontal.maximum {
2131
+ cursor: n-resize;
2132
+ }
2133
+
2134
+ .monaco-sash.disabled {
2135
+ cursor: default !important;
2136
+ pointer-events: none !important;
2137
+ }
2138
+
2139
+ .monaco-sash.vertical {
2140
+ cursor: ew-resize;
2141
+ top: 0;
2142
+ width: var(--vscode-sash-size);
2143
+ height: 100%;
2144
+ }
2145
+
2146
+ .monaco-sash.horizontal {
2147
+ cursor: ns-resize;
2148
+ left: 0;
2149
+ width: 100%;
2150
+ height: var(--vscode-sash-size);
2151
+ }
2152
+
2153
+ .monaco-sash:not(.disabled) > .orthogonal-drag-handle {
2154
+ content: " ";
2155
+ height: calc(var(--vscode-sash-size) * 2);
2156
+ width: calc(var(--vscode-sash-size) * 2);
2157
+ z-index: 100;
2158
+ display: block;
2159
+ cursor: all-scroll;
2160
+ position: absolute;
2161
+ }
2162
+
2163
+ .monaco-sash.horizontal.orthogonal-edge-north:not(.disabled)
2164
+ > .orthogonal-drag-handle.start,
2165
+ .monaco-sash.horizontal.orthogonal-edge-south:not(.disabled)
2166
+ > .orthogonal-drag-handle.end {
2167
+ cursor: nwse-resize;
2168
+ }
2169
+
2170
+ .monaco-sash.horizontal.orthogonal-edge-north:not(.disabled)
2171
+ > .orthogonal-drag-handle.end,
2172
+ .monaco-sash.horizontal.orthogonal-edge-south:not(.disabled)
2173
+ > .orthogonal-drag-handle.start {
2174
+ cursor: nesw-resize;
2175
+ }
2176
+
2177
+ .monaco-sash.vertical > .orthogonal-drag-handle.start {
2178
+ left: calc(var(--vscode-sash-size) * -0.5);
2179
+ top: calc(var(--vscode-sash-size) * -1);
2180
+ }
2181
+ .monaco-sash.vertical > .orthogonal-drag-handle.end {
2182
+ left: calc(var(--vscode-sash-size) * -0.5);
2183
+ bottom: calc(var(--vscode-sash-size) * -1);
2184
+ }
2185
+ .monaco-sash.horizontal > .orthogonal-drag-handle.start {
2186
+ top: calc(var(--vscode-sash-size) * -0.5);
2187
+ left: calc(var(--vscode-sash-size) * -1);
2188
+ }
2189
+ .monaco-sash.horizontal > .orthogonal-drag-handle.end {
2190
+ top: calc(var(--vscode-sash-size) * -0.5);
2191
+ right: calc(var(--vscode-sash-size) * -1);
2192
+ }
2193
+
2194
+ .monaco-sash:before {
2195
+ content: '';
2196
+ pointer-events: none;
2197
+ position: absolute;
2198
+ width: 100%;
2199
+ height: 100%;
2200
+ background: transparent;
2201
+ }
2202
+
2203
+ .monaco-workbench:not(.reduce-motion) .monaco-sash:before {
2204
+ transition: background-color 0.1s ease-out;
2205
+ }
2206
+
2207
+ .monaco-sash.hover:before,
2208
+ .monaco-sash.active:before {
2209
+ background: var(--vscode-sash-hoverBorder);
2210
+ }
2211
+
2212
+ .monaco-sash.vertical:before {
2213
+ width: var(--vscode-sash-hover-size);
2214
+ left: calc(50% - (var(--vscode-sash-hover-size) / 2));
2215
+ }
2216
+
2217
+ .monaco-sash.horizontal:before {
2218
+ height: var(--vscode-sash-hover-size);
2219
+ top: calc(50% - (var(--vscode-sash-hover-size) / 2));
2220
+ }
2221
+
2222
+ .pointer-events-disabled {
2223
+ pointer-events: none !important;
2224
+ }
2225
+
2226
+ /** Debug **/
2227
+
2228
+ .monaco-sash.debug {
2229
+ background: cyan;
2230
+ }
2231
+
2232
+ .monaco-sash.debug.disabled {
2233
+ background: rgba(0, 255, 255, 0.2);
2234
+ }
2235
+
2236
+ .monaco-sash.debug:not(.disabled) > .orthogonal-drag-handle {
2237
+ background: red;
2238
+ }
2239
+
2240
+ /*---------------------------------------------------------------------------------------------
2241
+ * Copyright (c) Microsoft Corporation. All rights reserved.
2242
+ * Licensed under the MIT License. See License.txt in the project root for license information.
2243
+ *--------------------------------------------------------------------------------------------*/
2244
+
2245
+ .monaco-editor .rendered-markdown kbd {
2246
+ background-color: var(--vscode-keybindingLabel-background);
2247
+ color: var(--vscode-keybindingLabel-foreground);
2248
+ border-style: solid;
2249
+ border-width: 1px;
2250
+ border-radius: 3px;
2251
+ border-color: var(--vscode-keybindingLabel-border);
2252
+ border-bottom-color: var(--vscode-keybindingLabel-bottomBorder);
2253
+ box-shadow: inset 0 -1px 0 var(--vscode-widget-shadow);
2254
+ vertical-align: middle;
2255
+ padding: 1px 3px;
2256
+ }
2257
+
2258
+ /*---------------------------------------------------------------------------------------------
2259
+ * Copyright (c) Microsoft Corporation. All rights reserved.
2260
+ * Licensed under the MIT License. See License.txt in the project root for license information.
2261
+ *--------------------------------------------------------------------------------------------*/
2262
+
2263
+ /* ---------- Icon label ---------- */
2264
+
2265
+ .monaco-icon-label {
2266
+ display: flex; /* required for icons support :before rule */
1729
2267
  overflow: hidden;
1730
- padding: 0;
1731
- clip: rect(1px, 1px, 1px, 1px);
1732
- clip-path: inset(50%);
2268
+ text-overflow: ellipsis;
1733
2269
  }
1734
2270
 
1735
- /* The hc-black theme is already high contrast optimized */
1736
- .monaco-editor.hc-black {
1737
- -ms-high-contrast-adjust: none;
2271
+ .monaco-icon-label::before {
2272
+
2273
+ /* svg icons rendered as background image */
2274
+ background-size: 16px;
2275
+ background-position: left center;
2276
+ background-repeat: no-repeat;
2277
+ padding-right: 6px;
2278
+ width: 16px;
2279
+ height: 22px;
2280
+ line-height: inherit !important;
2281
+ display: inline-block;
2282
+
2283
+ /* fonts icons */
2284
+ -webkit-font-smoothing: antialiased;
2285
+ -moz-osx-font-smoothing: grayscale;
2286
+ vertical-align: top;
2287
+
2288
+ flex-shrink: 0; /* fix for https://github.com/microsoft/vscode/issues/13787 */
1738
2289
  }
1739
- /* In case the browser goes into high contrast mode and the editor is not configured with the hc-black theme */
1740
- @media screen and (-ms-high-contrast:active) {
1741
2290
 
1742
- /* current line highlight */
1743
- .monaco-editor.vs .view-overlays .current-line,
1744
- .monaco-editor.vs-dark .view-overlays .current-line {
1745
- border-color: windowtext !important;
1746
- border-left: 0;
1747
- border-right: 0;
1748
- }
2291
+ .monaco-icon-label-container.disabled {
2292
+ color: var(--vscode-disabledForeground);
2293
+ }
2294
+ .monaco-icon-label > .monaco-icon-label-container {
2295
+ min-width: 0;
2296
+ overflow: hidden;
2297
+ text-overflow: ellipsis;
2298
+ flex: 1;
2299
+ }
1749
2300
 
1750
- /* view cursors */
1751
- .monaco-editor.vs .cursor,
1752
- .monaco-editor.vs-dark .cursor {
1753
- background-color: windowtext !important;
1754
- }
1755
- /* dnd target */
1756
- .monaco-editor.vs .dnd-target,
1757
- .monaco-editor.vs-dark .dnd-target {
1758
- border-color: windowtext !important;
1759
- }
2301
+ .monaco-icon-label > .monaco-icon-label-container > .monaco-icon-name-container > .label-name {
2302
+ color: inherit;
2303
+ white-space: pre; /* enable to show labels that include multiple whitespaces */
2304
+ }
1760
2305
 
1761
- /* selected text background */
1762
- .monaco-editor.vs .selected-text,
1763
- .monaco-editor.vs-dark .selected-text {
1764
- background-color: highlight !important;
1765
- }
2306
+ .monaco-icon-label > .monaco-icon-label-container > .monaco-icon-name-container > .label-name > .label-separator {
2307
+ margin: 0 2px;
2308
+ opacity: 0.5;
2309
+ }
1766
2310
 
1767
- /* allow the text to have a transparent background. */
1768
- .monaco-editor.vs .view-line,
1769
- .monaco-editor.vs-dark .view-line {
1770
- -ms-high-contrast-adjust: none;
1771
- }
2311
+ .monaco-icon-label > .monaco-icon-label-container > .monaco-icon-description-container > .label-description {
2312
+ opacity: .7;
2313
+ margin-left: 0.5em;
2314
+ font-size: 0.9em;
2315
+ white-space: pre; /* enable to show labels that include multiple whitespaces */
2316
+ }
1772
2317
 
1773
- /* text color */
1774
- .monaco-editor.vs .view-line span,
1775
- .monaco-editor.vs-dark .view-line span {
1776
- color: windowtext !important;
1777
- }
1778
- /* selected text color */
1779
- .monaco-editor.vs .view-line span.inline-selected-text,
1780
- .monaco-editor.vs-dark .view-line span.inline-selected-text {
1781
- color: highlighttext !important;
1782
- }
2318
+ .monaco-icon-label.nowrap > .monaco-icon-label-container > .monaco-icon-description-container > .label-description{
2319
+ white-space: nowrap
2320
+ }
1783
2321
 
1784
- /* allow decorations */
1785
- .monaco-editor.vs .view-overlays,
1786
- .monaco-editor.vs-dark .view-overlays {
1787
- -ms-high-contrast-adjust: none;
1788
- }
2322
+ .vs .monaco-icon-label > .monaco-icon-label-container > .monaco-icon-description-container > .label-description {
2323
+ opacity: .95;
2324
+ }
1789
2325
 
1790
- /* various decorations */
1791
- .monaco-editor.vs .selectionHighlight,
1792
- .monaco-editor.vs-dark .selectionHighlight,
1793
- .monaco-editor.vs .wordHighlight,
1794
- .monaco-editor.vs-dark .wordHighlight,
1795
- .monaco-editor.vs .wordHighlightStrong,
1796
- .monaco-editor.vs-dark .wordHighlightStrong,
1797
- .monaco-editor.vs .reference-decoration,
1798
- .monaco-editor.vs-dark .reference-decoration {
1799
- border: 2px dotted highlight !important;
1800
- background: transparent !important;
1801
- box-sizing: border-box;
1802
- }
1803
- .monaco-editor.vs .rangeHighlight,
1804
- .monaco-editor.vs-dark .rangeHighlight {
1805
- background: transparent !important;
1806
- border: 1px dotted activeborder !important;
1807
- box-sizing: border-box;
1808
- }
1809
- .monaco-editor.vs .bracket-match,
1810
- .monaco-editor.vs-dark .bracket-match {
1811
- border-color: windowtext !important;
1812
- background: transparent !important;
1813
- }
2326
+ .monaco-icon-label.italic > .monaco-icon-label-container > .monaco-icon-name-container > .label-name,
2327
+ .monaco-icon-label.italic > .monaco-icon-label-container > .monaco-icon-description-container > .label-description {
2328
+ font-style: italic;
2329
+ }
1814
2330
 
1815
- /* find widget */
1816
- .monaco-editor.vs .findMatch,
1817
- .monaco-editor.vs-dark .findMatch,
1818
- .monaco-editor.vs .currentFindMatch,
1819
- .monaco-editor.vs-dark .currentFindMatch {
1820
- border: 2px dotted activeborder !important;
1821
- background: transparent !important;
1822
- box-sizing: border-box;
1823
- }
1824
- .monaco-editor.vs .find-widget,
1825
- .monaco-editor.vs-dark .find-widget {
1826
- border: 1px solid windowtext;
1827
- }
2331
+ .monaco-icon-label.deprecated {
2332
+ text-decoration: line-through;
2333
+ opacity: 0.66;
2334
+ }
1828
2335
 
1829
- /* list - used by suggest widget */
1830
- .monaco-editor.vs .monaco-list .monaco-list-row,
1831
- .monaco-editor.vs-dark .monaco-list .monaco-list-row {
1832
- -ms-high-contrast-adjust: none;
1833
- color: windowtext !important;
1834
- }
1835
- .monaco-editor.vs .monaco-list .monaco-list-row.focused,
1836
- .monaco-editor.vs-dark .monaco-list .monaco-list-row.focused {
1837
- color: highlighttext !important;
1838
- background-color: highlight !important;
1839
- }
1840
- .monaco-editor.vs .monaco-list .monaco-list-row:hover,
1841
- .monaco-editor.vs-dark .monaco-list .monaco-list-row:hover {
1842
- background: transparent !important;
1843
- border: 1px solid highlight;
1844
- box-sizing: border-box;
1845
- }
2336
+ /* make sure apply italic font style to decorations as well */
2337
+ .monaco-icon-label.italic::after {
2338
+ font-style: italic;
2339
+ }
2340
+
2341
+ .monaco-icon-label.strikethrough > .monaco-icon-label-container > .monaco-icon-name-container > .label-name,
2342
+ .monaco-icon-label.strikethrough > .monaco-icon-label-container > .monaco-icon-description-container > .label-description {
2343
+ text-decoration: line-through;
2344
+ }
2345
+
2346
+ .monaco-icon-label::after {
2347
+ opacity: 0.75;
2348
+ font-size: 90%;
2349
+ font-weight: 600;
2350
+ margin: auto 16px 0 5px; /* https://github.com/microsoft/vscode/issues/113223 */
2351
+ text-align: center;
2352
+ }
2353
+
2354
+ /* make sure selection color wins when a label is being selected */
2355
+ .monaco-list:focus .selected .monaco-icon-label, /* list */
2356
+ .monaco-list:focus .selected .monaco-icon-label::after
2357
+ {
2358
+ color: inherit !important;
2359
+ }
2360
+
2361
+ .monaco-list-row.focused.selected .label-description,
2362
+ .monaco-list-row.selected .label-description {
2363
+ opacity: .8;
2364
+ }
2365
+
2366
+ /*---------------------------------------------------------------------------------------------
2367
+ * Copyright (c) Microsoft Corporation. All rights reserved.
2368
+ * Licensed under the MIT License. See License.txt in the project root for license information.
2369
+ *--------------------------------------------------------------------------------------------*/
2370
+
2371
+ .monaco-editor .accessibilityHelpWidget {
2372
+ padding: 10px;
2373
+ vertical-align: middle;
2374
+ overflow: scroll;
2375
+ color: var(--vscode-editorWidget-foreground);
2376
+ background-color: var(--vscode-editorWidget-background);
2377
+ box-shadow: 0 2px 8px var(--vscode-widget-shadow);
2378
+ border: 2px solid var(--vscode-contrastBorder);
2379
+ }
2380
+
2381
+ /*---------------------------------------------------------------------------------------------
2382
+ * Copyright (c) Microsoft Corporation. All rights reserved.
2383
+ * Licensed under the MIT License. See License.txt in the project root for license information.
2384
+ *--------------------------------------------------------------------------------------------*/
1846
2385
 
1847
- /* scrollbars */
1848
- .monaco-editor.vs .monaco-scrollable-element > .scrollbar,
1849
- .monaco-editor.vs-dark .monaco-scrollable-element > .scrollbar {
1850
- -ms-high-contrast-adjust: none;
1851
- background: background !important;
1852
- border: 1px solid windowtext;
1853
- box-sizing: border-box;
1854
- }
1855
- .monaco-editor.vs .monaco-scrollable-element > .scrollbar > .slider,
1856
- .monaco-editor.vs-dark .monaco-scrollable-element > .scrollbar > .slider {
1857
- background: windowtext !important;
1858
- }
1859
- .monaco-editor.vs .monaco-scrollable-element > .scrollbar > .slider:hover,
1860
- .monaco-editor.vs-dark .monaco-scrollable-element > .scrollbar > .slider:hover {
1861
- background: highlight !important;
1862
- }
1863
- .monaco-editor.vs .monaco-scrollable-element > .scrollbar > .slider.active,
1864
- .monaco-editor.vs-dark .monaco-scrollable-element > .scrollbar > .slider.active {
1865
- background: highlight !important;
1866
- }
1867
2386
 
1868
- /* overview ruler */
1869
- .monaco-editor.vs .decorationsOverviewRuler,
1870
- .monaco-editor.vs-dark .decorationsOverviewRuler {
1871
- opacity: 0;
1872
- }
2387
+ /* Default standalone editor fonts */
2388
+ .monaco-editor {
2389
+ font-family: -apple-system, BlinkMacSystemFont, "Segoe WPC", "Segoe UI", "HelveticaNeue-Light", system-ui, "Ubuntu", "Droid Sans", sans-serif;
2390
+ --monaco-monospace-font: "SF Mono", Monaco, Menlo, Consolas, "Ubuntu Mono", "Liberation Mono", "DejaVu Sans Mono", "Courier New", monospace;
2391
+ }
1873
2392
 
1874
- /* minimap */
1875
- .monaco-editor.vs .minimap,
1876
- .monaco-editor.vs-dark .minimap {
1877
- display: none;
1878
- }
2393
+ .monaco-menu .monaco-action-bar.vertical .action-item .action-menu-item:focus .action-label {
2394
+ stroke-width: 1.2px;
2395
+ }
1879
2396
 
1880
- /* squiggles */
1881
- .monaco-editor.vs .squiggly-d-error,
1882
- .monaco-editor.vs-dark .squiggly-d-error {
1883
- background: transparent !important;
1884
- border-bottom: 4px double #E47777;
1885
- }
1886
- .monaco-editor.vs .squiggly-c-warning,
1887
- .monaco-editor.vs-dark .squiggly-c-warning {
1888
- border-bottom: 4px double #71B771;
1889
- }
1890
- .monaco-editor.vs .squiggly-b-info,
1891
- .monaco-editor.vs-dark .squiggly-b-info {
1892
- border-bottom: 4px double #71B771;
1893
- }
1894
- .monaco-editor.vs .squiggly-a-hint,
1895
- .monaco-editor.vs-dark .squiggly-a-hint {
1896
- border-bottom: 4px double #6c6c6c;
1897
- }
2397
+ .monaco-editor.vs-dark .monaco-menu .monaco-action-bar.vertical .action-menu-item:focus .action-label,
2398
+ .monaco-editor.hc-black .monaco-menu .monaco-action-bar.vertical .action-menu-item:focus .action-label,
2399
+ .monaco-editor.hc-light .monaco-menu .monaco-action-bar.vertical .action-menu-item:focus .action-label {
2400
+ stroke-width: 1.2px;
2401
+ }
1898
2402
 
1899
- /* contextmenu */
1900
- .monaco-editor.vs .monaco-menu .monaco-action-bar.vertical .action-menu-item:focus .action-label,
1901
- .monaco-editor.vs-dark .monaco-menu .monaco-action-bar.vertical .action-menu-item:focus .action-label {
1902
- -ms-high-contrast-adjust: none;
1903
- color: highlighttext !important;
1904
- background-color: highlight !important;
1905
- }
1906
- .monaco-editor.vs .monaco-menu .monaco-action-bar.vertical .action-menu-item:hover .action-label,
1907
- .monaco-editor.vs-dark .monaco-menu .monaco-action-bar.vertical .action-menu-item:hover .action-label {
1908
- -ms-high-contrast-adjust: none;
1909
- background: transparent !important;
1910
- border: 1px solid highlight;
1911
- box-sizing: border-box;
1912
- }
2403
+ .monaco-hover p {
2404
+ margin: 0;
2405
+ }
1913
2406
 
1914
- /* diff editor */
1915
- .monaco-diff-editor.vs .diffOverviewRuler,
1916
- .monaco-diff-editor.vs-dark .diffOverviewRuler {
1917
- display: none;
1918
- }
1919
- .monaco-editor.vs .line-insert,
1920
- .monaco-editor.vs-dark .line-insert,
1921
- .monaco-editor.vs .line-delete,
1922
- .monaco-editor.vs-dark .line-delete {
1923
- background: transparent !important;
1924
- border: 1px solid highlight !important;
1925
- box-sizing: border-box;
1926
- }
1927
- .monaco-editor.vs .char-insert,
1928
- .monaco-editor.vs-dark .char-insert,
1929
- .monaco-editor.vs .char-delete,
1930
- .monaco-editor.vs-dark .char-delete {
1931
- background: transparent !important;
1932
- }
2407
+ /* See https://github.com/microsoft/monaco-editor/issues/2168#issuecomment-780078600 */
2408
+ .monaco-aria-container {
2409
+ position: absolute !important;
2410
+ top: 0; /* avoid being placed underneath a sibling element */
2411
+ height: 1px;
2412
+ width: 1px;
2413
+ margin: -1px;
2414
+ overflow: hidden;
2415
+ padding: 0;
2416
+ clip: rect(1px, 1px, 1px, 1px);
2417
+ clip-path: inset(50%);
1933
2418
  }
1934
2419
 
1935
2420
  /*.monaco-editor.vs [tabindex="0"]:focus {
@@ -1965,12 +2450,14 @@
1965
2450
  .monaco-scrollable-element.modified-in-monaco-diff-editor.vs .scrollbar { background: rgba(0,0,0,0); }
1966
2451
  .monaco-scrollable-element.modified-in-monaco-diff-editor.vs-dark .scrollbar { background: rgba(0,0,0,0); }
1967
2452
  .monaco-scrollable-element.modified-in-monaco-diff-editor.hc-black .scrollbar { background: none; }
2453
+ .monaco-scrollable-element.modified-in-monaco-diff-editor.hc-light .scrollbar { background: none; }
1968
2454
 
1969
2455
  .monaco-scrollable-element.modified-in-monaco-diff-editor .slider {
1970
2456
  z-index: 10;
1971
2457
  }
1972
2458
  .modified-in-monaco-diff-editor .slider.active { background: rgba(171, 171, 171, .4); }
1973
2459
  .modified-in-monaco-diff-editor.hc-black .slider.active { background: none; }
2460
+ .modified-in-monaco-diff-editor.hc-light .slider.active { background: none; }
1974
2461
 
1975
2462
  /* ---------- Diff ---------- */
1976
2463
 
@@ -1986,7 +2473,11 @@
1986
2473
  .monaco-editor.hc-black .insert-sign,
1987
2474
  .monaco-diff-editor.hc-black .insert-sign,
1988
2475
  .monaco-editor.hc-black .delete-sign,
1989
- .monaco-diff-editor.hc-black .delete-sign {
2476
+ .monaco-diff-editor.hc-black .delete-sign,
2477
+ .monaco-editor.hc-light .insert-sign,
2478
+ .monaco-diff-editor.hc-light .insert-sign,
2479
+ .monaco-editor.hc-light .delete-sign,
2480
+ .monaco-diff-editor.hc-light .delete-sign {
1990
2481
  opacity: 1;
1991
2482
  }
1992
2483
 
@@ -1997,6 +2488,15 @@
1997
2488
  text-align: right;
1998
2489
  }
1999
2490
 
2491
+ .monaco-editor .arrow-revert-change {
2492
+ z-index: 10;
2493
+ position: absolute;
2494
+ }
2495
+
2496
+ .monaco-editor .arrow-revert-change:hover {
2497
+ cursor: pointer;
2498
+ }
2499
+
2000
2500
  /* ---------- Inline Diff ---------- */
2001
2501
 
2002
2502
  .monaco-editor .view-zones .view-lines .view-line span {
@@ -2007,6 +2507,69 @@
2007
2507
  cursor: pointer;
2008
2508
  }
2009
2509
 
2510
+ .monaco-editor .char-insert, .monaco-diff-editor .char-insert {
2511
+ background-color: var(--vscode-diffEditor-insertedTextBackground);
2512
+ }
2513
+
2514
+ .monaco-editor .line-insert, .monaco-diff-editor .line-insert {
2515
+ background-color: var(--vscode-diffEditor-insertedLineBackground, --vscode-diffEditor-insertedTextBackground);
2516
+ }
2517
+
2518
+ .monaco-editor .line-insert,
2519
+ .monaco-editor .char-insert {
2520
+ box-sizing: border-box;
2521
+ border: 1px solid var(--vscode-diffEditor-insertedTextBorder);
2522
+ }
2523
+ .monaco-editor.hc-black .line-insert, .monaco-editor.hc-light .line-insert,
2524
+ .monaco-editor.hc-black .char-insert, .monaco-editor.hc-light .char-insert {
2525
+ border-style: dashed;
2526
+ }
2527
+
2528
+ .monaco-editor .line-delete,
2529
+ .monaco-editor .char-delete {
2530
+ box-sizing: border-box;
2531
+ border: 1px solid var(--vscode-diffEditor-removedTextBorder);
2532
+ }
2533
+ .monaco-editor.hc-black .line-delete, .monaco-editor.hc-light .line-delete,
2534
+ .monaco-editor.hc-black .char-delete, .monaco-editor.hc-light .char-delete {
2535
+ border-style: dashed;
2536
+ }
2537
+
2538
+ .monaco-editor .inline-added-margin-view-zone,
2539
+ .monaco-editor .gutter-insert, .monaco-diff-editor .gutter-insert {
2540
+ background-color: var(--vscode-diffEditorGutter-insertedLineBackground, --vscode-diffEditor-insertedLineBackground, --vscode-diffEditor-insertedTextBackground);
2541
+ }
2542
+
2543
+ .monaco-editor .char-delete, .monaco-diff-editor .char-delete {
2544
+ background-color: var(--vscode-diffEditor-removedTextBackground);
2545
+ }
2546
+
2547
+ .monaco-editor .line-delete, .monaco-diff-editor .line-delete {
2548
+ background-color: var(--vscode-diffEditor-removedLineBackground, --vscode-diffEditor-removedTextBackground);
2549
+ }
2550
+
2551
+ .monaco-editor .inline-deleted-margin-view-zone,
2552
+ .monaco-editor .gutter-delete, .monaco-diff-editor .gutter-delete {
2553
+ background-color: var(--vscode-diffEditorGutter-removedLineBackground, --vscode-diffEditor-removedLineBackground, --vscode-diffEditor-removedTextBackground);
2554
+ }
2555
+
2556
+ .monaco-diff-editor.side-by-side .editor.modified {
2557
+ box-shadow: -6px 0 5px -5px var(--vscode-scrollbar-shadow);
2558
+ border-left: 1px solid var(--vscode-diffEditor-border);
2559
+ }
2560
+
2561
+ .monaco-diff-editor .diffViewport {
2562
+ background: var(--vscode-scrollbarSlider-background);
2563
+ }
2564
+
2565
+ .monaco-diff-editor .diffViewport:hover {
2566
+ background: var(--vscode-scrollbarSlider-hoverBackground);
2567
+ }
2568
+
2569
+ .monaco-diff-editor .diffViewport:active {
2570
+ background: var(--vscode-scrollbarSlider-activeBackground);
2571
+ }
2572
+
2010
2573
  /*---------------------------------------------------------------------------------------------
2011
2574
  * Copyright (c) Microsoft Corporation. All rights reserved.
2012
2575
  * Licensed under the MIT License. See License.txt in the project root for license information.
@@ -2015,13 +2578,13 @@
2015
2578
  .monaco-diff-editor .diff-review-line-number {
2016
2579
  text-align: right;
2017
2580
  display: inline-block;
2581
+ color: var(--vscode-editorLineNumber-foreground);
2018
2582
  }
2019
2583
 
2020
2584
  .monaco-diff-editor .diff-review {
2021
2585
  position: absolute;
2022
2586
  user-select: none;
2023
2587
  -webkit-user-select: none;
2024
- -ms-user-select: none;
2025
2588
  }
2026
2589
 
2027
2590
  .monaco-diff-editor .diff-review-summary {
@@ -2030,6 +2593,7 @@
2030
2593
 
2031
2594
  .monaco-diff-editor .diff-review-shadow {
2032
2595
  position: absolute;
2596
+ box-shadow: var(--vscode-scrollbar-shadow) 0 -6px 6px -6px inset;
2033
2597
  }
2034
2598
 
2035
2599
  .monaco-diff-editor .diff-review-row {
@@ -2074,28 +2638,209 @@
2074
2638
  * Licensed under the MIT License. See License.txt in the project root for license information.
2075
2639
  *--------------------------------------------------------------------------------------------*/
2076
2640
 
2077
- .context-view .monaco-menu {
2078
- min-width: 130px;
2641
+ .context-view {
2642
+ position: absolute;
2079
2643
  }
2080
2644
 
2645
+ .context-view.fixed {
2646
+ all: initial;
2647
+ font-family: inherit;
2648
+ font-size: 13px;
2649
+ position: fixed;
2650
+ color: inherit;
2651
+ }
2081
2652
 
2082
2653
  /*---------------------------------------------------------------------------------------------
2083
2654
  * Copyright (c) Microsoft Corporation. All rights reserved.
2084
2655
  * Licensed under the MIT License. See License.txt in the project root for license information.
2085
2656
  *--------------------------------------------------------------------------------------------*/
2086
2657
 
2087
- .context-view {
2658
+ .quick-input-widget {
2659
+ font-size: 13px;
2660
+ }
2661
+
2662
+ .quick-input-widget .monaco-highlighted-label .highlight,
2663
+ .quick-input-widget .monaco-highlighted-label .highlight {
2664
+ color: #0066BF;
2665
+ }
2666
+
2667
+ .vs .quick-input-widget .monaco-list-row.focused .monaco-highlighted-label .highlight,
2668
+ .vs .quick-input-widget .monaco-list-row.focused .monaco-highlighted-label .highlight {
2669
+ color: #9DDDFF;
2670
+ }
2671
+
2672
+ .vs-dark .quick-input-widget .monaco-highlighted-label .highlight,
2673
+ .vs-dark .quick-input-widget .monaco-highlighted-label .highlight {
2674
+ color: #0097fb;
2675
+ }
2676
+
2677
+ .hc-black .quick-input-widget .monaco-highlighted-label .highlight,
2678
+ .hc-black .quick-input-widget .monaco-highlighted-label .highlight {
2679
+ color: #F38518;
2680
+ }
2681
+
2682
+ .hc-light .quick-input-widget .monaco-highlighted-label .highlight,
2683
+ .hc-light .quick-input-widget .monaco-highlighted-label .highlight {
2684
+ color: #0F4A85;
2685
+ }
2686
+
2687
+ .monaco-keybinding > .monaco-keybinding-key {
2688
+ background-color: rgba(221, 221, 221, 0.4);
2689
+ border: solid 1px rgba(204, 204, 204, 0.4);
2690
+ border-bottom-color: rgba(187, 187, 187, 0.4);
2691
+ box-shadow: inset 0 -1px 0 rgba(187, 187, 187, 0.4);
2692
+ color: #555;
2693
+ }
2694
+
2695
+ .hc-black .monaco-keybinding > .monaco-keybinding-key {
2696
+ background-color: transparent;
2697
+ border: solid 1px rgb(111, 195, 223);
2698
+ box-shadow: none;
2699
+ color: #fff;
2700
+ }
2701
+
2702
+ .hc-light .monaco-keybinding > .monaco-keybinding-key {
2703
+ background-color: transparent;
2704
+ border: solid 1px #0F4A85;
2705
+ box-shadow: none;
2706
+ color: #292929;
2707
+ }
2708
+
2709
+ .vs-dark .monaco-keybinding > .monaco-keybinding-key {
2710
+ background-color: rgba(128, 128, 128, 0.17);
2711
+ border: solid 1px rgba(51, 51, 51, 0.6);
2712
+ border-bottom-color: rgba(68, 68, 68, 0.6);
2713
+ box-shadow: inset 0 -1px 0 rgba(68, 68, 68, 0.6);
2714
+ color: #ccc;
2715
+ }
2716
+
2717
+ /*---------------------------------------------------------------------------------------------
2718
+ * Copyright (c) Microsoft Corporation. All rights reserved.
2719
+ * Licensed under the MIT License. See License.txt in the project root for license information.
2720
+ *--------------------------------------------------------------------------------------------*/
2721
+
2722
+ .monaco-split-view2 {
2723
+ position: relative;
2724
+ width: 100%;
2725
+ height: 100%;
2726
+ }
2727
+
2728
+ .monaco-split-view2 > .sash-container {
2088
2729
  position: absolute;
2089
- z-index: 2500;
2730
+ width: 100%;
2731
+ height: 100%;
2732
+ pointer-events: none;
2090
2733
  }
2091
2734
 
2092
- .context-view.fixed {
2093
- all: initial;
2094
- font-family: inherit;
2095
- font-size: 13px;
2096
- position: fixed;
2097
- z-index: 2500;
2098
- color: inherit;
2735
+ .monaco-split-view2 > .sash-container > .monaco-sash {
2736
+ pointer-events: initial;
2737
+ }
2738
+
2739
+ .monaco-split-view2 > .monaco-scrollable-element {
2740
+ width: 100%;
2741
+ height: 100%;
2742
+ }
2743
+
2744
+ .monaco-split-view2 > .monaco-scrollable-element > .split-view-container {
2745
+ width: 100%;
2746
+ height: 100%;
2747
+ white-space: nowrap;
2748
+ position: relative;
2749
+ }
2750
+
2751
+ .monaco-split-view2 > .monaco-scrollable-element > .split-view-container > .split-view-view {
2752
+ white-space: initial;
2753
+ position: absolute;
2754
+ }
2755
+
2756
+ .monaco-split-view2 > .monaco-scrollable-element > .split-view-container > .split-view-view:not(.visible) {
2757
+ display: none;
2758
+ }
2759
+
2760
+ .monaco-split-view2.vertical > .monaco-scrollable-element > .split-view-container > .split-view-view {
2761
+ width: 100%;
2762
+ }
2763
+
2764
+ .monaco-split-view2.horizontal > .monaco-scrollable-element > .split-view-container > .split-view-view {
2765
+ height: 100%;
2766
+ }
2767
+
2768
+ .monaco-split-view2.separator-border > .monaco-scrollable-element > .split-view-container > .split-view-view:not(:first-child)::before {
2769
+ content: ' ';
2770
+ position: absolute;
2771
+ top: 0;
2772
+ left: 0;
2773
+ z-index: 5;
2774
+ pointer-events: none;
2775
+ background-color: var(--separator-border);
2776
+ }
2777
+
2778
+ .monaco-split-view2.separator-border.horizontal > .monaco-scrollable-element > .split-view-container > .split-view-view:not(:first-child)::before {
2779
+ height: 100%;
2780
+ width: 1px;
2781
+ }
2782
+
2783
+ .monaco-split-view2.separator-border.vertical > .monaco-scrollable-element > .split-view-container > .split-view-view:not(:first-child)::before {
2784
+ height: 1px;
2785
+ width: 100%;
2786
+ }
2787
+
2788
+ /*---------------------------------------------------------------------------------------------
2789
+ * Copyright (c) Microsoft Corporation. All rights reserved.
2790
+ * Licensed under the MIT License. See License.txt in the project root for license information.
2791
+ *--------------------------------------------------------------------------------------------*/
2792
+
2793
+ .monaco-table {
2794
+ display: flex;
2795
+ flex-direction: column;
2796
+ position: relative;
2797
+ height: 100%;
2798
+ width: 100%;
2799
+ white-space: nowrap;
2800
+ overflow: hidden;
2801
+ }
2802
+
2803
+ .monaco-table > .monaco-split-view2 {
2804
+ border-bottom: 1px solid transparent;
2805
+ }
2806
+
2807
+ .monaco-table > .monaco-list {
2808
+ flex: 1;
2809
+ }
2810
+
2811
+ .monaco-table-tr {
2812
+ display: flex;
2813
+ height: 100%;
2814
+ }
2815
+
2816
+ .monaco-table-th {
2817
+ width: 100%;
2818
+ height: 100%;
2819
+ font-weight: bold;
2820
+ overflow: hidden;
2821
+ text-overflow: ellipsis;
2822
+ }
2823
+
2824
+ .monaco-table-th,
2825
+ .monaco-table-td {
2826
+ box-sizing: border-box;
2827
+ flex-shrink: 0;
2828
+ overflow: hidden;
2829
+ white-space: nowrap;
2830
+ text-overflow: ellipsis;
2831
+ }
2832
+
2833
+ .monaco-table > .monaco-split-view2 .monaco-sash.vertical::before {
2834
+ content: "";
2835
+ position: absolute;
2836
+ left: calc(var(--vscode-sash-size) / 2);
2837
+ width: 0;
2838
+ border-left: 1px solid transparent;
2839
+ }
2840
+
2841
+ .monaco-workbench:not(.reduce-motion) .monaco-table > .monaco-split-view2,
2842
+ .monaco-workbench:not(.reduce-motion) .monaco-table > .monaco-split-view2 .monaco-sash.vertical::before {
2843
+ transition: border-color 0.2s ease-out;
2099
2844
  }
2100
2845
 
2101
2846
  /*---------------------------------------------------------------------------------------------
@@ -2110,6 +2855,9 @@
2110
2855
  position: relative;
2111
2856
  }
2112
2857
 
2858
+ .monaco-tl-row.disabled {
2859
+ cursor: default;
2860
+ }
2113
2861
  .monaco-tl-indent {
2114
2862
  height: 100%;
2115
2863
  position: absolute;
@@ -2129,7 +2877,7 @@
2129
2877
  border-left: 1px solid transparent;
2130
2878
  }
2131
2879
 
2132
- .monaco-tl-indent > .indent-guide {
2880
+ .monaco-workbench:not(.reduce-motion) .monaco-tl-indent > .indent-guide {
2133
2881
  transition: border-color 0.1s linear;
2134
2882
  }
2135
2883
 
@@ -2147,7 +2895,6 @@
2147
2895
  display: flex !important;
2148
2896
  align-items: center;
2149
2897
  justify-content: center;
2150
- color: inherit !important;
2151
2898
  transform: translateX(3px);
2152
2899
  }
2153
2900
 
@@ -2169,137 +2916,222 @@
2169
2916
  animation: codicon-spin 1.25s steps(30) infinite;
2170
2917
  }
2171
2918
 
2919
+ .monaco-tree-type-filter {
2920
+ position: absolute;
2921
+ top: 0;
2922
+ display: flex;
2923
+ padding: 3px;
2924
+ max-width: 200px;
2925
+ z-index: 100;
2926
+ margin: 0 6px;
2927
+ border: 1px solid var(--vscode-widget-border);
2928
+ border-bottom-left-radius: 4px;
2929
+ border-bottom-right-radius: 4px;
2930
+ }
2931
+
2932
+ .monaco-workbench:not(.reduce-motion) .monaco-tree-type-filter {
2933
+ transition: top 0.3s;
2934
+ }
2935
+
2936
+ .monaco-tree-type-filter.disabled {
2937
+ top: -40px !important;
2938
+ }
2939
+
2940
+ .monaco-tree-type-filter-grab {
2941
+ display: flex !important;
2942
+ align-items: center;
2943
+ justify-content: center;
2944
+ cursor: grab;
2945
+ margin-right: 2px;
2946
+ }
2947
+
2948
+ .monaco-tree-type-filter-grab.grabbing {
2949
+ cursor: grabbing;
2950
+ }
2951
+
2952
+ .monaco-tree-type-filter-input {
2953
+ flex: 1;
2954
+ }
2955
+
2956
+ .monaco-tree-type-filter-input .monaco-inputbox {
2957
+ height: 23px;
2958
+ }
2959
+
2960
+ .monaco-tree-type-filter-input .monaco-inputbox > .ibwrapper > .input,
2961
+ .monaco-tree-type-filter-input .monaco-inputbox > .ibwrapper > .mirror {
2962
+ padding: 2px 4px;
2963
+ }
2964
+
2965
+ .monaco-tree-type-filter-input .monaco-findInput > .controls {
2966
+ top: 2px;
2967
+ }
2968
+
2969
+ .monaco-tree-type-filter-actionbar {
2970
+ margin-left: 4px;
2971
+ }
2972
+
2973
+ .monaco-tree-type-filter-actionbar .monaco-action-bar .action-label {
2974
+ padding: 2px;
2975
+ }
2976
+
2172
2977
  /*---------------------------------------------------------------------------------------------
2173
2978
  * Copyright (c) Microsoft Corporation. All rights reserved.
2174
2979
  * Licensed under the MIT License. See License.txt in the project root for license information.
2175
2980
  *--------------------------------------------------------------------------------------------*/
2176
2981
 
2177
- .monaco-table {
2982
+ .monaco-text-button {
2983
+ box-sizing: border-box;
2178
2984
  display: flex;
2179
- flex-direction: column;
2180
- position: relative;
2181
- height: 100%;
2182
2985
  width: 100%;
2183
- white-space: nowrap;
2986
+ padding: 4px;
2987
+ border-radius: 2px;
2988
+ text-align: center;
2989
+ cursor: pointer;
2990
+ justify-content: center;
2991
+ align-items: center;
2992
+ border: 1px solid var(--vscode-button-border, transparent);
2993
+ line-height: 18px;
2184
2994
  }
2185
2995
 
2186
- .monaco-table > .monaco-split-view2 {
2187
- border-bottom: 1px solid transparent;
2996
+ .monaco-text-button:focus {
2997
+ outline-offset: 2px !important;
2188
2998
  }
2189
2999
 
2190
- .monaco-table > .monaco-list {
2191
- flex: 1;
3000
+ .monaco-text-button:hover {
3001
+ text-decoration: none !important;
2192
3002
  }
2193
3003
 
2194
- .monaco-table-tr {
2195
- display: flex;
2196
- height: 100%;
3004
+ .monaco-button.disabled:focus,
3005
+ .monaco-button.disabled {
3006
+ opacity: 0.4 !important;
3007
+ cursor: default;
2197
3008
  }
2198
3009
 
2199
- .monaco-table-th {
2200
- width: 100%;
2201
- height: 100%;
2202
- font-weight: bold;
2203
- overflow: hidden;
2204
- text-overflow: ellipsis;
3010
+ .monaco-text-button .codicon {
3011
+ margin: 0 0.2em;
3012
+ color: inherit !important;
2205
3013
  }
2206
3014
 
2207
- .monaco-table-th,
2208
- .monaco-table-td {
2209
- box-sizing: border-box;
2210
- flex-shrink: 0;
3015
+ .monaco-text-button.monaco-text-button-with-short-label {
3016
+ flex-direction: row;
3017
+ flex-wrap: wrap;
3018
+ padding: 0 4px;
2211
3019
  overflow: hidden;
2212
- white-space: nowrap;
2213
- text-overflow: ellipsis;
3020
+ height: 28px;
2214
3021
  }
2215
3022
 
2216
- .monaco-table > .monaco-split-view2 .monaco-sash.vertical::before {
2217
- content: "";
2218
- position: absolute;
2219
- left: calc(var(--sash-size) / 2);
3023
+ .monaco-text-button.monaco-text-button-with-short-label > .monaco-button-label {
3024
+ flex-basis: 100%;
3025
+ }
3026
+
3027
+ .monaco-text-button.monaco-text-button-with-short-label > .monaco-button-label-short {
3028
+ flex-grow: 1;
2220
3029
  width: 0;
2221
- border-left: 1px solid transparent;
3030
+ overflow: hidden;
2222
3031
  }
2223
3032
 
2224
- .monaco-table > .monaco-split-view2,
2225
- .monaco-table > .monaco-split-view2 .monaco-sash.vertical::before {
2226
- transition: border-color 0.2s ease-out;
3033
+ .monaco-text-button.monaco-text-button-with-short-label > .monaco-button-label,
3034
+ .monaco-text-button.monaco-text-button-with-short-label > .monaco-button-label-short {
3035
+ display: flex;
3036
+ justify-content: center;
3037
+ align-items: center;
3038
+ font-weight: normal;
3039
+ font-style: inherit;
3040
+ padding: 4px 0;
2227
3041
  }
2228
- /*
2229
- .monaco-table:hover > .monaco-split-view2,
2230
- .monaco-table:hover > .monaco-split-view2 .monaco-sash.vertical::before {
2231
- border-color: rgba(204, 204, 204, 0.2);
2232
- } */
2233
3042
 
2234
- /*---------------------------------------------------------------------------------------------
2235
- * Copyright (c) Microsoft Corporation. All rights reserved.
2236
- * Licensed under the MIT License. See License.txt in the project root for license information.
2237
- *--------------------------------------------------------------------------------------------*/
3043
+ .monaco-button-dropdown {
3044
+ display: flex;
3045
+ cursor: pointer;
3046
+ }
2238
3047
 
2239
- .monaco-split-view2 {
2240
- position: relative;
2241
- width: 100%;
2242
- height: 100%;
3048
+ .monaco-button-dropdown.disabled {
3049
+ cursor: default;
2243
3050
  }
2244
3051
 
2245
- .monaco-split-view2 > .sash-container {
2246
- position: absolute;
2247
- width: 100%;
2248
- height: 100%;
2249
- pointer-events: none;
3052
+ .monaco-button-dropdown > .monaco-button:focus {
3053
+ outline-offset: -1px !important;
2250
3054
  }
2251
3055
 
2252
- .monaco-split-view2 > .sash-container > .monaco-sash {
2253
- pointer-events: initial;
3056
+ .monaco-button-dropdown.disabled > .monaco-button.disabled,
3057
+ .monaco-button-dropdown.disabled > .monaco-button.disabled:focus,
3058
+ .monaco-button-dropdown.disabled > .monaco-button-dropdown-separator {
3059
+ opacity: 0.4 !important;
2254
3060
  }
2255
3061
 
2256
- .monaco-split-view2 > .monaco-scrollable-element {
2257
- width: 100%;
2258
- height: 100%;
3062
+ .monaco-button-dropdown > .monaco-button.monaco-text-button {
3063
+ border-right-width: 0 !important;
2259
3064
  }
2260
3065
 
2261
- .monaco-split-view2 > .monaco-scrollable-element > .split-view-container {
2262
- width: 100%;
3066
+ .monaco-button-dropdown .monaco-button-dropdown-separator {
3067
+ padding: 4px 0;
3068
+ cursor: default;
3069
+ }
3070
+
3071
+ .monaco-button-dropdown .monaco-button-dropdown-separator > div {
2263
3072
  height: 100%;
2264
- white-space: nowrap;
2265
- position: relative;
3073
+ width: 1px;
2266
3074
  }
2267
3075
 
2268
- .monaco-split-view2 > .monaco-scrollable-element > .split-view-container > .split-view-view {
2269
- white-space: initial;
2270
- position: absolute;
3076
+ .monaco-button-dropdown > .monaco-button.monaco-dropdown-button {
3077
+ border: 1px solid var(--vscode-button-border, transparent);
3078
+ border-left-width: 0 !important;
3079
+ border-radius: 0 2px 2px 0;
2271
3080
  }
2272
3081
 
2273
- .monaco-split-view2 > .monaco-scrollable-element > .split-view-container > .split-view-view:not(.visible) {
2274
- display: none;
3082
+ .monaco-button-dropdown > .monaco-button.monaco-text-button {
3083
+ border-radius: 2px 0 0 2px;
2275
3084
  }
2276
3085
 
2277
- .monaco-split-view2.vertical > .monaco-scrollable-element > .split-view-container > .split-view-view {
2278
- width: 100%;
3086
+ .monaco-description-button {
3087
+ display: flex;
3088
+ flex-direction: column;
3089
+ align-items: center;
3090
+ margin: 4px 5px; /* allows button focus outline to be visible */
2279
3091
  }
2280
3092
 
2281
- .monaco-split-view2.horizontal > .monaco-scrollable-element > .split-view-container > .split-view-view {
2282
- height: 100%;
3093
+ .monaco-description-button .monaco-button-description {
3094
+ font-style: italic;
3095
+ font-size: 11px;
3096
+ padding: 4px 20px;
2283
3097
  }
2284
3098
 
2285
- .monaco-split-view2.separator-border > .monaco-scrollable-element > .split-view-container > .split-view-view:not(:first-child)::before {
2286
- content: ' ';
2287
- position: absolute;
2288
- top: 0;
2289
- left: 0;
2290
- z-index: 5;
2291
- pointer-events: none;
2292
- background-color: var(--separator-border);
3099
+ .monaco-description-button .monaco-button-label,
3100
+ .monaco-description-button .monaco-button-description {
3101
+ display: flex;
3102
+ justify-content: center;
3103
+ align-items: center;
2293
3104
  }
2294
3105
 
2295
- .monaco-split-view2.separator-border.horizontal > .monaco-scrollable-element > .split-view-container > .split-view-view:not(:first-child)::before {
2296
- height: 100%;
2297
- width: 1px;
3106
+ .monaco-description-button .monaco-button-label > .codicon,
3107
+ .monaco-description-button .monaco-button-description > .codicon {
3108
+ margin: 0 0.2em;
3109
+ color: inherit !important;
2298
3110
  }
2299
3111
 
2300
- .monaco-split-view2.separator-border.vertical > .monaco-scrollable-element > .split-view-container > .split-view-view:not(:first-child)::before {
2301
- height: 1px;
2302
- width: 100%;
3112
+ /*---------------------------------------------------------------------------------------------
3113
+ * Copyright (c) Microsoft Corporation. All rights reserved.
3114
+ * Licensed under the MIT License. See License.txt in the project root for license information.
3115
+ *--------------------------------------------------------------------------------------------*/
3116
+
3117
+ .monaco-count-badge {
3118
+ padding: 3px 6px;
3119
+ border-radius: 11px;
3120
+ font-size: 11px;
3121
+ min-width: 18px;
3122
+ min-height: 18px;
3123
+ line-height: 11px;
3124
+ font-weight: normal;
3125
+ text-align: center;
3126
+ display: inline-block;
3127
+ box-sizing: border-box;
3128
+ }
3129
+
3130
+ .monaco-count-badge.long {
3131
+ padding: 2px 3px;
3132
+ border-radius: 2px;
3133
+ min-height: auto;
3134
+ line-height: normal;
2303
3135
  }
2304
3136
 
2305
3137
  /*---------------------------------------------------------------------------------------------
@@ -2307,48 +3139,63 @@
2307
3139
  * Licensed under the MIT License. See License.txt in the project root for license information.
2308
3140
  *--------------------------------------------------------------------------------------------*/
2309
3141
 
2310
- .quick-input-widget {
2311
- font-size: 13px;
3142
+ .monaco-progress-container {
3143
+ width: 100%;
3144
+ height: 5px;
3145
+ overflow: hidden; /* keep progress bit in bounds */
2312
3146
  }
2313
3147
 
2314
- .quick-input-widget .monaco-highlighted-label .highlight,
2315
- .quick-input-widget .monaco-highlighted-label .highlight {
2316
- color: #0066BF;
3148
+ .monaco-progress-container .progress-bit {
3149
+ width: 2%;
3150
+ height: 5px;
3151
+ position: absolute;
3152
+ left: 0;
3153
+ display: none;
2317
3154
  }
2318
3155
 
2319
- .vs-dark .quick-input-widget .monaco-highlighted-label .highlight,
2320
- .vs-dark .quick-input-widget .monaco-highlighted-label .highlight {
2321
- color: #0097fb;
3156
+ .monaco-progress-container.active .progress-bit {
3157
+ display: inherit;
2322
3158
  }
2323
3159
 
2324
- .hc-black .quick-input-widget .monaco-highlighted-label .highlight,
2325
- .hc-black .quick-input-widget .monaco-highlighted-label .highlight {
2326
- color: #F38518;
3160
+ .monaco-progress-container.discrete .progress-bit {
3161
+ left: 0;
3162
+ transition: width 100ms linear;
2327
3163
  }
2328
3164
 
2329
- .monaco-keybinding > .monaco-keybinding-key {
2330
- background-color: rgba(221, 221, 221, 0.4);
2331
- border: solid 1px rgba(204, 204, 204, 0.4);
2332
- border-bottom-color: rgba(187, 187, 187, 0.4);
2333
- box-shadow: inset 0 -1px 0 rgba(187, 187, 187, 0.4);
2334
- color: #555;
3165
+ .monaco-progress-container.discrete.done .progress-bit {
3166
+ width: 100%;
2335
3167
  }
2336
3168
 
2337
- .hc-black .monaco-keybinding > .monaco-keybinding-key {
2338
- background-color: transparent;
2339
- border: solid 1px rgb(111, 195, 223);
2340
- box-shadow: none;
2341
- color: #fff;
3169
+ .monaco-progress-container.infinite .progress-bit {
3170
+ animation-name: progress;
3171
+ animation-duration: 4s;
3172
+ animation-iteration-count: infinite;
3173
+ transform: translate3d(0px, 0px, 0px);
3174
+ animation-timing-function: linear;
2342
3175
  }
2343
3176
 
2344
- .vs-dark .monaco-keybinding > .monaco-keybinding-key {
2345
- background-color: rgba(128, 128, 128, 0.17);
2346
- border: solid 1px rgba(51, 51, 51, 0.6);
2347
- border-bottom-color: rgba(68, 68, 68, 0.6);
2348
- box-shadow: inset 0 -1px 0 rgba(68, 68, 68, 0.6);
2349
- color: #ccc;
3177
+ .monaco-progress-container.infinite.infinite-long-running .progress-bit {
3178
+ /*
3179
+ The more smooth `linear` timing function can cause
3180
+ higher GPU consumption as indicated in
3181
+ https://github.com/microsoft/vscode/issues/97900 &
3182
+ https://github.com/microsoft/vscode/issues/138396
3183
+ */
3184
+ animation-timing-function: steps(100);
2350
3185
  }
2351
3186
 
3187
+ /**
3188
+ * The progress bit has a width: 2% (1/50) of the parent container. The animation moves it from 0% to 100% of
3189
+ * that container. Since translateX is relative to the progress bit size, we have to multiple it with
3190
+ * its relative size to the parent container:
3191
+ * parent width: 5000%
3192
+ * bit width: 100%
3193
+ * translateX should be as follow:
3194
+ * 50%: 5000% * 50% - 50% (set to center) = 2450%
3195
+ * 100%: 5000% * 100% - 100% (do not overflow) = 4900%
3196
+ */
3197
+ @keyframes progress { from { transform: translateX(0%) scaleX(1) } 50% { transform: translateX(2500%) scaleX(3) } to { transform: translateX(4900%) scaleX(1) } }
3198
+
2352
3199
  /*---------------------------------------------------------------------------------------------
2353
3200
  * Copyright (c) Microsoft Corporation. All rights reserved.
2354
3201
  * Licensed under the MIT License. See License.txt in the project root for license information.
@@ -2357,15 +3204,18 @@
2357
3204
  .quick-input-widget {
2358
3205
  position: absolute;
2359
3206
  width: 600px;
2360
- z-index: 2000;
2361
- padding: 0 1px 6px 1px;
3207
+ z-index: 2550;
2362
3208
  left: 50%;
2363
3209
  margin-left: -300px;
3210
+ -webkit-app-region: no-drag;
3211
+ border-radius: 6px;
2364
3212
  }
2365
3213
 
2366
3214
  .quick-input-titlebar {
2367
3215
  display: flex;
2368
3216
  align-items: center;
3217
+ border-top-left-radius: 5px; /* match border radius of quick input widget */
3218
+ border-top-right-radius: 5px;
2369
3219
  }
2370
3220
 
2371
3221
  .quick-input-left-action-bar {
@@ -2377,6 +3227,8 @@
2377
3227
  .quick-input-title {
2378
3228
  padding: 3px 0px;
2379
3229
  text-align: center;
3230
+ text-overflow: ellipsis;
3231
+ overflow: hidden;
2380
3232
  }
2381
3233
 
2382
3234
  .quick-input-right-action-bar {
@@ -2405,8 +3257,7 @@
2405
3257
 
2406
3258
  .quick-input-header {
2407
3259
  display: flex;
2408
- padding: 6px 6px 0px 6px;
2409
- margin-bottom: -2px;
3260
+ padding: 8px 6px 6px 6px;
2410
3261
  }
2411
3262
 
2412
3263
  .quick-input-widget.hidden-input .quick-input-header {
@@ -2419,6 +3270,7 @@
2419
3270
  display: flex;
2420
3271
  flex-direction: column;
2421
3272
  flex-grow: 1;
3273
+ min-width: 0;
2422
3274
  position: relative;
2423
3275
  }
2424
3276
 
@@ -2471,13 +3323,14 @@
2471
3323
  font-size: 11px;
2472
3324
  padding: 0 6px;
2473
3325
  display: flex;
2474
- height: 27.5px;
3326
+ height: 25px;
2475
3327
  align-items: center;
2476
3328
  }
2477
3329
 
2478
3330
  .quick-input-message {
2479
3331
  margin-top: -1px;
2480
- padding: 5px 5px 2px 5px;
3332
+ padding: 5px;
3333
+ overflow-wrap: break-word;
2481
3334
  }
2482
3335
 
2483
3336
  .quick-input-message > .codicon {
@@ -2485,6 +3338,11 @@
2485
3338
  vertical-align: text-bottom;
2486
3339
  }
2487
3340
 
3341
+ /* Links in descriptions & validations */
3342
+ .quick-input-message a {
3343
+ color: inherit;
3344
+ }
3345
+
2488
3346
  .quick-input-progress.monaco-progress-container {
2489
3347
  position: relative;
2490
3348
  }
@@ -2496,16 +3354,21 @@
2496
3354
 
2497
3355
  .quick-input-list {
2498
3356
  line-height: 22px;
2499
- margin-top: 6px;
2500
3357
  }
2501
3358
 
2502
3359
  .quick-input-widget.hidden-input .quick-input-list {
2503
- margin-top: 0; /* reduce margins when input box hidden */
3360
+ margin-top: 4px; /* reduce margins when input box hidden */
3361
+ padding-bottom: 4px;
2504
3362
  }
2505
3363
 
2506
3364
  .quick-input-list .monaco-list {
2507
3365
  overflow: hidden;
2508
3366
  max-height: calc(20 * 22px);
3367
+ padding-bottom: 5px;
3368
+ }
3369
+
3370
+ .quick-input-list .monaco-scrollable-element {
3371
+ padding: 0px 5px;
2509
3372
  }
2510
3373
 
2511
3374
  .quick-input-list .quick-input-list-entry {
@@ -2521,7 +3384,11 @@
2521
3384
  border-top-style: solid;
2522
3385
  }
2523
3386
 
2524
- .quick-input-list .monaco-list-row:first-child .quick-input-list-entry.quick-input-list-separator-border {
3387
+ .quick-input-list .monaco-list-row {
3388
+ border-radius: 3px;
3389
+ }
3390
+
3391
+ .quick-input-list .monaco-list-row[data-index="0"] .quick-input-list-entry.quick-input-list-separator-border {
2525
3392
  border-top-style: none;
2526
3393
  }
2527
3394
 
@@ -2569,10 +3436,10 @@
2569
3436
  }
2570
3437
 
2571
3438
  .quick-input-list .quick-input-list-rows > .quick-input-list-row .codicon[class*='codicon-'] {
2572
- vertical-align: sub;
3439
+ vertical-align: text-bottom;
2573
3440
  }
2574
3441
 
2575
- .quick-input-list .quick-input-list-rows .monaco-highlighted-label span {
3442
+ .quick-input-list .quick-input-list-rows .monaco-highlighted-label > span {
2576
3443
  opacity: 1;
2577
3444
  }
2578
3445
 
@@ -2592,7 +3459,7 @@
2592
3459
  }
2593
3460
 
2594
3461
  .quick-input-list .quick-input-list-entry .quick-input-list-separator {
2595
- margin-right: 8px; /* separate from keybindings or actions */
3462
+ margin-right: 4px; /* separate from keybindings or actions */
2596
3463
  }
2597
3464
 
2598
3465
  .quick-input-list .quick-input-list-entry-action-bar {
@@ -2611,7 +3478,7 @@
2611
3478
 
2612
3479
  .quick-input-list .quick-input-list-entry-action-bar .action-label.codicon {
2613
3480
  margin-right: 4px;
2614
- padding: 2px;
3481
+ padding: 0px 2px 2px 2px;
2615
3482
  }
2616
3483
 
2617
3484
  .quick-input-list .quick-input-list-entry-action-bar {
@@ -2628,6 +3495,15 @@
2628
3495
  display: flex;
2629
3496
  }
2630
3497
 
3498
+ /* focused items in quick pick */
3499
+ .quick-input-list .monaco-list-row.focused .monaco-keybinding-key,
3500
+ .quick-input-list .monaco-list-row.focused .quick-input-list-entry .quick-input-list-separator {
3501
+ color: inherit
3502
+ }
3503
+ .quick-input-list .monaco-list-row.focused .monaco-keybinding-key {
3504
+ background: none;
3505
+ }
3506
+
2631
3507
  /*---------------------------------------------------------------------------------------------
2632
3508
  * Copyright (c) Microsoft Corporation. All rights reserved.
2633
3509
  * Licensed under the MIT License. See License.txt in the project root for license information.
@@ -2666,248 +3542,4 @@
2666
3542
  width: 6px;
2667
3543
  }
2668
3544
 
2669
- /*---------------------------------------------------------------------------------------------
2670
- * Copyright (c) Microsoft Corporation. All rights reserved.
2671
- * Licensed under the MIT License. See License.txt in the project root for license information.
2672
- *--------------------------------------------------------------------------------------------*/
2673
-
2674
- .monaco-inputbox {
2675
- position: relative;
2676
- display: block;
2677
- padding: 0;
2678
- box-sizing: border-box;
2679
-
2680
- /* Customizable */
2681
- font-size: inherit;
2682
- }
2683
-
2684
- .monaco-inputbox.idle {
2685
- border: 1px solid transparent;
2686
- }
2687
-
2688
- .monaco-inputbox > .ibwrapper > .input,
2689
- .monaco-inputbox > .ibwrapper > .mirror {
2690
-
2691
- /* Customizable */
2692
- padding: 4px;
2693
- }
2694
-
2695
- .monaco-inputbox > .ibwrapper {
2696
- position: relative;
2697
- width: 100%;
2698
- height: 100%;
2699
- }
2700
-
2701
- .monaco-inputbox > .ibwrapper > .input {
2702
- display: inline-block;
2703
- box-sizing: border-box;
2704
- width: 100%;
2705
- height: 100%;
2706
- line-height: inherit;
2707
- border: none;
2708
- font-family: inherit;
2709
- font-size: inherit;
2710
- resize: none;
2711
- color: inherit;
2712
- }
2713
-
2714
- .monaco-inputbox > .ibwrapper > input {
2715
- text-overflow: ellipsis;
2716
- }
2717
-
2718
- .monaco-inputbox > .ibwrapper > textarea.input {
2719
- display: block;
2720
- -ms-overflow-style: none; /* IE 10+: hide scrollbars */
2721
- scrollbar-width: none; /* Firefox: hide scrollbars */
2722
- outline: none;
2723
- }
2724
-
2725
- .monaco-inputbox > .ibwrapper > textarea.input::-webkit-scrollbar {
2726
- display: none; /* Chrome + Safari: hide scrollbar */
2727
- }
2728
-
2729
- .monaco-inputbox > .ibwrapper > textarea.input.empty {
2730
- white-space: nowrap;
2731
- }
2732
-
2733
- .monaco-inputbox > .ibwrapper > .mirror {
2734
- position: absolute;
2735
- display: inline-block;
2736
- width: 100%;
2737
- top: 0;
2738
- left: 0;
2739
- box-sizing: border-box;
2740
- white-space: pre-wrap;
2741
- visibility: hidden;
2742
- word-wrap: break-word;
2743
- }
2744
-
2745
- /* Context view */
2746
-
2747
- .monaco-inputbox-container {
2748
- text-align: right;
2749
- }
2750
-
2751
- .monaco-inputbox-container .monaco-inputbox-message {
2752
- display: inline-block;
2753
- overflow: hidden;
2754
- text-align: left;
2755
- width: 100%;
2756
- box-sizing: border-box;
2757
- padding: 0.4em;
2758
- font-size: 12px;
2759
- line-height: 17px;
2760
- margin-top: -1px;
2761
- word-wrap: break-word;
2762
- }
2763
-
2764
- /* Action bar support */
2765
- .monaco-inputbox .monaco-action-bar {
2766
- position: absolute;
2767
- right: 2px;
2768
- top: 4px;
2769
- }
2770
-
2771
- .monaco-inputbox .monaco-action-bar .action-item {
2772
- margin-left: 2px;
2773
- }
2774
-
2775
- .monaco-inputbox .monaco-action-bar .action-item .codicon {
2776
- background-repeat: no-repeat;
2777
- width: 16px;
2778
- height: 16px;
2779
- }
2780
-
2781
- /*---------------------------------------------------------------------------------------------
2782
- * Copyright (c) Microsoft Corporation. All rights reserved.
2783
- * Licensed under the MIT License. See License.txt in the project root for license information.
2784
- *--------------------------------------------------------------------------------------------*/
2785
-
2786
- .monaco-count-badge {
2787
- padding: 3px 6px;
2788
- border-radius: 11px;
2789
- font-size: 11px;
2790
- min-width: 18px;
2791
- min-height: 18px;
2792
- line-height: 11px;
2793
- font-weight: normal;
2794
- text-align: center;
2795
- display: inline-block;
2796
- box-sizing: border-box;
2797
- }
2798
-
2799
- .monaco-count-badge.long {
2800
- padding: 2px 3px;
2801
- border-radius: 2px;
2802
- min-height: auto;
2803
- line-height: normal;
2804
- }
2805
-
2806
- /*---------------------------------------------------------------------------------------------
2807
- * Copyright (c) Microsoft Corporation. All rights reserved.
2808
- * Licensed under the MIT License. See License.txt in the project root for license information.
2809
- *--------------------------------------------------------------------------------------------*/
2810
-
2811
- .monaco-progress-container {
2812
- width: 100%;
2813
- height: 5px;
2814
- overflow: hidden; /* keep progress bit in bounds */
2815
- }
2816
-
2817
- .monaco-progress-container .progress-bit {
2818
- width: 2%;
2819
- height: 5px;
2820
- position: absolute;
2821
- left: 0;
2822
- display: none;
2823
- }
2824
-
2825
- .monaco-progress-container.active .progress-bit {
2826
- display: inherit;
2827
- }
2828
-
2829
- .monaco-progress-container.discrete .progress-bit {
2830
- left: 0;
2831
- transition: width 100ms linear;
2832
- }
2833
-
2834
- .monaco-progress-container.discrete.done .progress-bit {
2835
- width: 100%;
2836
- }
2837
-
2838
- .monaco-progress-container.infinite .progress-bit {
2839
- animation-name: progress;
2840
- animation-duration: 4s;
2841
- animation-iteration-count: infinite;
2842
- animation-timing-function: linear;
2843
- transform: translate3d(0px, 0px, 0px);
2844
- }
2845
-
2846
- /**
2847
- * The progress bit has a width: 2% (1/50) of the parent container. The animation moves it from 0% to 100% of
2848
- * that container. Since translateX is relative to the progress bit size, we have to multiple it with
2849
- * its relative size to the parent container:
2850
- * parent width: 5000%
2851
- * bit width: 100%
2852
- * translateX should be as follow:
2853
- * 50%: 5000% * 50% - 50% (set to center) = 2450%
2854
- * 100%: 5000% * 100% - 100% (do not overflow) = 4900%
2855
- */
2856
- @keyframes progress { from { transform: translateX(0%) scaleX(1) } 50% { transform: translateX(2500%) scaleX(3) } to { transform: translateX(4900%) scaleX(1) } }
2857
-
2858
- /*---------------------------------------------------------------------------------------------
2859
- * Copyright (c) Microsoft Corporation. All rights reserved.
2860
- * Licensed under the MIT License. See License.txt in the project root for license information.
2861
- *--------------------------------------------------------------------------------------------*/
2862
-
2863
- .monaco-text-button {
2864
- box-sizing: border-box;
2865
- display: flex;
2866
- width: 100%;
2867
- padding: 4px;
2868
- text-align: center;
2869
- cursor: pointer;
2870
- justify-content: center;
2871
- align-items: center;
2872
- }
2873
-
2874
- .monaco-text-button:focus {
2875
- outline-offset: 2px !important;
2876
- }
2877
-
2878
- .monaco-text-button:hover {
2879
- text-decoration: none !important;
2880
- }
2881
-
2882
- .monaco-button.disabled:focus,
2883
- .monaco-button.disabled {
2884
- opacity: 0.4 !important;
2885
- cursor: default;
2886
- }
2887
-
2888
- .monaco-text-button > .codicon {
2889
- margin: 0 0.2em;
2890
- color: inherit !important;
2891
- }
2892
-
2893
- .monaco-button-dropdown {
2894
- display: flex;
2895
- }
2896
-
2897
- .monaco-button-dropdown > .monaco-dropdown-button {
2898
- margin-left: 1px;
2899
- }
2900
-
2901
- .monaco-description-button {
2902
- flex-direction: column;
2903
- }
2904
-
2905
- .monaco-description-button .monaco-button-label {
2906
- font-weight: 500;
2907
- }
2908
-
2909
- .monaco-description-button .monaco-button-description {
2910
- font-style: italic;
2911
- }
2912
-
2913
3545