CoCalc -- notebook.css

GitHub Repository: microsoft/vscode
Path: blob/main/src/vs/workbench/contrib/notebook/browser/media/notebook.css
³²⁹⁶ views
1
/*---------------------------------------------------------------------------------------------
2
 *  Copyright (c) Microsoft Corporation. All rights reserved.
3
 *  Licensed under the MIT License. See License.txt in the project root for license information.
4
 *--------------------------------------------------------------------------------------------*/
5

6
.monaco-workbench .notebookOverlay.notebook-editor {
7
	box-sizing: border-box;
8
	line-height: 22px;
9
	user-select: initial;
10
	-webkit-user-select: initial;
11
	position: relative;
12
}
13

14
.monaco-workbench .notebookOverlay.notebook-editor .monaco-editor {
15
	line-height: 1.4em;
16
}
17

18
.monaco-workbench .notebookOverlay .cell-list-container > .monaco-list {
19
	position: absolute;
20
}
21

22
.monaco-workbench .notebookOverlay .cell-list-container .monaco-list-rows {
23
	min-height: 100%;
24
	overflow: visible !important;
25
}
26

27
.monaco-workbench .notebookOverlay .cell-list-container .overflowingContentWidgets > div {
28
	white-space: normal;
29
}
30

31
.monaco-workbench .notebookOverlay .cell-list-container .overflowingContentWidgets > div {
32
	/* @rebornix: larger than the editor title bar */
33
	z-index: 600 !important;
34
}
35

36

37
.monaco-workbench .notebookOverlay .cell-list-container .overflowingContentWidgets > div.parameter-hints-widget {
38
	z-index: 639 !important;
39
}
40

41
.monaco-workbench .notebookOverlay .cell-list-container .overflowingContentWidgets > div.suggest-widget {
42
	z-index: 640 !important;
43
}
44

45
.monaco-workbench .notebookOverlay .cell-list-container .overflowingContentWidgets > div .suggest-details-container {
46
	z-index: 641 !important;
47
}
48

49
.monaco-workbench .notebookOverlay .cell-list-container .monaco-editor .zone-widget.interactive-editor-widget .interactive-editor .markdownMessage {
50
	white-space: normal;
51
}
52

53
.monaco-workbench .notebookOverlay .cell-list-container {
54
	position: relative;
55
}
56

57
.monaco-workbench .notebookOverlay.global-drag-active .webview {
58
	pointer-events: none;
59
}
60

61
.monaco-workbench .notebookOverlay .cell-list-container .webview-cover {
62
	position: absolute;
63
	top: 0;
64
}
65

66
.monaco-workbench .notebookOverlay > .cell-list-container > .monaco-list > .monaco-scrollable-element > .monaco-list-rows > .monaco-list-row {
67
	cursor: default;
68
	overflow: visible !important;
69
	width: 100%;
70
}
71

72
.monaco-workbench .notebookOverlay > .cell-list-container > .notebook-gutter > .monaco-list > .monaco-scrollable-element > .monaco-list-rows > .monaco-list-row {
73
	cursor: default;
74
	overflow: visible !important;
75
	width: 100%;
76
}
77

78
.monaco-workbench .notebookOverlay > .cell-list-container > .monaco-list > .monaco-scrollable-element > .monaco-list-rows > .monaco-list-row .cell {
79
	display: flex;
80
	position: relative;
81
}
82

83

84
.monaco-workbench .notebookOverlay > .cell-list-container > .monaco-list > .monaco-scrollable-element > .monaco-list-rows > .monaco-list-row .menu {
85
	position: absolute;
86
	left: 0;
87
	top: 28px;
88
	visibility: hidden;
89
	width: 16px;
90
	margin: auto;
91
	padding-left: 4px;
92
}
93

94

95
.monaco-workbench .notebookOverlay > .cell-list-container > .monaco-list > .monaco-scrollable-element > .monaco-list-rows > .monaco-list-row .menu.mouseover,
96
.monaco-workbench .notebookOverlay > .cell-list-container > .monaco-list > .monaco-scrollable-element > .monaco-list-rows > .monaco-list-row:hover .menu,
97
.monaco-workbench .notebookOverlay > .cell-list-container > .monaco-list > .monaco-scrollable-element > .monaco-list-rows > .monaco-list-row .cell-output-hover .menu {
98
	visibility: visible;
99
}
100

101
.monaco-workbench .notebookOverlay > .cell-list-container > .monaco-list > .monaco-scrollable-element > .monaco-list-rows > .monaco-list-row,
102
.monaco-workbench .notebookOverlay > .cell-list-container > .monaco-list > .monaco-scrollable-element > .monaco-list-rows > .monaco-list-row:hover,
103
.monaco-workbench .notebookOverlay > .cell-list-container > .monaco-list > .monaco-scrollable-element > .monaco-list-rows > .monaco-list-row .cell-output-hover {
104
	outline: none !important;
105
}
106

107
.monaco-workbench .notebookOverlay > .cell-list-container > .monaco-list > .monaco-scrollable-element > .monaco-list-rows > .monaco-list-row.focused {
108
	outline: none !important;
109
}
110

111
.monaco-workbench .notebookOverlay > .cell-list-container > .monaco-list > .monaco-scrollable-element > .monaco-list-rows > .monaco-list-row .input-collapse-container {
112
	display: flex;
113
	align-items: center;
114
	position: relative;
115
	box-sizing: border-box;
116
	width: 100%;
117
}
118

119
.monaco-workbench .notebookOverlay > .cell-list-container > .monaco-list > .monaco-scrollable-element > .monaco-list-rows > .monaco-list-row .input-collapse-container .collapsed-execution-icon {
120
	line-height: normal;
121
	margin-left: 6px;
122
}
123

124
.monaco-workbench .notebookOverlay > .cell-list-container > .monaco-list > .monaco-scrollable-element > .monaco-list-rows > .monaco-list-row .input-collapse-container .collapsed-execution-icon .codicon-notebook-state-success {
125
	color: var(--vscode-notebookStatusSuccessIcon-foreground);
126
}
127

128
.monaco-workbench .notebookOverlay > .cell-list-container > .monaco-list > .monaco-scrollable-element > .monaco-list-rows > .monaco-list-row .input-collapse-container .collapsed-execution-icon .codicon-notebook-state-error {
129
	color: var(--vscode-notebookStatusErrorIcon-foreground);
130
}
131

132
.monaco-workbench .notebookOverlay > .cell-list-container > .monaco-list > .monaco-scrollable-element > .monaco-list-rows > .monaco-list-row .input-collapse-container .cell-collapse-preview {
133
	padding: 0px 8px;
134
	display: flex;
135
	align-items: center;
136
}
137
.monaco-workbench .notebookOverlay > .cell-list-container > .monaco-list > .monaco-scrollable-element > .monaco-list-rows > .monaco-list-row .input-collapse-container .cell-collapse-preview .monaco-tokenized-source {
138
	font-size: var(--notebook-cell-input-preview-font-size);
139
	font-family: var(--notebook-cell-input-preview-font-family);
140
	cursor: pointer;
141
	white-space: normal;
142
	overflow: hidden;
143
}
144

145
.monaco-workbench .notebookOverlay > .cell-list-container > .monaco-list > .monaco-scrollable-element > .monaco-list-rows > .monaco-list-row .input-collapse-container .cell-collapse-preview .expandInputIcon {
146
	padding: 2px;
147
	border-radius: 5px;
148
	height: 16px;
149
	width: 16px;
150

151
	cursor: pointer;
152
	z-index: var(--z-index-notebook-input-collapse-condicon);
153
}
154

155
.monaco-workbench .notebookOverlay > .cell-list-container > .monaco-list > .monaco-scrollable-element > .monaco-list-rows > .monaco-list-row .input-collapse-container .cell-collapse-preview .expandInputIcon:before {
156
	color: grey;
157
	font-size: 12px;
158
	line-height: 16px;
159
	vertical-align: bottom;
160
}
161

162
.monaco-workbench .notebookOverlay > .cell-list-container > .monaco-list > .monaco-scrollable-element > .monaco-list-rows > .monaco-list-row .output-collapse-container {
163
	cursor: pointer;
164
}
165

166
.monaco-workbench .notebookOverlay > .cell-list-container > .monaco-list > .monaco-scrollable-element > .monaco-list-rows > .monaco-list-row .output-collapse-container .expandOutputPlaceholder {
167
	font-style: italic;
168
	font-size: var(--notebook-cell-output-font-size);
169
	font-family: var(--monaco-monospace-font);
170
	min-height: 24px;
171
	opacity: 0.7;
172
	user-select: none;
173
}
174

175
.monaco-workbench .notebookOverlay > .cell-list-container > .monaco-list > .monaco-scrollable-element > .monaco-list-rows > .monaco-list-row .output-collapse-container .expandOutputIcon {
176
	position: relative;
177
	left: 0px;
178
	padding: 2px;
179
	border-radius: 5px;
180
	vertical-align:middle;
181
	margin-left: 4px;
182
	height: 16px;
183
	width: 16px;
184
}
185

186
.monaco-workbench .notebookOverlay > .cell-list-container > .monaco-list > .monaco-scrollable-element > .monaco-list-rows > .monaco-list-row .cell-expand-part-button {
187
	position: relative;
188
	left: 0px;
189
	padding: 2px;
190
	border-radius: 5px;
191
	vertical-align: middle;
192
	margin-left: 4px;
193
	height: 16px;
194
	width: 16px;
195
	z-index: var(--z-index-notebook-cell-expand-part-button);
196
}
197

198
.monaco-workbench .notebookOverlay > .cell-list-container > .monaco-list > .monaco-scrollable-element > .monaco-list-rows > .monaco-list-row .output-collapse-container .expandOutputIcon:before {
199
	color: grey;
200
	font-size: 12px;
201
	line-height: 16px;
202
	vertical-align: bottom;
203
}
204

205
.monaco-workbench .notebookOverlay > .cell-list-container > .monaco-list > .monaco-scrollable-element > .monaco-list-rows > .monaco-list-row .cell-expand-part-button:before {
206
	color: grey;
207
	font-size: 12px;
208
	line-height: 16px;
209
	vertical-align: bottom;
210
}
211

212
.monaco-workbench.hc-black .notebookOverlay .monaco-list-row.focused .cell-editor-focus .cell-editor-part:before,
213
.monaco-workbench.hc-light .notebookOverlay .monaco-list-row.focused .cell-editor-focus .cell-editor-part:before {
214
	outline-style: dashed;
215
}
216

217
.monaco-workbench .notebookOverlay > .cell-list-container > .monaco-list > .monaco-scrollable-element > .monaco-list-rows > .monaco-list-row .menu.mouseover,
218
.monaco-workbench .notebookOverlay > .cell-list-container > .monaco-list > .monaco-scrollable-element > .monaco-list-rows > .monaco-list-row .menu:hover {
219
	cursor: pointer;
220
}
221

222
.monaco-workbench .notebookOverlay > .cell-list-container > .monaco-list > .monaco-scrollable-element > .monaco-list-rows > .monaco-list-row .run-button-container {
223
	position: absolute;
224
	flex-shrink: 0;
225
	z-index: var(--z-index-run-button-container);
226
	width: 35px;
227
	left: -35px;
228
}
229

230
.monaco-workbench .notebookOverlay > .cell-list-container > .monaco-list > .monaco-scrollable-element > .monaco-list-rows > .monaco-list-row .run-button-container .monaco-toolbar {
231
	visibility: hidden;
232
	height: initial;
233
}
234

235
.monaco-workbench .notebookOverlay > .cell-list-container > .monaco-list > .monaco-scrollable-element > .monaco-list-rows > .monaco-list-row .run-button-container .monaco-toolbar .action-item:not(.monaco-dropdown-with-primary) .codicon {
236
	padding: 6px;
237
}
238

239
.monaco-workbench .notebookOverlay > .cell-list-container > .monaco-list > .monaco-scrollable-element > .monaco-list-rows > .monaco-list-row .run-button-container .monaco-toolbar .actions-container {
240
	justify-content: center;
241
}
242

243
.monaco-workbench .notebookOverlay > .cell-list-container > .monaco-list > .monaco-scrollable-element > .monaco-list-rows > .monaco-list-row:hover .run-button-container .monaco-toolbar,
244
.monaco-workbench .notebookOverlay > .cell-list-container > .monaco-list > .monaco-scrollable-element > .monaco-list-rows > .monaco-list-row.focused .run-button-container .monaco-toolbar,
245
.monaco-workbench .notebookOverlay > .cell-list-container > .monaco-list > .monaco-scrollable-element > .monaco-list-rows > .monaco-list-row .cell-run-toolbar-dropdown-active .run-button-container .monaco-toolbar,
246
.monaco-workbench .notebookOverlay > .cell-list-container > .monaco-list > .monaco-scrollable-element > .monaco-list-rows > .monaco-list-row .cell-output-hover .run-button-container .monaco-toolbar {
247
	visibility: visible;
248
}
249

250
.monaco-workbench .notebookOverlay > .cell-list-container > .monaco-list > .monaco-scrollable-element > .monaco-list-rows > .monaco-list-row .execution-count-label {
251
	position: absolute;
252
	font-size: 10px;
253
	font-family: var(--monaco-monospace-font);
254
	white-space: pre;
255
	box-sizing: border-box;
256
	opacity: .7;
257
	width: 35px;
258
	right: 0px;
259
	text-align: center;
260
}
261

262
.monaco-workbench .notebookOverlay > .cell-list-container > .monaco-list > .monaco-scrollable-element > .monaco-list-rows > .monaco-list-row .cell-statusbar-hidden .execution-count-label {
263
	line-height: 15px;
264
}
265

266
.monaco-workbench .notebookOverlay > .cell-list-container > .monaco-list > .monaco-scrollable-element > .monaco-list-rows > .monaco-list-row .execution-count-label .codicon {
267
	font-size: 14px;
268
}
269

270
.monaco-workbench .notebookOverlay .cell .cell-editor-part {
271
	position: relative;
272
}
273

274
.monaco-workbench .notebookOverlay .cell .monaco-progress-container {
275
	top: -3px;
276
	position: absolute;
277
	left: 0;
278
	z-index: var(--z-index-notebook-progress-bar);
279
}
280

281
.monaco-workbench .notebookOverlay > .cell-list-container > .monaco-list:not(.element-focused):focus:before {
282
	outline: none !important;
283
}
284

285
.monaco-workbench .notebookOverlay.notebook-editor > .cell-list-container > .monaco-list > .monaco-scrollable-element > .scrollbar.visible {
286
	z-index: var(--z-index-notebook-scrollbar);
287
	cursor: default;
288
}
289

290
.monaco-workbench .notebookOverlay .monaco-list-row .cell-editor-part:before {
291
	z-index: var(--z-index-notebook-cell-editor-outline);
292
	content: "";
293
	right: 0px;
294
	left: 0px;
295
	top: 0px;
296
	bottom: 0px;
297
	outline-offset: -1px;
298
	display: block;
299
	position: absolute;
300
	pointer-events: none;
301
}
302

303
.monaco-workbench .notebookOverlay .monaco-list .monaco-list-row .cell-insertion-indicator-top {
304
	top: -15px;
305
}
306

307
.monaco-workbench .notebookOverlay > .cell-list-container > .cell-list-insertion-indicator {
308
	position: absolute;
309
	height: 2px;
310
	left: 0px;
311
	right: 0px;
312
	opacity: 0;
313
	z-index: var(--z-index-notebook-list-insertion-indicator);
314
}
315

316
/** Theming */
317

318
.monaco-action-bar .action-item.verticalSeparator {
319
	width: 1px !important;
320
	height: 16px !important;
321
	margin: 5px 4px !important;
322
	cursor: default;
323
	min-width: 1px !important;
324
}
325

326
.monaco-workbench .notebookOverlay .monaco-list .monaco-list-row .cell-decoration {
327
	top: -6px;
328
	position: absolute;
329
	display: flex;
330
}
331

332

333
.cell-contributed-items.cell-contributed-items-left {
334
	margin-left: 4px;
335
}
336

337
.cell-contributed-items.cell-contributed-items-right {
338
	flex-direction: row-reverse;
339
}
340

341
.monaco-workbench .notebookOverlay > .cell-list-container .notebook-overview-ruler-container {
342
	position: absolute;
343
	top: 0;
344
	right: 0;
345
}
346

347
/* high contrast border for multi-select */
348
.hc-black .notebookOverlay .monaco-list.selection-multiple:focus-within .monaco-list-row.selected:not(.focused) .cell-focus-indicator-top:before, .hc-light .notebookOverlay .monaco-list.selection-multiple:focus-within .monaco-list-row.selected:not(.focused) .cell-focus-indicator-top:before { border-top-style: dotted; }
349
.hc-black .notebookOverlay .monaco-list.selection-multiple:focus-within .monaco-list-row.selected:not(.focused) .cell-focus-indicator-bottom:before, .hc-light .notebookOverlay .monaco-list.selection-multiple:focus-within .monaco-list-row.selected:not(.focused) .cell-focus-indicator-bottom:before { border-bottom-style: dotted; }
350
.hc-black .notebookOverlay .monaco-list.selection-multiple:focus-within .monaco-list-row.selected:not(.focused) .cell-inner-container:not(.cell-editor-focus) .cell-focus-indicator-left:before, .hc-light .notebookOverlay .monaco-list.selection-multiple:focus-within .monaco-list-row.selected:not(.focused) .cell-inner-container:not(.cell-editor-focus) .cell-focus-indicator-left:before { border-left-style: dotted; }
351
.hc-black .notebookOverlay .monaco-list.selection-multiple:focus-within .monaco-list-row.selected:not(.focused) .cell-inner-container:not(.cell-editor-focus) .cell-focus-indicator-right:before, .hc-light .notebookOverlay .monaco-list.selection-multiple:focus-within .monaco-list-row.selected:not(.focused) .cell-inner-container:not(.cell-editor-focus) .cell-focus-indicator-right:before  { border-right-style: dotted; }
352

353
/** Notebook Cell Comments */
354

355
.cell-comment-container.review-widget {
356
	border-left: 1px solid var(--vscode-peekView-border); border-right: 1px solid var(--vscode-peekView-border);
357
	/* Restore text-wrap to default value to avoid inheriting nowrap from monaco-list. */
358
	text-wrap: initial;
359
}
360

361
.cell-comment-container.review-widget > .head {
362
	border-top: 1px solid var(--vscode-peekView-border);
363
}
364

365
.cell-comment-container.review-widget > .body {
366
	border-bottom: 1px solid var(--vscode-peekView-border);
367
}
368

369
.cell-comment-container.review-widget {
370
	background-color: var(--vscode-peekViewResult-background);
371
}
372

373

374
/** Notebook editor background */
375
.notebookOverlay .cell-drag-image .cell-editor-container > div {
376
	background: var(--vscode-editor-background) !important;
377
}
378
.notebookOverlay .monaco-list-row .cell-title-toolbar,
379
.notebookOverlay .monaco-list-row.cell-drag-image,
380
.notebookOverlay .cell-bottom-toolbar-container .action-item,
381
.notebookOverlay .cell-list-top-cell-toolbar-container .action-item {
382
	background-color: var(--vscode-editor-background);
383
}
384

385
.monaco-workbench .notebookOverlay.notebook-editor {
386
	background-color: var(--vscode-notebook-editorBackground);
387
}
388

389
.notebookOverlay .cell .monaco-editor-background,
390
.notebookOverlay .cell .margin-view-overlays,
391
.notebookOverlay .cell .cell-statusbar-container {
392
	background: var(--vscode-notebook-cellEditorBackground, var(--vscode-editor-background));
393
}
394

395
/** Cell toolbar separator */
396

397
.notebookOverlay .monaco-list-row .cell-title-toolbar,
398
.notebookOverlay .cell-bottom-toolbar-container .action-item,
399
.notebookOverlay .cell-list-top-cell-toolbar-container .action-item {
400
	border: solid 1px var(--vscode-notebook-cellToolbarSeparator);
401
}
402
.notebookOverlay .monaco-action-bar .action-item.verticalSeparator {
403
	background-color: var(--vscode-notebook-cellToolbarSeparator);
404
}
405
.monaco-workbench .notebookOverlay > .cell-list-container > .monaco-list > .monaco-scrollable-element > .monaco-list-rows > .monaco-list-row .input-collapse-container {
406
	border-bottom: solid 1px var(--vscode-notebook-cellToolbarSeparator);
407
}
408

409
/** Focused cell background */
410

411
.notebookOverlay .code-cell-row.focused .cell-focus-indicator,
412
.notebookOverlay .markdown-cell-row.focused,
413
.notebookOverlay .code-cell-row.focused .input-collapse-container {
414
	background-color: var(--vscode-notebook-focusedCellBackground) !important;
415
}
416

417
/** Selected cell background */
418
.notebookOverlay .monaco-list.selection-multiple .markdown-cell-row.selected,
419
.notebookOverlay .monaco-list.selection-multiple .markdown-cell-row.selected .cell-focus-indicator-bottom,
420
.notebookOverlay .monaco-list.selection-multiple .code-cell-row.selected .cell-focus-indicator-top,
421
.notebookOverlay .monaco-list.selection-multiple .code-cell-row.selected .cell-focus-indicator-left,
422
.notebookOverlay .monaco-list.selection-multiple .code-cell-row.selected .cell-focus-indicator-right,
423
.notebookOverlay .monaco-list.selection-multiple .code-cell-row.selected .cell-focus-indicator-bottom {
424
	background-color: var(--vscode-notebook-selectedCellBackground, inherit) !important;
425
}
426

427
.notebookOverlay .monaco-list.selection-multiple:focus-within .monaco-list-row.selected .cell-focus-indicator-top:before,
428
.notebookOverlay .monaco-list.selection-multiple:focus-within .monaco-list-row.selected .cell-focus-indicator-bottom:before,
429
.notebookOverlay .monaco-list.selection-multiple:focus-within .monaco-list-row.selected .cell-inner-container:not(.cell-editor-focus) .cell-focus-indicator-left:before,
430
.notebookOverlay .monaco-list.selection-multiple:focus-within .monaco-list-row.selected .cell-inner-container:not(.cell-editor-focus) .cell-focus-indicator-right:before {
431
	border-color: var(--vscode-notebook-inactiveSelectedCellBorder, transparent) !important;
432
}
433

434
/** Cell hover background */
435
.notebookOverlay .code-cell-row:not(.focused):hover .cell-focus-indicator,
436
.notebookOverlay .code-cell-row:not(.focused).cell-output-hover .cell-focus-indicator,
437
.notebookOverlay .markdown-cell-row:not(.focused):hover {
438
	background-color: var(--vscode-notebook-cellHoverBackground) !important;
439
}
440

441
.notebookOverlay .code-cell-row:not(.focused):hover .input-collapse-container,
442
.notebookOverlay .code-cell-row:not(.focused).cell-output-hover .input-collapse-container {
443
	background-color: var(--vscode-notebook-cellHoverBackground);
444
}
445

446
/** Cell symbol higlight */
447
.monaco-workbench .notebookOverlay .monaco-list .monaco-list-row.code-cell-row.nb-symbolHighlight .cell-focus-indicator,
448
.monaco-workbench .notebookOverlay .monaco-list .monaco-list-row.markdown-cell-row.nb-symbolHighlight {
449
	background-color: var(--vscode-notebook-symbolHighlightBackground) !important;
450
}
451

452
/** Cell execution inline vars */
453
.nb-inline-value {
454
	background-color: var(--vscode-editorInlayHint-background);
455
	color: var(--vscode-editorInlayHint-foreground) !important;
456
	font-size: 90%;
457
}
458

459
/** Notebook Textual Selection Highlight */
460
.nb-selection-highlight {
461
	background-color: var(--vscode-editor-selectionHighlightBackground);
462
}
463

464
/** Cell Multi-Cursor Cursor highlight */
465
/* -- base selection styling -- */
466
.nb-multicursor-selection {
467
	top: 0;
468
	min-width: 1.9px;
469
	background-color: var(--vscode-editor-selectionBackground);
470

471
	/* unsure about these two */
472
	overflow: hidden;
473
	box-sizing: border-box;
474
}
475
/* -- base cursor styling -- */
476
.nb-multicursor-cursor {
477
	top: 0;
478
	min-width: 1.9px;
479
	/* z-index: 10000000; */
480
	background-color: #AEAFAD;
481

482
	/* unsure about these two */
483
	overflow: hidden;
484
	box-sizing: border-box;
485
}
486
/* ======================================================================== */
487
/* ======================================================================== */
488
/* -- block-style -- */
489
.nb-cursor-block-style {
490
	width: 8px !important;
491
}
492
/* -- underline-style -- */
493
.nb-cursor-underline-style {
494
	width: 8px !important;
495
	border-bottom-width: 2px;
496
	border-bottom-style: solid;
497
	background: transparent;
498
}
499
/* -- line-thin-style -- */
500
.nb-cursor-line-thin-style {
501
	min-width: none;
502
	width: 0.9px !important;
503
}
504
/* -- block-outline-style -- */
505
.nb-cursor-block-outline-style {
506
	width: 8px !important;
507
	border-width: 1px;
508
	border-style: solid;
509
	background: transparent;
510
}
511
/* -- underline-thin-style -- */
512
.nb-cursor-underline-thin-style {
513
	width: 8px !important;
514
	border-bottom-width: 1px;
515
	border-bottom-style: solid;
516
	background: transparent;
517
}
518
/* ======================================================================== */
519
/* ======================================================================== */
520
/* -- cursor animations -- */
521
.nb-blink {
522
	animation: nb-cursor-blink 1s step-end infinite;
523
}
524
.nb-smooth {
525
	animation: nb-cursor-smooth 0.5s ease-in-out 0.5s infinite alternate;
526
}
527
.nb-phase {
528
	animation: nb-cursor-phase 0.5s ease-in-out 0.5s infinite alternate;
529
}
530
.nb-expand{
531
	animation: nb-cursor-expand 0.5s ease-in-out 0.5s infinite alternate;
532
}
533
.nb-smooth-caret-animation {
534
	transition: all 80ms;
535
}
536

537
/* -- animation keyframes -- */
538
@keyframes nb-cursor-blink {
539
	0% {
540
		opacity: 1;
541
	}
542
	50% {
543
		opacity: 0;
544
	}
545
	100% {
546
		opacity: 1;
547
	}
548
}
549
@keyframes nb-cursor-smooth {
550
	0%,
551
	20% {
552
		opacity: 1;
553
	}
554
	60%,
555
	100% {
556
		opacity: 0;
557
	}
558
}
559
@keyframes nb-cursor-phase {
560
	0%,
561
	20% {
562
		opacity: 1;
563
	}
564
	90%,
565
	100% {
566
		opacity: 0;
567
	}
568
}
569
@keyframes nb-cursor-expand {
570
	0%,
571
	20% {
572
		transform: scaleY(1);
573
	}
574
	80%,
575
	100% {
576
		transform: scaleY(0);
577
	}
578
}
579

580
/** Cell Search Range selection highlight */
581
.monaco-workbench .notebookOverlay .monaco-list .monaco-list-row.code-cell-row.nb-multiCellHighlight .cell-focus-indicator,
582
.monaco-workbench .notebookOverlay .monaco-list .monaco-list-row.markdown-cell-row.nb-multiCellHighlight {
583
	background-color: var(--vscode-notebook-symbolHighlightBackground) !important;
584
}
585

586
/** Cell focused editor border */
587
.notebookOverlay .monaco-list:focus-within .monaco-list-row.focused .cell-editor-focus .cell-editor-part:before {
588
	outline: solid 1px var(--vscode-notebook-focusedEditorBorder);
589
}
590

591
/** Cell border color */
592
.notebookOverlay .cell.markdown h1 { border-color: var(--vscode-notebook-cellBorderColor); }
593
.notebookOverlay .monaco-list-row .cell-editor-part:before { outline: solid 1px var(--vscode-notebook-cellBorderColor); }
594

595
/** Cell status bar */
596
.monaco-workbench .notebookOverlay .cell-statusbar-container .cell-language-picker:hover,
597
.monaco-workbench .notebookOverlay .cell-statusbar-container .cell-status-item.cell-status-item-has-command:hover {
598
	background-color: var(--vscode-notebook-cellStatusBarItemHoverBackground);
599
}
600

601
/** Insert toolbar */
602
.notebookOverlay > .cell-list-container > .cell-list-insertion-indicator {
603
	background-color: var(--vscode-notebook-cellInsertionIndicator);
604
}
605

606
/** Scrollbar */
607
.notebookOverlay .cell-list-container > .monaco-list > .monaco-scrollable-element > .scrollbar > .slider {
608
	background: var(--vscode-notebookScrollbarSlider-background);
609
}
610

611
.notebookOverlay .cell-list-container > .monaco-list > .monaco-scrollable-element > .scrollbar > .slider:hover {
612
	background: var(--vscode-notebookScrollbarSlider-hoverBackground);
613
}
614

615
.notebookOverlay .cell-list-container > .monaco-list > .monaco-scrollable-element > .scrollbar > .slider.active {
616
	background: var(--vscode-notebookScrollbarSlider-activeBackground);
617
}
618

619
/** Cell expand */
620
.monaco-workbench .notebookOverlay > .cell-list-container > .monaco-list > .monaco-scrollable-element > .monaco-list-rows > .monaco-list-row .expandInputIcon:hover,
621
.monaco-workbench .notebookOverlay > .cell-list-container > .monaco-list > .monaco-scrollable-element > .monaco-list-rows > .monaco-list-row .expandOutputIcon:hover,
622
.monaco-workbench .notebookOverlay > .cell-list-container > .monaco-list > .monaco-scrollable-element > .monaco-list-rows > .monaco-list-row .cell-expand-part-button:hover {
623
	background-color: var(--vscode-toolbar-hoverBackground);
624
}
625

626
/** Cell insertion/deletion */
627
.monaco-workbench .notebookOverlay .monaco-list .monaco-list-row.code-cell-row.nb-cell-modified .cell-focus-indicator {
628
	background-color: var(--vscode-editorGutter-modifiedBackground) !important;
629
}
630

631
.monaco-workbench .notebookOverlay .monaco-list .monaco-list-row.markdown-cell-row.nb-cell-modified {
632
	background-color: var(--vscode-editorGutter-modifiedBackground) !important;
633
}
634

635
.monaco-workbench .notebookOverlay .monaco-list .monaco-list-row.code-cell-row.nb-cell-added .cell-focus-indicator {
636
	background-color: var(--vscode-diffEditor-insertedTextBackground) !important;
637
}
638

639
.monaco-workbench .notebookOverlay .monaco-list .monaco-list-row.markdown-cell-row.nb-cell-added {
640
	background-color: var(--vscode-diffEditor-insertedTextBackground) !important;
641
}
642

643
.monaco-workbench .notebookOverlay .monaco-list .monaco-list-row.code-cell-row.nb-cell-deleted .cell-focus-indicator {
644
	background-color: var(--vscode-diffEditor-removedTextBackground) !important;
645
}
646

647
.monaco-workbench .notebookOverlay .monaco-list .monaco-list-row.markdown-cell-row.nb-cell-deleted {
648
	background-color: var(--vscode-diffEditor-removedTextBackground) !important;
649
}
650

651
.monaco-workbench .notebookOverlay .codicon-debug-continue { color: var(--vscode-icon-foreground) !important; }
652

653
/** Cell Chat **/
654
.monaco-workbench .notebookOverlay .monaco-list .monaco-list-row.code-cell-row.nb-chatGenerationHighlight .cell-focus-indicator,
655
.monaco-workbench .notebookOverlay .monaco-list .monaco-list-row.markdown-cell-row.nb-chatGenerationHighlight {
656
	background-color: var(--vscode-notebook-selectedCellBackground) !important;
657
}
658

659
Product

Resources

Company
