@echothink-ui/developer 0.1.0

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.
Files changed (56) hide show
  1. package/README.md +5 -0
  2. package/dist/components/APIExplorer.d.ts +2 -0
  3. package/dist/components/BranchSelector.d.ts +2 -0
  4. package/dist/components/CodeBlock.d.ts +2 -0
  5. package/dist/components/CodeEditor.d.ts +2 -0
  6. package/dist/components/CommitList.d.ts +2 -0
  7. package/dist/components/DiffTable.d.ts +2 -0
  8. package/dist/components/DiffViewer.d.ts +2 -0
  9. package/dist/components/EventPayloadViewer.d.ts +2 -0
  10. package/dist/components/GitRepositoryPanel.d.ts +2 -0
  11. package/dist/components/JSONViewer.d.ts +2 -0
  12. package/dist/components/LogConsole.d.ts +2 -0
  13. package/dist/components/PullRequestPanel.d.ts +2 -0
  14. package/dist/components/RequestResponseViewer.d.ts +2 -0
  15. package/dist/components/SchemaViewer.d.ts +2 -0
  16. package/dist/components/TerminalPanel.d.ts +2 -0
  17. package/dist/components/TraceTimeline.d.ts +2 -0
  18. package/dist/components/WebhookEventViewer.d.ts +2 -0
  19. package/dist/components/YAMLViewer.d.ts +2 -0
  20. package/dist/components/devUtils.d.ts +10 -0
  21. package/dist/components/types.d.ts +196 -0
  22. package/dist/index.cjs +2627 -0
  23. package/dist/index.cjs.map +1 -0
  24. package/dist/index.css +3651 -0
  25. package/dist/index.css.map +1 -0
  26. package/dist/index.d.ts +22 -0
  27. package/dist/index.js +2572 -0
  28. package/dist/index.js.map +1 -0
  29. package/package.json +43 -0
  30. package/src/components/APIExplorer.tsx +205 -0
  31. package/src/components/BranchSelector.tsx +54 -0
  32. package/src/components/CodeBlock.tsx +127 -0
  33. package/src/components/CodeEditor.tsx +95 -0
  34. package/src/components/CommitList.tsx +100 -0
  35. package/src/components/DiffTable.tsx +288 -0
  36. package/src/components/DiffViewer.tsx +145 -0
  37. package/src/components/EventPayloadViewer.tsx +91 -0
  38. package/src/components/GitRepositoryPanel.tsx +73 -0
  39. package/src/components/JSONViewer.tsx +189 -0
  40. package/src/components/LogConsole.tsx +160 -0
  41. package/src/components/PullRequestPanel.test.tsx +52 -0
  42. package/src/components/PullRequestPanel.tsx +215 -0
  43. package/src/components/RequestResponseViewer.test.tsx +45 -0
  44. package/src/components/RequestResponseViewer.tsx +169 -0
  45. package/src/components/SchemaViewer.tsx +157 -0
  46. package/src/components/TerminalPanel.test.tsx +33 -0
  47. package/src/components/TerminalPanel.tsx +134 -0
  48. package/src/components/TraceTimeline.test.tsx +63 -0
  49. package/src/components/TraceTimeline.tsx +207 -0
  50. package/src/components/WebhookEventViewer.test.tsx +57 -0
  51. package/src/components/WebhookEventViewer.tsx +184 -0
  52. package/src/components/YAMLViewer.tsx +207 -0
  53. package/src/components/devUtils.ts +81 -0
  54. package/src/components/types.ts +230 -0
  55. package/src/index.tsx +72 -0
  56. package/src/styles.css +4296 -0
package/src/styles.css ADDED
@@ -0,0 +1,4296 @@
1
+ @import "@echothink-ui/core/styles.css";
2
+
3
+ .eth-dev-branch-selector {
4
+ color: var(--eth-color-text-primary);
5
+ font-family: var(--eth-font-family);
6
+ inline-size: min(100%, 24rem);
7
+ }
8
+
9
+ .eth-dev-branch-selector .cds--label {
10
+ color: var(--eth-color-text-secondary);
11
+ font-size: calc(0.75rem * var(--eth-text-scale, 1));
12
+ font-weight: 600;
13
+ letter-spacing: 0;
14
+ line-height: 1.333;
15
+ margin-block-end: var(--eth-space-sm);
16
+ }
17
+
18
+ .eth-dev-branch-selector .cds--form__helper-text {
19
+ color: var(--eth-color-text-secondary);
20
+ font-size: calc(0.75rem * var(--eth-text-scale, 1));
21
+ line-height: 1.333;
22
+ margin-block-start: var(--eth-space-xs);
23
+ }
24
+
25
+ .eth-dev-branch-selector .cds--select {
26
+ inline-size: 100%;
27
+ }
28
+
29
+ .eth-dev-branch-selector .cds--select-input {
30
+ background: var(--eth-color-layer-02);
31
+ border-block-end-color: var(--eth-color-border-strong);
32
+ color: var(--eth-color-text-primary);
33
+ font-family: var(--eth-font-mono);
34
+ }
35
+
36
+ .eth-dev-branch-selector .cds--select-input:hover {
37
+ background: var(--eth-color-layer-03);
38
+ }
39
+
40
+ .eth-dev-branch-selector .cds--select-input:focus {
41
+ outline: 2px solid var(--eth-color-focus);
42
+ outline-offset: -2px;
43
+ }
44
+
45
+ .eth-dev-branch-selector--empty .cds--select-input,
46
+ .eth-dev-branch-selector .cds--select-input:disabled {
47
+ color: #8d8d8d;
48
+ }
49
+
50
+ .eth-dev-diff-table {
51
+ background: var(--eth-color-layer-01);
52
+ border: 1px solid var(--eth-color-border-subtle);
53
+ color: var(--eth-color-text-primary);
54
+ display: grid;
55
+ font-family: var(--eth-font-family);
56
+ inline-size: 100%;
57
+ min-inline-size: 0;
58
+ }
59
+
60
+ .eth-dev-diff-table__header {
61
+ align-items: start;
62
+ background: var(--eth-color-layer-01);
63
+ border-block-end: 1px solid var(--eth-color-border-subtle);
64
+ display: grid;
65
+ gap: var(--eth-space-lg);
66
+ grid-template-columns: minmax(0, 1fr) auto;
67
+ min-inline-size: 0;
68
+ padding: var(--eth-space-lg);
69
+ }
70
+
71
+ .eth-dev-diff-table__heading {
72
+ display: grid;
73
+ gap: var(--eth-space-xs);
74
+ min-inline-size: 0;
75
+ }
76
+
77
+ .eth-dev-diff-table__heading h3,
78
+ .eth-dev-diff-table__heading p,
79
+ .eth-dev-diff-table__summary,
80
+ .eth-dev-diff-table__summary dt,
81
+ .eth-dev-diff-table__summary dd {
82
+ margin: 0;
83
+ }
84
+
85
+ .eth-dev-diff-table__heading h3 {
86
+ color: var(--eth-color-text-primary);
87
+ font-size: calc(1rem * var(--eth-text-scale, 1));
88
+ font-weight: 600;
89
+ line-height: 1.375;
90
+ overflow: hidden;
91
+ text-overflow: ellipsis;
92
+ white-space: nowrap;
93
+ }
94
+
95
+ .eth-dev-diff-table__heading p {
96
+ color: var(--eth-color-text-secondary);
97
+ font-size: calc(0.75rem * var(--eth-text-scale, 1));
98
+ line-height: 1.333;
99
+ }
100
+
101
+ .eth-dev-diff-table__summary {
102
+ display: grid;
103
+ gap: 1px;
104
+ grid-template-columns: repeat(3, minmax(4.75rem, auto));
105
+ min-inline-size: 0;
106
+ }
107
+
108
+ .eth-dev-diff-table__summary div {
109
+ background: var(--eth-color-layer-02);
110
+ border: 1px solid var(--eth-color-border-subtle);
111
+ display: grid;
112
+ gap: var(--eth-space-2xs);
113
+ min-inline-size: 0;
114
+ padding: var(--eth-space-sm) var(--eth-space-md);
115
+ }
116
+
117
+ .eth-dev-diff-table__summary dt {
118
+ color: var(--eth-color-text-secondary);
119
+ font-size: calc(0.6875rem * var(--eth-text-scale, 1));
120
+ font-weight: 600;
121
+ line-height: 1.45;
122
+ text-transform: uppercase;
123
+ }
124
+
125
+ .eth-dev-diff-table__summary dd {
126
+ color: var(--eth-color-text-primary);
127
+ font-family: var(--eth-font-mono);
128
+ font-size: calc(0.875rem * var(--eth-text-scale, 1));
129
+ font-weight: 600;
130
+ line-height: 1.4286;
131
+ }
132
+
133
+ .eth-dev-diff-table__summary .eth-dev-diff-table__summary-value--added {
134
+ color: var(--eth-color-success);
135
+ }
136
+
137
+ .eth-dev-diff-table__summary .eth-dev-diff-table__summary-value--removed {
138
+ color: var(--eth-color-danger);
139
+ }
140
+
141
+ .eth-dev-diff-table__viewport {
142
+ background: var(--eth-color-layer-01);
143
+ inline-size: 100%;
144
+ min-inline-size: 0;
145
+ overflow: auto;
146
+ }
147
+
148
+ .eth-dev-diff-table__table {
149
+ border-collapse: collapse;
150
+ inline-size: 100%;
151
+ min-inline-size: 44rem;
152
+ table-layout: fixed;
153
+ }
154
+
155
+ .eth-dev-diff-table__caption {
156
+ block-size: 1px;
157
+ clip-path: inset(50%);
158
+ inline-size: 1px;
159
+ overflow: hidden;
160
+ position: absolute;
161
+ white-space: nowrap;
162
+ }
163
+
164
+ .eth-dev-diff-table__table th,
165
+ .eth-dev-diff-table__table td {
166
+ border-block-end: 1px solid var(--eth-color-border-subtle);
167
+ font-size: calc(0.875rem * var(--eth-text-scale, 1));
168
+ line-height: 1.4286;
169
+ min-inline-size: 0;
170
+ padding: var(--eth-space-sm) var(--eth-space-lg);
171
+ text-align: start;
172
+ vertical-align: middle;
173
+ }
174
+
175
+ .eth-dev-diff-table__table thead th {
176
+ background: var(--eth-color-layer-02);
177
+ color: var(--eth-color-text-secondary);
178
+ font-size: calc(0.75rem * var(--eth-text-scale, 1));
179
+ font-weight: 600;
180
+ letter-spacing: 0;
181
+ line-height: 1.333;
182
+ }
183
+
184
+ .eth-dev-diff-table__table thead th:first-child {
185
+ inline-size: 38%;
186
+ }
187
+
188
+ .eth-dev-diff-table__table tbody th {
189
+ color: var(--eth-color-text-primary);
190
+ font-weight: 400;
191
+ }
192
+
193
+ .eth-dev-diff-table__table tbody tr {
194
+ background: var(--eth-color-layer-01);
195
+ box-shadow: inset 0.1875rem 0 0 transparent;
196
+ transition: background-color 110ms cubic-bezier(0.2, 0, 0.38, 0.9);
197
+ }
198
+
199
+ .eth-dev-diff-table__table tbody tr:hover {
200
+ background: var(--eth-color-layer-02);
201
+ }
202
+
203
+ .eth-dev-diff-table__table tbody tr:last-child th,
204
+ .eth-dev-diff-table__table tbody tr:last-child td {
205
+ border-block-end: 0;
206
+ }
207
+
208
+ .eth-dev-diff-table__table tbody tr.eth-dev-diff-table__row--added {
209
+ box-shadow: inset 0.1875rem 0 0 var(--eth-color-success);
210
+ }
211
+
212
+ .eth-dev-diff-table__table tbody tr.eth-dev-diff-table__row--removed,
213
+ .eth-dev-diff-table__table tbody tr.eth-dev-diff-table__row--conflict {
214
+ box-shadow: inset 0.1875rem 0 0 var(--eth-color-danger);
215
+ }
216
+
217
+ .eth-dev-diff-table__table tbody tr.eth-dev-diff-table__row--modified,
218
+ .eth-dev-diff-table__table tbody tr.eth-dev-diff-table__row--renamed {
219
+ box-shadow: inset 0.1875rem 0 0 var(--eth-color-info);
220
+ }
221
+
222
+ .eth-dev-diff-table__file {
223
+ display: grid;
224
+ gap: var(--eth-space-2xs);
225
+ min-inline-size: 0;
226
+ }
227
+
228
+ .eth-dev-diff-table__file code {
229
+ background: transparent;
230
+ color: var(--eth-color-text-primary);
231
+ font-family: var(--eth-font-mono);
232
+ font-size: calc(0.8125rem * var(--eth-text-scale, 1));
233
+ line-height: 1.385;
234
+ min-inline-size: 0;
235
+ overflow: hidden;
236
+ text-overflow: ellipsis;
237
+ white-space: nowrap;
238
+ }
239
+
240
+ .eth-dev-diff-table__file span {
241
+ color: var(--eth-color-text-secondary);
242
+ font-size: calc(0.75rem * var(--eth-text-scale, 1));
243
+ line-height: 1.333;
244
+ min-inline-size: 0;
245
+ overflow: hidden;
246
+ text-overflow: ellipsis;
247
+ white-space: nowrap;
248
+ }
249
+
250
+ .eth-dev-diff-table__state {
251
+ align-items: center;
252
+ border: 1px solid var(--eth-color-border-subtle);
253
+ display: inline-flex;
254
+ font-size: calc(0.75rem * var(--eth-text-scale, 1));
255
+ font-weight: 600;
256
+ line-height: 1.333;
257
+ max-inline-size: 100%;
258
+ min-block-size: 1.5rem;
259
+ min-inline-size: 0;
260
+ overflow: hidden;
261
+ padding: 0 var(--eth-space-sm);
262
+ text-overflow: ellipsis;
263
+ white-space: nowrap;
264
+ }
265
+
266
+ .eth-dev-diff-table__state--added {
267
+ background: #defbe6;
268
+ border-color: #a7f0ba;
269
+ color: #0e6027;
270
+ }
271
+
272
+ .eth-dev-diff-table__state--removed,
273
+ .eth-dev-diff-table__state--conflict {
274
+ background: #fff1f1;
275
+ border-color: #ffd7d9;
276
+ color: #a2191f;
277
+ }
278
+
279
+ .eth-dev-diff-table__state--modified,
280
+ .eth-dev-diff-table__state--renamed {
281
+ background: #edf5ff;
282
+ border-color: #d0e2ff;
283
+ color: #0043ce;
284
+ }
285
+
286
+ .eth-dev-diff-table__state--unchanged {
287
+ background: var(--eth-color-layer-02);
288
+ color: var(--eth-color-text-secondary);
289
+ }
290
+
291
+ .eth-dev-diff-table__count,
292
+ .eth-dev-diff-table__inline-delta {
293
+ align-items: center;
294
+ display: inline-flex;
295
+ font-family: var(--eth-font-mono);
296
+ font-size: calc(0.8125rem * var(--eth-text-scale, 1));
297
+ font-weight: 600;
298
+ line-height: 1.385;
299
+ white-space: nowrap;
300
+ }
301
+
302
+ .eth-dev-diff-table__inline-delta {
303
+ gap: var(--eth-space-md);
304
+ }
305
+
306
+ .eth-dev-diff-table__count--added {
307
+ color: var(--eth-color-success);
308
+ }
309
+
310
+ .eth-dev-diff-table__count--removed {
311
+ color: var(--eth-color-danger);
312
+ }
313
+
314
+ .eth-dev-diff-table__row-summary {
315
+ color: var(--eth-color-text-secondary);
316
+ display: block;
317
+ min-inline-size: 0;
318
+ overflow: hidden;
319
+ text-overflow: ellipsis;
320
+ white-space: nowrap;
321
+ }
322
+
323
+ .eth-dev-diff-table--empty > .eth-state {
324
+ background: var(--eth-color-layer-01);
325
+ border: 0;
326
+ justify-items: start;
327
+ padding: var(--eth-space-xl);
328
+ text-align: start;
329
+ }
330
+
331
+ @media (width <= 640px) {
332
+ .eth-dev-diff-table__header {
333
+ grid-template-columns: minmax(0, 1fr);
334
+ }
335
+
336
+ .eth-dev-diff-table__summary {
337
+ grid-template-columns: repeat(3, minmax(0, 1fr));
338
+ }
339
+
340
+ .eth-dev-diff-table__table {
341
+ min-inline-size: 38rem;
342
+ }
343
+ }
344
+
345
+ .eth-dev-webhook-event-viewer {
346
+ background: var(--eth-color-layer-01);
347
+ border: 1px solid var(--eth-color-border-subtle);
348
+ color: var(--eth-color-text-primary);
349
+ display: grid;
350
+ font-family: var(--eth-font-family);
351
+ inline-size: 100%;
352
+ min-inline-size: 0;
353
+ }
354
+
355
+ .eth-dev-webhook-event-viewer__header {
356
+ align-items: start;
357
+ border-block-end: 1px solid var(--eth-color-border-subtle);
358
+ display: flex;
359
+ gap: var(--eth-space-lg);
360
+ justify-content: space-between;
361
+ min-inline-size: 0;
362
+ padding: var(--eth-space-lg);
363
+ }
364
+
365
+ .eth-dev-webhook-event-viewer__heading {
366
+ display: grid;
367
+ gap: var(--eth-space-xs);
368
+ min-inline-size: 0;
369
+ }
370
+
371
+ .eth-dev-webhook-event-viewer__heading p,
372
+ .eth-dev-webhook-event-viewer__heading h3,
373
+ .eth-dev-webhook-event-viewer__summary,
374
+ .eth-dev-webhook-event-viewer__summary dt,
375
+ .eth-dev-webhook-event-viewer__summary dd {
376
+ margin: 0;
377
+ }
378
+
379
+ .eth-dev-webhook-event-viewer__heading p {
380
+ color: var(--eth-color-text-secondary);
381
+ font-size: calc(0.75rem * var(--eth-text-scale, 1));
382
+ font-weight: 600;
383
+ letter-spacing: 0;
384
+ line-height: 1.333;
385
+ text-transform: uppercase;
386
+ }
387
+
388
+ .eth-dev-webhook-event-viewer__heading h3 {
389
+ color: var(--eth-color-text-primary);
390
+ font-size: calc(1rem * var(--eth-text-scale, 1));
391
+ font-weight: 600;
392
+ line-height: 1.375;
393
+ min-inline-size: 0;
394
+ overflow: hidden;
395
+ text-overflow: ellipsis;
396
+ white-space: nowrap;
397
+ }
398
+
399
+ .eth-dev-webhook-event-viewer__summary {
400
+ display: grid;
401
+ gap: 1px;
402
+ grid-template-columns: repeat(3, minmax(5.5rem, auto));
403
+ min-inline-size: 0;
404
+ }
405
+
406
+ .eth-dev-webhook-event-viewer__summary div {
407
+ background: var(--eth-color-layer-02);
408
+ border: 1px solid var(--eth-color-border-subtle);
409
+ display: grid;
410
+ gap: var(--eth-space-2xs);
411
+ min-inline-size: 0;
412
+ padding: var(--eth-space-sm) var(--eth-space-md);
413
+ }
414
+
415
+ .eth-dev-webhook-event-viewer__summary dt {
416
+ color: var(--eth-color-text-secondary);
417
+ font-size: calc(0.6875rem * var(--eth-text-scale, 1));
418
+ font-weight: 600;
419
+ line-height: 1.45;
420
+ text-transform: uppercase;
421
+ }
422
+
423
+ .eth-dev-webhook-event-viewer__summary dd {
424
+ color: var(--eth-color-text-primary);
425
+ font-family: var(--eth-font-mono);
426
+ font-size: calc(0.8125rem * var(--eth-text-scale, 1));
427
+ line-height: 1.385;
428
+ overflow: hidden;
429
+ text-overflow: ellipsis;
430
+ white-space: nowrap;
431
+ }
432
+
433
+ .eth-dev-webhook-event-viewer .eth-data-table-wrap {
434
+ background: var(--eth-color-layer-01);
435
+ border: 0;
436
+ }
437
+
438
+ .eth-dev-webhook-event-viewer__table {
439
+ border-collapse: collapse;
440
+ color: var(--eth-color-text-primary);
441
+ inline-size: 100%;
442
+ min-inline-size: 54rem;
443
+ table-layout: fixed;
444
+ }
445
+
446
+ .eth-dev-webhook-event-viewer__table th,
447
+ .eth-dev-webhook-event-viewer__table td {
448
+ border-block-end: 1px solid var(--eth-color-border-subtle);
449
+ font-size: calc(0.875rem * var(--eth-text-scale, 1));
450
+ line-height: 1.4286;
451
+ min-inline-size: 0;
452
+ padding: var(--eth-space-sm) var(--eth-space-lg);
453
+ text-align: start;
454
+ vertical-align: middle;
455
+ }
456
+
457
+ .eth-dev-webhook-event-viewer__table th {
458
+ background: var(--eth-color-layer-02);
459
+ color: var(--eth-color-text-secondary);
460
+ font-size: calc(0.75rem * var(--eth-text-scale, 1));
461
+ font-weight: 600;
462
+ letter-spacing: 0;
463
+ line-height: 1.333;
464
+ }
465
+
466
+ .eth-dev-webhook-event-viewer__table tbody tr {
467
+ background: var(--eth-color-layer-01);
468
+ box-shadow: inset 0.1875rem 0 0 transparent;
469
+ transition: background-color 110ms cubic-bezier(0.2, 0, 0.38, 0.9);
470
+ }
471
+
472
+ .eth-dev-webhook-event-viewer__table tbody tr:hover {
473
+ background: var(--eth-color-layer-02);
474
+ }
475
+
476
+ .eth-dev-webhook-event-viewer__table tbody tr:focus-within {
477
+ outline: 2px solid var(--eth-color-focus);
478
+ outline-offset: -2px;
479
+ }
480
+
481
+ .eth-dev-webhook-event-viewer__table tbody tr:last-child td {
482
+ border-block-end: 0;
483
+ }
484
+
485
+ .eth-dev-webhook-event-viewer__event {
486
+ display: grid;
487
+ gap: var(--eth-space-2xs);
488
+ min-inline-size: 0;
489
+ }
490
+
491
+ .eth-dev-webhook-event-viewer__event code,
492
+ .eth-dev-webhook-event-viewer__url {
493
+ background: transparent;
494
+ color: var(--eth-color-text-primary);
495
+ font-family: var(--eth-font-mono);
496
+ font-size: calc(0.8125rem * var(--eth-text-scale, 1));
497
+ line-height: 1.385;
498
+ min-inline-size: 0;
499
+ }
500
+
501
+ .eth-dev-webhook-event-viewer__event code,
502
+ .eth-dev-webhook-event-viewer__event span,
503
+ .eth-dev-webhook-event-viewer__url {
504
+ display: block;
505
+ overflow: hidden;
506
+ text-overflow: ellipsis;
507
+ white-space: nowrap;
508
+ }
509
+
510
+ .eth-dev-webhook-event-viewer__event span {
511
+ color: var(--eth-color-text-secondary);
512
+ font-size: calc(0.75rem * var(--eth-text-scale, 1));
513
+ line-height: 1.333;
514
+ }
515
+
516
+ .eth-dev-webhook-event-viewer__url {
517
+ max-inline-size: 100%;
518
+ }
519
+
520
+ .eth-dev-webhook-event-viewer__count,
521
+ .eth-dev-webhook-event-viewer__time {
522
+ color: var(--eth-color-text-primary);
523
+ font-family: var(--eth-font-mono);
524
+ font-size: calc(0.8125rem * var(--eth-text-scale, 1));
525
+ line-height: 1.385;
526
+ white-space: nowrap;
527
+ }
528
+
529
+ .eth-dev-webhook-event-viewer__missing {
530
+ color: var(--eth-color-text-secondary);
531
+ font-size: calc(0.8125rem * var(--eth-text-scale, 1));
532
+ line-height: 1.385;
533
+ white-space: nowrap;
534
+ }
535
+
536
+ .eth-dev-webhook-event-viewer .eth-badge {
537
+ max-inline-size: 100%;
538
+ }
539
+
540
+ .eth-dev-webhook-event-viewer .eth-data-table__actions {
541
+ min-inline-size: 4rem;
542
+ }
543
+
544
+ .eth-dev-webhook-event-viewer > .eth-state {
545
+ background: var(--eth-color-layer-01);
546
+ border: 0;
547
+ justify-items: start;
548
+ padding: var(--eth-space-xl);
549
+ text-align: start;
550
+ }
551
+
552
+ @media (width <= 640px) {
553
+ .eth-dev-webhook-event-viewer__header {
554
+ display: grid;
555
+ }
556
+
557
+ .eth-dev-webhook-event-viewer__summary {
558
+ grid-template-columns: repeat(3, minmax(0, 1fr));
559
+ }
560
+
561
+ .eth-dev-webhook-event-viewer__table {
562
+ min-inline-size: 48rem;
563
+ }
564
+ }
565
+
566
+ @media (width <= 420px) {
567
+ .eth-dev-webhook-event-viewer__summary {
568
+ grid-template-columns: minmax(0, 1fr);
569
+ }
570
+ }
571
+
572
+ .eth-dev-git-repository-panel {
573
+ background: var(--eth-color-layer-01);
574
+ border: 1px solid var(--eth-color-border-subtle);
575
+ color: var(--eth-color-text-primary);
576
+ display: grid;
577
+ font-family: var(--eth-font-family);
578
+ inline-size: 100%;
579
+ min-inline-size: 0;
580
+ }
581
+
582
+ .eth-dev-git-repository-panel__header {
583
+ align-items: start;
584
+ border-block-end: 1px solid var(--eth-color-border-subtle);
585
+ display: grid;
586
+ gap: var(--eth-space-lg);
587
+ grid-template-columns: minmax(0, 1fr) auto;
588
+ min-inline-size: 0;
589
+ padding: var(--eth-space-lg);
590
+ }
591
+
592
+ .eth-dev-git-repository-panel__identity {
593
+ align-items: start;
594
+ display: flex;
595
+ gap: var(--eth-space-md);
596
+ min-inline-size: 0;
597
+ }
598
+
599
+ .eth-dev-git-repository-panel__icon {
600
+ background: var(--eth-color-layer-02);
601
+ border: 1px solid var(--eth-color-border-subtle);
602
+ color: var(--eth-color-link);
603
+ display: inline-grid;
604
+ flex: 0 0 auto;
605
+ inline-size: 2.5rem;
606
+ min-block-size: 2.5rem;
607
+ place-items: center;
608
+ }
609
+
610
+ .eth-dev-git-repository-panel__heading {
611
+ display: grid;
612
+ gap: var(--eth-space-xs);
613
+ min-inline-size: 0;
614
+ }
615
+
616
+ .eth-dev-git-repository-panel__heading p,
617
+ .eth-dev-git-repository-panel__heading h3,
618
+ .eth-dev-git-repository-panel__metrics,
619
+ .eth-dev-git-repository-panel__metric dt,
620
+ .eth-dev-git-repository-panel__metric dd {
621
+ margin: 0;
622
+ }
623
+
624
+ .eth-dev-git-repository-panel__heading p {
625
+ color: var(--eth-color-text-secondary);
626
+ font-size: calc(0.75rem * var(--eth-text-scale, 1));
627
+ font-weight: 600;
628
+ letter-spacing: 0;
629
+ line-height: 1.333;
630
+ text-transform: uppercase;
631
+ }
632
+
633
+ .eth-dev-git-repository-panel__heading h3 {
634
+ color: var(--eth-color-text-primary);
635
+ font-size: calc(1.25rem * var(--eth-text-scale, 1));
636
+ font-weight: 600;
637
+ line-height: 1.4;
638
+ min-inline-size: 0;
639
+ overflow: hidden;
640
+ text-overflow: ellipsis;
641
+ white-space: nowrap;
642
+ }
643
+
644
+ .eth-dev-git-repository-panel__url {
645
+ color: var(--eth-color-link);
646
+ display: block;
647
+ font-size: calc(0.875rem * var(--eth-text-scale, 1));
648
+ line-height: 1.4286;
649
+ max-inline-size: 100%;
650
+ min-inline-size: 0;
651
+ overflow: hidden;
652
+ text-decoration: none;
653
+ text-overflow: ellipsis;
654
+ white-space: nowrap;
655
+ }
656
+
657
+ .eth-dev-git-repository-panel__url:hover {
658
+ color: var(--eth-color-link);
659
+ text-decoration: underline;
660
+ }
661
+
662
+ .eth-dev-git-repository-panel__url:focus-visible,
663
+ .eth-dev-git-repository-panel__action:focus-visible {
664
+ outline: 2px solid var(--eth-color-focus);
665
+ outline-offset: 2px;
666
+ }
667
+
668
+ .eth-dev-git-repository-panel__action {
669
+ align-items: center;
670
+ background: #0f62fe;
671
+ color: #ffffff;
672
+ display: inline-flex;
673
+ font-size: calc(0.875rem * var(--eth-text-scale, 1));
674
+ gap: var(--eth-space-lg);
675
+ justify-content: space-between;
676
+ line-height: 1.2857;
677
+ min-block-size: 2.5rem;
678
+ min-inline-size: 10rem;
679
+ padding: var(--eth-space-sm) var(--eth-space-lg);
680
+ text-decoration: none;
681
+ white-space: nowrap;
682
+ }
683
+
684
+ .eth-dev-git-repository-panel__action:hover {
685
+ background: #0050e6;
686
+ color: #ffffff;
687
+ }
688
+
689
+ .eth-dev-git-repository-panel__action svg {
690
+ flex: 0 0 auto;
691
+ }
692
+
693
+ .eth-dev-git-repository-panel__metrics {
694
+ background: var(--eth-color-border-subtle);
695
+ display: grid;
696
+ gap: 1px;
697
+ grid-template-columns: repeat(4, minmax(0, 1fr));
698
+ min-inline-size: 0;
699
+ }
700
+
701
+ .eth-dev-git-repository-panel__metric {
702
+ background: var(--eth-color-layer-02);
703
+ display: grid;
704
+ gap: var(--eth-space-sm);
705
+ min-block-size: 5.5rem;
706
+ min-inline-size: 0;
707
+ padding: var(--eth-space-lg);
708
+ }
709
+
710
+ .eth-dev-git-repository-panel__metric dt {
711
+ align-items: center;
712
+ color: var(--eth-color-text-secondary);
713
+ display: inline-flex;
714
+ font-size: calc(0.75rem * var(--eth-text-scale, 1));
715
+ font-weight: 600;
716
+ gap: var(--eth-space-sm);
717
+ line-height: 1.333;
718
+ min-inline-size: 0;
719
+ text-transform: uppercase;
720
+ }
721
+
722
+ .eth-dev-git-repository-panel__metric dt span {
723
+ align-items: center;
724
+ color: var(--eth-color-link);
725
+ display: inline-flex;
726
+ flex: 0 0 auto;
727
+ }
728
+
729
+ .eth-dev-git-repository-panel__metric dd {
730
+ color: var(--eth-color-text-primary);
731
+ font-size: calc(1.25rem * var(--eth-text-scale, 1));
732
+ font-weight: 600;
733
+ line-height: 1.4;
734
+ min-inline-size: 0;
735
+ overflow: hidden;
736
+ text-overflow: ellipsis;
737
+ white-space: nowrap;
738
+ }
739
+
740
+ .eth-dev-git-repository-panel__metric-value--code {
741
+ font-family: var(--eth-font-mono);
742
+ font-size: calc(0.9375rem * var(--eth-text-scale, 1));
743
+ line-height: 1.4667;
744
+ }
745
+
746
+ @media (width <= 640px) {
747
+ .eth-dev-git-repository-panel__header {
748
+ grid-template-columns: minmax(0, 1fr);
749
+ }
750
+
751
+ .eth-dev-git-repository-panel__action {
752
+ inline-size: fit-content;
753
+ max-inline-size: 100%;
754
+ }
755
+
756
+ .eth-dev-git-repository-panel__metrics {
757
+ grid-template-columns: repeat(2, minmax(0, 1fr));
758
+ }
759
+ }
760
+
761
+ @media (width <= 420px) {
762
+ .eth-dev-git-repository-panel__identity {
763
+ display: grid;
764
+ }
765
+
766
+ .eth-dev-git-repository-panel__metrics {
767
+ grid-template-columns: minmax(0, 1fr);
768
+ }
769
+ }
770
+
771
+ .eth-dev-commit-list {
772
+ background: var(--eth-color-layer-01);
773
+ border: 1px solid var(--eth-color-border-subtle);
774
+ color: var(--eth-color-text-primary);
775
+ display: grid;
776
+ font-family: var(--eth-font-family);
777
+ inline-size: 100%;
778
+ min-inline-size: 0;
779
+ }
780
+
781
+ .eth-dev-commit-list__header {
782
+ align-items: start;
783
+ border-block-end: 1px solid var(--eth-color-border-subtle);
784
+ display: flex;
785
+ gap: var(--eth-space-lg);
786
+ justify-content: space-between;
787
+ min-inline-size: 0;
788
+ padding: var(--eth-space-lg);
789
+ }
790
+
791
+ .eth-dev-commit-list__heading {
792
+ display: grid;
793
+ gap: var(--eth-space-xs);
794
+ min-inline-size: 0;
795
+ }
796
+
797
+ .eth-dev-commit-list__heading p {
798
+ color: var(--eth-color-text-secondary);
799
+ font-size: calc(0.75rem * var(--eth-text-scale, 1));
800
+ font-weight: 600;
801
+ letter-spacing: 0;
802
+ line-height: 1.333;
803
+ margin: 0;
804
+ text-transform: uppercase;
805
+ }
806
+
807
+ .eth-dev-commit-list__heading h3 {
808
+ font-size: calc(1rem * var(--eth-text-scale, 1));
809
+ font-weight: 600;
810
+ line-height: 1.375;
811
+ margin: 0;
812
+ }
813
+
814
+ .eth-dev-commit-list__summary {
815
+ display: grid;
816
+ gap: 1px;
817
+ grid-template-columns: repeat(3, minmax(5.5rem, auto));
818
+ margin: 0;
819
+ min-inline-size: 0;
820
+ }
821
+
822
+ .eth-dev-commit-list__summary div {
823
+ background: var(--eth-color-layer-02);
824
+ border: 1px solid var(--eth-color-border-subtle);
825
+ display: grid;
826
+ gap: var(--eth-space-2xs);
827
+ min-inline-size: 0;
828
+ padding: var(--eth-space-sm) var(--eth-space-md);
829
+ }
830
+
831
+ .eth-dev-commit-list__summary dt {
832
+ color: var(--eth-color-text-secondary);
833
+ font-size: calc(0.6875rem * var(--eth-text-scale, 1));
834
+ font-weight: 600;
835
+ line-height: 1.45;
836
+ margin: 0;
837
+ text-transform: uppercase;
838
+ }
839
+
840
+ .eth-dev-commit-list__summary dd {
841
+ color: var(--eth-color-text-primary);
842
+ font-family: var(--eth-font-mono);
843
+ font-size: calc(0.8125rem * var(--eth-text-scale, 1));
844
+ line-height: 1.385;
845
+ margin: 0;
846
+ overflow: hidden;
847
+ text-overflow: ellipsis;
848
+ white-space: nowrap;
849
+ }
850
+
851
+ .eth-dev-commit-list .eth-data-table-wrap {
852
+ background: var(--eth-color-layer-01);
853
+ border: 0;
854
+ }
855
+
856
+ .eth-dev-commit-list__table {
857
+ min-inline-size: 48rem;
858
+ table-layout: fixed;
859
+ }
860
+
861
+ .eth-dev-commit-list__table th,
862
+ .eth-dev-commit-list__table td {
863
+ font-size: calc(0.875rem * var(--eth-text-scale, 1));
864
+ line-height: 1.4286;
865
+ min-inline-size: 0;
866
+ padding: var(--eth-space-sm) var(--eth-space-lg);
867
+ }
868
+
869
+ .eth-dev-commit-list__table th {
870
+ background: var(--eth-color-layer-02);
871
+ color: var(--eth-color-text-secondary);
872
+ font-size: calc(0.75rem * var(--eth-text-scale, 1));
873
+ font-weight: 600;
874
+ letter-spacing: 0;
875
+ line-height: 1.333;
876
+ }
877
+
878
+ .eth-dev-commit-list__table tbody tr {
879
+ transition: background-color 110ms cubic-bezier(0.2, 0, 0.38, 0.9);
880
+ }
881
+
882
+ .eth-dev-commit-list__table tbody tr:hover {
883
+ background: var(--eth-color-layer-02);
884
+ }
885
+
886
+ .eth-dev-commit-list__sha {
887
+ background: var(--eth-color-layer-02);
888
+ border: 1px solid var(--eth-color-border-subtle);
889
+ color: var(--eth-color-text-primary);
890
+ display: inline-flex;
891
+ font-family: var(--eth-font-mono);
892
+ font-size: calc(0.8125rem * var(--eth-text-scale, 1));
893
+ line-height: 1.385;
894
+ max-inline-size: 100%;
895
+ padding: 0 var(--eth-space-sm);
896
+ }
897
+
898
+ .eth-dev-commit-list__message {
899
+ display: block;
900
+ font-weight: 500;
901
+ min-inline-size: 0;
902
+ overflow: hidden;
903
+ text-overflow: ellipsis;
904
+ white-space: nowrap;
905
+ }
906
+
907
+ .eth-dev-commit-list__author {
908
+ align-items: center;
909
+ display: inline-flex;
910
+ gap: var(--eth-space-sm);
911
+ max-inline-size: 100%;
912
+ min-inline-size: 0;
913
+ }
914
+
915
+ .eth-dev-commit-list__avatar {
916
+ background: var(--eth-color-layer-02);
917
+ border: 1px solid var(--eth-color-border-subtle);
918
+ color: var(--eth-color-text-secondary);
919
+ display: inline-grid;
920
+ flex: 0 0 auto;
921
+ font-family: var(--eth-font-mono);
922
+ font-size: calc(0.6875rem * var(--eth-text-scale, 1));
923
+ font-weight: 600;
924
+ inline-size: 1.5rem;
925
+ line-height: 1;
926
+ min-block-size: 1.5rem;
927
+ place-items: center;
928
+ }
929
+
930
+ .eth-dev-commit-list__author-name {
931
+ min-inline-size: 0;
932
+ overflow: hidden;
933
+ text-overflow: ellipsis;
934
+ white-space: nowrap;
935
+ }
936
+
937
+ .eth-dev-commit-list__date {
938
+ color: var(--eth-color-text-secondary);
939
+ font-family: var(--eth-font-mono);
940
+ font-size: calc(0.8125rem * var(--eth-text-scale, 1));
941
+ line-height: 1.385;
942
+ white-space: nowrap;
943
+ }
944
+
945
+ .eth-dev-commit-list > .eth-state {
946
+ background: var(--eth-color-layer-01);
947
+ border: 0;
948
+ justify-items: start;
949
+ padding: var(--eth-space-xl);
950
+ text-align: start;
951
+ }
952
+
953
+ @media (width <= 640px) {
954
+ .eth-dev-commit-list__header {
955
+ display: grid;
956
+ }
957
+
958
+ .eth-dev-commit-list__summary {
959
+ grid-template-columns: repeat(3, minmax(0, 1fr));
960
+ }
961
+ }
962
+
963
+ .eth-dev-pull-request-panel {
964
+ background: var(--eth-color-layer-01);
965
+ border: 1px solid var(--eth-color-border-subtle);
966
+ color: var(--eth-color-text-primary);
967
+ display: grid;
968
+ font-family: var(--eth-font-family);
969
+ inline-size: 100%;
970
+ min-inline-size: 0;
971
+ }
972
+
973
+ .eth-dev-pull-request-panel__header {
974
+ align-items: start;
975
+ border-block-end: 1px solid var(--eth-color-border-subtle);
976
+ display: grid;
977
+ gap: var(--eth-space-lg);
978
+ grid-template-columns: minmax(0, 1fr) auto;
979
+ min-inline-size: 0;
980
+ padding: var(--eth-space-lg);
981
+ }
982
+
983
+ .eth-dev-pull-request-panel__identity {
984
+ align-items: start;
985
+ display: flex;
986
+ gap: var(--eth-space-md);
987
+ min-inline-size: 0;
988
+ }
989
+
990
+ .eth-dev-pull-request-panel__icon {
991
+ background: var(--eth-color-layer-02);
992
+ border: 1px solid var(--eth-color-border-subtle);
993
+ color: var(--eth-color-link);
994
+ display: inline-grid;
995
+ flex: 0 0 auto;
996
+ inline-size: 2.5rem;
997
+ min-block-size: 2.5rem;
998
+ place-items: center;
999
+ }
1000
+
1001
+ .eth-dev-pull-request-panel__heading {
1002
+ display: grid;
1003
+ gap: var(--eth-space-xs);
1004
+ min-inline-size: 0;
1005
+ }
1006
+
1007
+ .eth-dev-pull-request-panel__heading p,
1008
+ .eth-dev-pull-request-panel__heading h3,
1009
+ .eth-dev-pull-request-panel__description,
1010
+ .eth-dev-pull-request-panel__metrics,
1011
+ .eth-dev-pull-request-panel__metrics dt,
1012
+ .eth-dev-pull-request-panel__metrics dd,
1013
+ .eth-dev-pull-request-panel__files-header h4 {
1014
+ margin: 0;
1015
+ }
1016
+
1017
+ .eth-dev-pull-request-panel__heading p {
1018
+ color: var(--eth-color-text-secondary);
1019
+ font-size: calc(0.75rem * var(--eth-text-scale, 1));
1020
+ font-weight: 600;
1021
+ letter-spacing: 0;
1022
+ line-height: 1.333;
1023
+ text-transform: uppercase;
1024
+ }
1025
+
1026
+ .eth-dev-pull-request-panel__heading p span {
1027
+ font-family: var(--eth-font-mono);
1028
+ }
1029
+
1030
+ .eth-dev-pull-request-panel__heading h3 {
1031
+ color: var(--eth-color-text-primary);
1032
+ font-size: calc(1.25rem * var(--eth-text-scale, 1));
1033
+ font-weight: 600;
1034
+ line-height: 1.4;
1035
+ min-inline-size: 0;
1036
+ overflow: hidden;
1037
+ text-overflow: ellipsis;
1038
+ white-space: nowrap;
1039
+ }
1040
+
1041
+ .eth-dev-pull-request-panel__meta {
1042
+ align-items: center;
1043
+ color: var(--eth-color-text-secondary);
1044
+ display: flex;
1045
+ flex-wrap: wrap;
1046
+ font-size: calc(0.875rem * var(--eth-text-scale, 1));
1047
+ gap: var(--eth-space-sm);
1048
+ line-height: 1.4286;
1049
+ min-inline-size: 0;
1050
+ }
1051
+
1052
+ .eth-dev-pull-request-panel__state {
1053
+ align-items: center;
1054
+ border: 1px solid var(--eth-color-border-subtle);
1055
+ display: inline-flex;
1056
+ font-size: calc(0.75rem * var(--eth-text-scale, 1));
1057
+ font-weight: 600;
1058
+ line-height: 1.333;
1059
+ max-inline-size: 100%;
1060
+ min-block-size: 1.5rem;
1061
+ overflow: hidden;
1062
+ padding: 0 var(--eth-space-sm);
1063
+ text-overflow: ellipsis;
1064
+ white-space: nowrap;
1065
+ }
1066
+
1067
+ .eth-dev-pull-request-panel__state--open {
1068
+ background: #edf5ff;
1069
+ border-color: #d0e2ff;
1070
+ color: #0043ce;
1071
+ }
1072
+
1073
+ .eth-dev-pull-request-panel__state--merged {
1074
+ background: #defbe6;
1075
+ border-color: #a7f0ba;
1076
+ color: #0e6027;
1077
+ }
1078
+
1079
+ .eth-dev-pull-request-panel__state--closed {
1080
+ background: #fff1f1;
1081
+ border-color: #ffd7d9;
1082
+ color: #a2191f;
1083
+ }
1084
+
1085
+ .eth-dev-pull-request-panel__state--draft,
1086
+ .eth-dev-pull-request-panel__state--unknown {
1087
+ background: var(--eth-color-layer-02);
1088
+ color: var(--eth-color-text-secondary);
1089
+ }
1090
+
1091
+ .eth-dev-pull-request-panel__approve {
1092
+ white-space: nowrap;
1093
+ }
1094
+
1095
+ .eth-dev-pull-request-panel__body {
1096
+ border-block-end: 1px solid var(--eth-color-border-subtle);
1097
+ display: grid;
1098
+ gap: var(--eth-space-lg);
1099
+ min-inline-size: 0;
1100
+ padding: var(--eth-space-lg);
1101
+ }
1102
+
1103
+ .eth-dev-pull-request-panel__description {
1104
+ color: var(--eth-color-text-primary);
1105
+ font-size: calc(0.875rem * var(--eth-text-scale, 1));
1106
+ line-height: 1.4286;
1107
+ max-inline-size: 52rem;
1108
+ }
1109
+
1110
+ .eth-dev-pull-request-panel__metrics {
1111
+ background: var(--eth-color-border-subtle);
1112
+ display: grid;
1113
+ gap: 1px;
1114
+ grid-template-columns: repeat(4, minmax(0, 1fr));
1115
+ min-inline-size: 0;
1116
+ }
1117
+
1118
+ .eth-dev-pull-request-panel__metrics div {
1119
+ background: var(--eth-color-layer-02);
1120
+ display: grid;
1121
+ gap: var(--eth-space-xs);
1122
+ min-block-size: 4.5rem;
1123
+ min-inline-size: 0;
1124
+ padding: var(--eth-space-md);
1125
+ }
1126
+
1127
+ .eth-dev-pull-request-panel__metrics dt {
1128
+ color: var(--eth-color-text-secondary);
1129
+ font-size: calc(0.6875rem * var(--eth-text-scale, 1));
1130
+ font-weight: 600;
1131
+ line-height: 1.45;
1132
+ text-transform: uppercase;
1133
+ }
1134
+
1135
+ .eth-dev-pull-request-panel__metrics dd {
1136
+ color: var(--eth-color-text-primary);
1137
+ font-size: calc(0.875rem * var(--eth-text-scale, 1));
1138
+ font-weight: 600;
1139
+ line-height: 1.4286;
1140
+ min-inline-size: 0;
1141
+ overflow: hidden;
1142
+ text-overflow: ellipsis;
1143
+ white-space: nowrap;
1144
+ }
1145
+
1146
+ .eth-dev-pull-request-panel__metrics div:not(:first-child) dd,
1147
+ .eth-dev-pull-request-panel__count {
1148
+ font-family: var(--eth-font-mono);
1149
+ }
1150
+
1151
+ .eth-dev-pull-request-panel__files {
1152
+ display: grid;
1153
+ min-inline-size: 0;
1154
+ }
1155
+
1156
+ .eth-dev-pull-request-panel__files-header {
1157
+ align-items: center;
1158
+ background: var(--eth-color-layer-01);
1159
+ border-block-end: 1px solid var(--eth-color-border-subtle);
1160
+ display: flex;
1161
+ gap: var(--eth-space-md);
1162
+ justify-content: space-between;
1163
+ min-inline-size: 0;
1164
+ padding: var(--eth-space-md) var(--eth-space-lg);
1165
+ }
1166
+
1167
+ .eth-dev-pull-request-panel__files-header h4 {
1168
+ color: var(--eth-color-text-primary);
1169
+ font-size: calc(0.875rem * var(--eth-text-scale, 1));
1170
+ font-weight: 600;
1171
+ line-height: 1.4286;
1172
+ }
1173
+
1174
+ .eth-dev-pull-request-panel__files-header span {
1175
+ color: var(--eth-color-text-secondary);
1176
+ font-family: var(--eth-font-mono);
1177
+ font-size: calc(0.75rem * var(--eth-text-scale, 1));
1178
+ line-height: 1.333;
1179
+ white-space: nowrap;
1180
+ }
1181
+
1182
+ .eth-dev-pull-request-panel .eth-data-table-wrap {
1183
+ background: var(--eth-color-layer-01);
1184
+ border: 0;
1185
+ }
1186
+
1187
+ .eth-dev-pull-request-panel__table {
1188
+ min-inline-size: 34rem;
1189
+ table-layout: fixed;
1190
+ }
1191
+
1192
+ .eth-dev-pull-request-panel__table th,
1193
+ .eth-dev-pull-request-panel__table td {
1194
+ font-size: calc(0.875rem * var(--eth-text-scale, 1));
1195
+ line-height: 1.4286;
1196
+ padding: var(--eth-space-sm) var(--eth-space-lg);
1197
+ }
1198
+
1199
+ .eth-dev-pull-request-panel__table th {
1200
+ background: var(--eth-color-layer-02);
1201
+ color: var(--eth-color-text-secondary);
1202
+ font-size: calc(0.75rem * var(--eth-text-scale, 1));
1203
+ font-weight: 600;
1204
+ letter-spacing: 0;
1205
+ line-height: 1.333;
1206
+ }
1207
+
1208
+ .eth-dev-pull-request-panel__table tbody tr:hover {
1209
+ background: var(--eth-color-layer-02);
1210
+ }
1211
+
1212
+ .eth-dev-pull-request-panel__file-path {
1213
+ background: transparent;
1214
+ color: var(--eth-color-text-primary);
1215
+ display: block;
1216
+ font-family: var(--eth-font-mono);
1217
+ font-size: calc(0.8125rem * var(--eth-text-scale, 1));
1218
+ line-height: 1.385;
1219
+ min-inline-size: 0;
1220
+ overflow: hidden;
1221
+ text-overflow: ellipsis;
1222
+ white-space: nowrap;
1223
+ }
1224
+
1225
+ .eth-dev-pull-request-panel__count {
1226
+ align-items: center;
1227
+ display: inline-flex;
1228
+ font-size: calc(0.8125rem * var(--eth-text-scale, 1));
1229
+ font-weight: 600;
1230
+ line-height: 1.385;
1231
+ white-space: nowrap;
1232
+ }
1233
+
1234
+ .eth-dev-pull-request-panel__count--added {
1235
+ color: var(--eth-color-success);
1236
+ }
1237
+
1238
+ .eth-dev-pull-request-panel__count--removed {
1239
+ color: var(--eth-color-danger);
1240
+ }
1241
+
1242
+ .eth-dev-pull-request-panel__files > .eth-state {
1243
+ background: var(--eth-color-layer-01);
1244
+ border: 0;
1245
+ justify-items: start;
1246
+ padding: var(--eth-space-xl);
1247
+ text-align: start;
1248
+ }
1249
+
1250
+ .eth-dev-pull-request-panel__comment {
1251
+ background: var(--eth-color-layer-02);
1252
+ border-block-start: 1px solid var(--eth-color-border-subtle);
1253
+ display: grid;
1254
+ gap: var(--eth-space-md);
1255
+ min-inline-size: 0;
1256
+ padding: var(--eth-space-lg);
1257
+ }
1258
+
1259
+ .eth-dev-pull-request-panel__comment .cds--form-item,
1260
+ .eth-dev-pull-request-panel__comment .cds--text-area__wrapper,
1261
+ .eth-dev-pull-request-panel__comment .cds--text-area {
1262
+ inline-size: 100%;
1263
+ }
1264
+
1265
+ .eth-dev-pull-request-panel__comment-footer {
1266
+ align-items: center;
1267
+ color: var(--eth-color-text-secondary);
1268
+ display: flex;
1269
+ font-size: calc(0.75rem * var(--eth-text-scale, 1));
1270
+ gap: var(--eth-space-lg);
1271
+ justify-content: space-between;
1272
+ line-height: 1.333;
1273
+ min-inline-size: 0;
1274
+ }
1275
+
1276
+ .eth-dev-pull-request-panel__comment-footer span {
1277
+ min-inline-size: 0;
1278
+ overflow: hidden;
1279
+ text-overflow: ellipsis;
1280
+ white-space: nowrap;
1281
+ }
1282
+
1283
+ @media (width <= 640px) {
1284
+ .eth-dev-pull-request-panel__header {
1285
+ grid-template-columns: minmax(0, 1fr);
1286
+ }
1287
+
1288
+ .eth-dev-pull-request-panel__metrics {
1289
+ grid-template-columns: repeat(2, minmax(0, 1fr));
1290
+ }
1291
+
1292
+ .eth-dev-pull-request-panel__comment-footer {
1293
+ align-items: start;
1294
+ display: grid;
1295
+ }
1296
+ }
1297
+
1298
+ @media (width <= 420px) {
1299
+ .eth-dev-pull-request-panel__identity {
1300
+ display: grid;
1301
+ }
1302
+
1303
+ .eth-dev-pull-request-panel__metrics {
1304
+ grid-template-columns: minmax(0, 1fr);
1305
+ }
1306
+ }
1307
+
1308
+ .eth-dev-code-editor {
1309
+ --eth-dev-code-editor-line-height: 1.5rem;
1310
+
1311
+ background: var(--eth-color-layer-01);
1312
+ border: 1px solid var(--eth-color-border-subtle);
1313
+ border-block-end-color: var(--eth-color-border-strong);
1314
+ color: var(--eth-color-text-primary);
1315
+ display: grid;
1316
+ font-family: var(--eth-font-family);
1317
+ inline-size: min(100%, 56rem);
1318
+ min-inline-size: min(100%, 20rem);
1319
+ }
1320
+
1321
+ .eth-dev-code-editor__header {
1322
+ align-items: center;
1323
+ background: var(--eth-color-layer-02);
1324
+ border-block-end: 1px solid var(--eth-color-border-subtle);
1325
+ display: grid;
1326
+ gap: var(--eth-space-md);
1327
+ grid-template-columns: minmax(0, 1fr) auto;
1328
+ min-block-size: 2.5rem;
1329
+ padding: var(--eth-space-sm) var(--eth-space-lg);
1330
+ }
1331
+
1332
+ .eth-dev-code-editor__heading,
1333
+ .eth-dev-code-editor__badges,
1334
+ .eth-dev-code-editor__footer {
1335
+ align-items: center;
1336
+ display: flex;
1337
+ min-inline-size: 0;
1338
+ }
1339
+
1340
+ .eth-dev-code-editor__heading {
1341
+ gap: var(--eth-space-md);
1342
+ }
1343
+
1344
+ .eth-dev-code-editor__title {
1345
+ font-size: calc(0.875rem * var(--eth-text-scale, 1));
1346
+ font-weight: 600;
1347
+ line-height: 1.428;
1348
+ overflow: hidden;
1349
+ text-overflow: ellipsis;
1350
+ white-space: nowrap;
1351
+ }
1352
+
1353
+ .eth-dev-code-editor__language,
1354
+ .eth-dev-code-editor__badge {
1355
+ border: 1px solid var(--eth-color-border-subtle);
1356
+ color: var(--eth-color-text-secondary);
1357
+ font-size: calc(0.75rem * var(--eth-text-scale, 1));
1358
+ line-height: 1.333;
1359
+ min-inline-size: 0;
1360
+ overflow: hidden;
1361
+ padding: var(--eth-space-2xs) var(--eth-space-sm);
1362
+ text-overflow: ellipsis;
1363
+ white-space: nowrap;
1364
+ }
1365
+
1366
+ .eth-dev-code-editor__language {
1367
+ background: var(--eth-color-layer-01);
1368
+ font-family: var(--eth-font-mono);
1369
+ max-inline-size: 12rem;
1370
+ }
1371
+
1372
+ .eth-dev-code-editor__badges {
1373
+ gap: var(--eth-space-sm);
1374
+ justify-content: end;
1375
+ }
1376
+
1377
+ .eth-dev-code-editor__badge {
1378
+ background: var(--eth-color-layer-01);
1379
+ max-inline-size: 16rem;
1380
+ }
1381
+
1382
+ .eth-dev-code-editor__body {
1383
+ background: var(--eth-color-layer-02);
1384
+ display: grid;
1385
+ grid-template-columns: 3.5rem minmax(0, 1fr);
1386
+ min-block-size: 14rem;
1387
+ min-inline-size: 0;
1388
+ }
1389
+
1390
+ .eth-dev-code-editor__gutter {
1391
+ background: var(--eth-color-layer-01);
1392
+ border-inline-end: 1px solid var(--eth-color-border-subtle);
1393
+ color: var(--eth-color-text-secondary);
1394
+ font-family: var(--eth-font-mono);
1395
+ font-size: calc(0.8125rem * var(--eth-text-scale, 1));
1396
+ line-height: var(--eth-dev-code-editor-line-height);
1397
+ overflow: hidden;
1398
+ padding: var(--eth-space-lg) var(--eth-space-sm) var(--eth-space-lg)
1399
+ var(--eth-space-xs);
1400
+ text-align: end;
1401
+ user-select: none;
1402
+ }
1403
+
1404
+ .eth-dev-code-editor__gutter span {
1405
+ block-size: var(--eth-dev-code-editor-line-height);
1406
+ display: block;
1407
+ }
1408
+
1409
+ .eth-dev-code-editor__textarea {
1410
+ appearance: none;
1411
+ background: transparent;
1412
+ block-size: 100%;
1413
+ border: 0;
1414
+ color: var(--eth-color-text-primary);
1415
+ font-family: var(--eth-font-mono);
1416
+ font-size: calc(0.875rem * var(--eth-text-scale, 1));
1417
+ inline-size: 100%;
1418
+ line-height: var(--eth-dev-code-editor-line-height);
1419
+ margin: 0;
1420
+ min-block-size: 14rem;
1421
+ min-inline-size: 0;
1422
+ outline: 2px solid transparent;
1423
+ outline-offset: -2px;
1424
+ overflow: auto;
1425
+ padding: var(--eth-space-lg);
1426
+ resize: vertical;
1427
+ scrollbar-gutter: stable;
1428
+ tab-size: 2;
1429
+ }
1430
+
1431
+ .eth-dev-code-editor__textarea::placeholder {
1432
+ color: var(--eth-color-text-secondary);
1433
+ }
1434
+
1435
+ .eth-dev-code-editor__textarea:focus {
1436
+ outline-color: var(--eth-color-focus);
1437
+ }
1438
+
1439
+ .eth-dev-code-editor__textarea:disabled {
1440
+ color: #8d8d8d;
1441
+ cursor: not-allowed;
1442
+ }
1443
+
1444
+ .eth-dev-code-editor[data-readonly="true"] .eth-dev-code-editor__textarea {
1445
+ color: var(--eth-color-text-secondary);
1446
+ }
1447
+
1448
+ .eth-dev-code-editor[data-disabled="true"] {
1449
+ background: var(--eth-color-layer-01);
1450
+ }
1451
+
1452
+ .eth-dev-code-editor[data-invalid="true"] {
1453
+ border-block-end-color: var(--eth-color-danger);
1454
+ }
1455
+
1456
+ .eth-dev-code-editor[data-invalid="true"] .eth-dev-code-editor__footer span:first-child {
1457
+ color: var(--eth-color-danger);
1458
+ }
1459
+
1460
+ .eth-dev-code-editor__footer {
1461
+ background: var(--eth-color-layer-01);
1462
+ border-block-start: 1px solid var(--eth-color-border-subtle);
1463
+ color: var(--eth-color-text-secondary);
1464
+ font-family: var(--eth-font-mono);
1465
+ font-size: calc(0.75rem * var(--eth-text-scale, 1));
1466
+ justify-content: space-between;
1467
+ line-height: 1.333;
1468
+ min-block-size: 2rem;
1469
+ padding: var(--eth-space-sm) var(--eth-space-lg);
1470
+ }
1471
+
1472
+ .eth-dev-code-editor__footer span {
1473
+ min-inline-size: 0;
1474
+ overflow: hidden;
1475
+ text-overflow: ellipsis;
1476
+ white-space: nowrap;
1477
+ }
1478
+
1479
+ .eth-dev-code-editor__footer span + span {
1480
+ margin-inline-start: var(--eth-space-lg);
1481
+ }
1482
+
1483
+ @media (width <= 640px) {
1484
+ .eth-dev-code-editor {
1485
+ inline-size: 100%;
1486
+ min-inline-size: 0;
1487
+ }
1488
+
1489
+ .eth-dev-code-editor__header {
1490
+ align-items: start;
1491
+ grid-template-columns: 1fr;
1492
+ }
1493
+
1494
+ .eth-dev-code-editor__badges {
1495
+ justify-content: start;
1496
+ }
1497
+
1498
+ .eth-dev-code-editor__body {
1499
+ grid-template-columns: 2.75rem minmax(0, 1fr);
1500
+ }
1501
+
1502
+ .eth-dev-code-editor__textarea {
1503
+ font-size: calc(0.8125rem * var(--eth-text-scale, 1));
1504
+ padding: var(--eth-space-md);
1505
+ }
1506
+
1507
+ .eth-dev-code-editor__gutter {
1508
+ padding-block: var(--eth-space-md);
1509
+ }
1510
+ }
1511
+
1512
+ .eth-dev-yaml-viewer {
1513
+ background: var(--eth-color-layer-01);
1514
+ border: 1px solid var(--eth-color-border-subtle);
1515
+ border-block-end-color: var(--eth-color-border-strong);
1516
+ color: var(--eth-color-text-primary);
1517
+ display: grid;
1518
+ font-family: var(--eth-font-family);
1519
+ inline-size: min(100%, 56rem);
1520
+ min-inline-size: 0;
1521
+ }
1522
+
1523
+ .eth-dev-yaml-viewer__header {
1524
+ align-items: center;
1525
+ background: var(--eth-color-layer-02);
1526
+ border-block-end: 1px solid var(--eth-color-border-subtle);
1527
+ display: grid;
1528
+ gap: var(--eth-space-md);
1529
+ grid-template-columns: minmax(0, 1fr) auto;
1530
+ min-block-size: 3rem;
1531
+ min-inline-size: 0;
1532
+ padding: var(--eth-space-sm) var(--eth-space-sm)
1533
+ var(--eth-space-sm) var(--eth-space-lg);
1534
+ }
1535
+
1536
+ .eth-dev-yaml-viewer__heading {
1537
+ display: grid;
1538
+ gap: var(--eth-space-2xs);
1539
+ min-inline-size: 0;
1540
+ }
1541
+
1542
+ .eth-dev-yaml-viewer__eyebrow {
1543
+ color: var(--eth-color-text-secondary);
1544
+ font-family: var(--eth-font-mono);
1545
+ font-size: calc(0.6875rem * var(--eth-text-scale, 1));
1546
+ font-weight: 600;
1547
+ letter-spacing: 0;
1548
+ line-height: 1.45;
1549
+ text-transform: uppercase;
1550
+ }
1551
+
1552
+ .eth-dev-yaml-viewer__title {
1553
+ color: var(--eth-color-text-primary);
1554
+ font-size: calc(0.875rem * var(--eth-text-scale, 1));
1555
+ font-weight: 600;
1556
+ line-height: 1.4286;
1557
+ min-inline-size: 0;
1558
+ overflow: hidden;
1559
+ text-overflow: ellipsis;
1560
+ white-space: nowrap;
1561
+ }
1562
+
1563
+ .eth-dev-yaml-viewer__meta {
1564
+ align-items: center;
1565
+ display: flex;
1566
+ flex-wrap: wrap;
1567
+ gap: var(--eth-space-sm);
1568
+ justify-content: end;
1569
+ min-inline-size: 0;
1570
+ }
1571
+
1572
+ .eth-dev-yaml-viewer__badge {
1573
+ background: var(--eth-color-layer-01);
1574
+ border: 1px solid var(--eth-color-border-subtle);
1575
+ color: var(--eth-color-text-secondary);
1576
+ font-size: calc(0.75rem * var(--eth-text-scale, 1));
1577
+ line-height: 1.333;
1578
+ max-inline-size: 10rem;
1579
+ min-block-size: 1.5rem;
1580
+ min-inline-size: 0;
1581
+ overflow: hidden;
1582
+ padding: var(--eth-space-2xs) var(--eth-space-sm);
1583
+ text-overflow: ellipsis;
1584
+ white-space: nowrap;
1585
+ }
1586
+
1587
+ .eth-dev-yaml-viewer__copy-button.eth-icon-button {
1588
+ block-size: 2rem;
1589
+ flex: 0 0 auto;
1590
+ inline-size: 2rem;
1591
+ min-inline-size: 2rem;
1592
+ }
1593
+
1594
+ .eth-dev-yaml-viewer__copy-status {
1595
+ block-size: 1px;
1596
+ clip-path: inset(50%);
1597
+ inline-size: 1px;
1598
+ overflow: hidden;
1599
+ position: absolute;
1600
+ white-space: nowrap;
1601
+ }
1602
+
1603
+ .eth-dev-yaml-viewer__pre {
1604
+ background: var(--eth-color-layer-01);
1605
+ color: var(--eth-color-text-primary);
1606
+ font-family: var(--eth-font-mono);
1607
+ font-size: calc(0.875rem * var(--eth-text-scale, 1));
1608
+ line-height: 1.4286;
1609
+ margin: 0;
1610
+ max-block-size: 28rem;
1611
+ min-block-size: 0;
1612
+ min-inline-size: 0;
1613
+ outline: 2px solid transparent;
1614
+ outline-offset: -2px;
1615
+ overflow: auto;
1616
+ padding-block: var(--eth-space-md);
1617
+ tab-size: 2;
1618
+ }
1619
+
1620
+ .eth-dev-yaml-viewer__pre:focus-visible {
1621
+ outline-color: var(--eth-color-focus);
1622
+ }
1623
+
1624
+ .eth-dev-yaml-viewer__code {
1625
+ display: grid;
1626
+ font-family: inherit;
1627
+ inline-size: max-content;
1628
+ min-inline-size: 100%;
1629
+ }
1630
+
1631
+ .eth-dev-yaml-viewer__line {
1632
+ align-items: start;
1633
+ display: grid;
1634
+ grid-template-columns: 3.5rem max-content;
1635
+ min-block-size: 1.5rem;
1636
+ }
1637
+
1638
+ .eth-dev-yaml-viewer__line:hover {
1639
+ background: var(--eth-color-layer-02);
1640
+ }
1641
+
1642
+ .eth-dev-yaml-viewer__gutter {
1643
+ border-inline-end: 1px solid var(--eth-color-border-subtle);
1644
+ color: var(--eth-color-text-secondary);
1645
+ font-variant-numeric: tabular-nums;
1646
+ padding-inline: var(--eth-space-md);
1647
+ text-align: end;
1648
+ user-select: none;
1649
+ }
1650
+
1651
+ .eth-dev-yaml-viewer__line-code {
1652
+ color: inherit;
1653
+ padding-inline: var(--eth-space-lg);
1654
+ white-space: pre;
1655
+ }
1656
+
1657
+ .eth-dev-yaml-viewer__token--key {
1658
+ color: #0043ce;
1659
+ font-weight: 600;
1660
+ }
1661
+
1662
+ .eth-dev-yaml-viewer__token--marker {
1663
+ color: #d02670;
1664
+ font-weight: 600;
1665
+ }
1666
+
1667
+ .eth-dev-yaml-viewer__token--punctuation,
1668
+ .eth-dev-yaml-viewer__token--plain {
1669
+ color: var(--eth-color-text-primary);
1670
+ }
1671
+
1672
+ .eth-dev-yaml-viewer__token--string {
1673
+ color: #198038;
1674
+ }
1675
+
1676
+ .eth-dev-yaml-viewer__token--number {
1677
+ color: #8a3ffc;
1678
+ }
1679
+
1680
+ .eth-dev-yaml-viewer__token--boolean {
1681
+ color: #0f62fe;
1682
+ font-weight: 600;
1683
+ }
1684
+
1685
+ .eth-dev-yaml-viewer__token--null,
1686
+ .eth-dev-yaml-viewer__token--comment {
1687
+ color: var(--eth-color-text-secondary);
1688
+ }
1689
+
1690
+ .eth-dev-yaml-viewer__token--null {
1691
+ font-style: italic;
1692
+ }
1693
+
1694
+ .eth-dev-yaml-viewer__token--comment {
1695
+ font-style: italic;
1696
+ }
1697
+
1698
+ .eth-dev-yaml-viewer__editor.eth-dev-code-editor {
1699
+ border: 0;
1700
+ border-block-end: 0;
1701
+ inline-size: 100%;
1702
+ min-inline-size: 0;
1703
+ }
1704
+
1705
+ .eth-dev-yaml-viewer__editor .eth-dev-code-editor__header {
1706
+ display: none;
1707
+ }
1708
+
1709
+ .eth-dev-yaml-viewer__editor .eth-dev-code-editor__body,
1710
+ .eth-dev-yaml-viewer__editor .eth-dev-code-editor__textarea {
1711
+ min-block-size: 12rem;
1712
+ }
1713
+
1714
+ @media (width <= 640px) {
1715
+ .eth-dev-yaml-viewer {
1716
+ inline-size: 100%;
1717
+ }
1718
+
1719
+ .eth-dev-yaml-viewer__header {
1720
+ align-items: start;
1721
+ grid-template-columns: 1fr;
1722
+ padding: var(--eth-space-md);
1723
+ }
1724
+
1725
+ .eth-dev-yaml-viewer__meta {
1726
+ justify-content: start;
1727
+ }
1728
+
1729
+ .eth-dev-yaml-viewer__line {
1730
+ grid-template-columns: 2.75rem max-content;
1731
+ }
1732
+
1733
+ .eth-dev-yaml-viewer__gutter {
1734
+ padding-inline: var(--eth-space-sm);
1735
+ }
1736
+
1737
+ .eth-dev-yaml-viewer__line-code {
1738
+ padding-inline: var(--eth-space-md);
1739
+ }
1740
+ }
1741
+
1742
+ .eth-dev-code-block {
1743
+ background: var(--eth-color-layer-02);
1744
+ border: 1px solid var(--eth-color-border-subtle);
1745
+ color: var(--eth-color-text-primary);
1746
+ display: grid;
1747
+ font-family: var(--eth-font-family);
1748
+ inline-size: 100%;
1749
+ min-inline-size: 0;
1750
+ }
1751
+
1752
+ .eth-dev-code-block__header {
1753
+ align-items: center;
1754
+ background: var(--eth-color-layer-02);
1755
+ border-block-end: 1px solid var(--eth-color-border-subtle);
1756
+ display: flex;
1757
+ gap: var(--eth-space-sm);
1758
+ justify-content: space-between;
1759
+ min-block-size: 2.5rem;
1760
+ min-inline-size: 0;
1761
+ padding-inline: var(--eth-space-lg) var(--eth-space-sm);
1762
+ }
1763
+
1764
+ .eth-dev-code-block__language {
1765
+ color: var(--eth-color-text-secondary);
1766
+ font-size: calc(0.75rem * var(--eth-text-scale, 1));
1767
+ font-weight: 600;
1768
+ letter-spacing: 0;
1769
+ line-height: 1.333;
1770
+ min-inline-size: 0;
1771
+ overflow: hidden;
1772
+ text-overflow: ellipsis;
1773
+ text-transform: uppercase;
1774
+ white-space: nowrap;
1775
+ }
1776
+
1777
+ .eth-dev-code-block__copy-button.eth-icon-button {
1778
+ block-size: 2rem;
1779
+ flex: 0 0 auto;
1780
+ inline-size: 2rem;
1781
+ min-inline-size: 2rem;
1782
+ }
1783
+
1784
+ .eth-dev-code-block__copy-status {
1785
+ block-size: 1px;
1786
+ clip-path: inset(50%);
1787
+ inline-size: 1px;
1788
+ overflow: hidden;
1789
+ position: absolute;
1790
+ white-space: nowrap;
1791
+ }
1792
+
1793
+ .eth-dev-code-block__pre {
1794
+ background: var(--eth-color-layer-01);
1795
+ color: var(--eth-color-text-primary);
1796
+ font-family: var(--eth-font-mono);
1797
+ font-size: calc(0.875rem * var(--eth-text-scale, 1));
1798
+ line-height: 1.4286;
1799
+ margin: 0;
1800
+ max-block-size: 28rem;
1801
+ min-block-size: 0;
1802
+ min-inline-size: 0;
1803
+ overflow: auto;
1804
+ padding-block: var(--eth-space-md);
1805
+ tab-size: 2;
1806
+ }
1807
+
1808
+ .eth-dev-code-block__code {
1809
+ display: grid;
1810
+ font-family: inherit;
1811
+ inline-size: max-content;
1812
+ min-inline-size: 100%;
1813
+ }
1814
+
1815
+ .eth-dev-code-block__line {
1816
+ align-items: start;
1817
+ display: grid;
1818
+ min-block-size: 1.5rem;
1819
+ }
1820
+
1821
+ .eth-dev-code-block--numbered .eth-dev-code-block__line {
1822
+ grid-template-columns: 3.5rem max-content;
1823
+ }
1824
+
1825
+ .eth-dev-code-block:not(.eth-dev-code-block--numbered) .eth-dev-code-block__line {
1826
+ padding-inline: var(--eth-space-lg);
1827
+ }
1828
+
1829
+ .eth-dev-code-block__line:hover {
1830
+ background: var(--eth-color-layer-02);
1831
+ }
1832
+
1833
+ .eth-dev-code-block__gutter {
1834
+ border-inline-end: 1px solid var(--eth-color-border-subtle);
1835
+ color: var(--eth-color-text-secondary);
1836
+ font-variant-numeric: tabular-nums;
1837
+ padding-inline: var(--eth-space-md);
1838
+ text-align: end;
1839
+ user-select: none;
1840
+ }
1841
+
1842
+ .eth-dev-code-block__line-code {
1843
+ color: inherit;
1844
+ padding-inline-end: var(--eth-space-lg);
1845
+ white-space: pre;
1846
+ }
1847
+
1848
+ .eth-dev-code-block--numbered .eth-dev-code-block__line-code {
1849
+ padding-inline-start: var(--eth-space-lg);
1850
+ }
1851
+
1852
+ .eth-dev-code-block__token--keyword {
1853
+ color: #0043ce;
1854
+ font-weight: 600;
1855
+ }
1856
+
1857
+ .eth-dev-code-block__token--string {
1858
+ color: #198038;
1859
+ }
1860
+
1861
+ .eth-dev-code-block__token--number {
1862
+ color: #8a3ffc;
1863
+ }
1864
+
1865
+ .eth-dev-code-block__token--comment {
1866
+ color: var(--eth-color-text-secondary);
1867
+ font-style: italic;
1868
+ }
1869
+
1870
+ .eth-dev-log-console {
1871
+
1872
+ background: var(--eth-color-layer-01);
1873
+ border: 1px solid var(--eth-color-border-subtle);
1874
+ color: var(--eth-color-text-primary);
1875
+ display: grid;
1876
+ font-family: var(--eth-font-family);
1877
+ inline-size: 100%;
1878
+ max-inline-size: 72rem;
1879
+ min-inline-size: 0;
1880
+ overflow: hidden;
1881
+ }
1882
+
1883
+ .eth-dev-log-console:focus-visible {
1884
+ outline: 2px solid var(--eth-color-focus);
1885
+ outline-offset: -2px;
1886
+ }
1887
+
1888
+ .eth-dev-log-console .eth-badge {
1889
+ margin: 0;
1890
+ }
1891
+
1892
+ .eth-dev-log-console__header {
1893
+ align-items: flex-start;
1894
+ border-block-end: 1px solid var(--eth-color-border-subtle);
1895
+ display: flex;
1896
+ gap: var(--eth-space-lg);
1897
+ justify-content: space-between;
1898
+ min-inline-size: 0;
1899
+ padding: var(--eth-space-lg);
1900
+ }
1901
+
1902
+ .eth-dev-log-console__heading {
1903
+ display: grid;
1904
+ gap: var(--eth-space-xs);
1905
+ min-inline-size: 0;
1906
+ }
1907
+
1908
+ .eth-dev-log-console__eyebrow,
1909
+ .eth-dev-log-console__heading h3,
1910
+ .eth-dev-log-console__heading p,
1911
+ .eth-dev-log-console__summary,
1912
+ .eth-dev-log-console__summary dd,
1913
+ .eth-dev-log-console__empty h4,
1914
+ .eth-dev-log-console__empty p {
1915
+ margin: 0;
1916
+ }
1917
+
1918
+ .eth-dev-log-console__eyebrow {
1919
+ color: var(--eth-color-link);
1920
+ font-size: calc(0.75rem * var(--eth-text-scale, 1));
1921
+ font-weight: 600;
1922
+ letter-spacing: 0;
1923
+ line-height: 1.333;
1924
+ text-transform: uppercase;
1925
+ }
1926
+
1927
+ .eth-dev-log-console__heading h3 {
1928
+ color: var(--eth-color-text-primary);
1929
+ font-size: calc(1.25rem * var(--eth-text-scale, 1));
1930
+ font-weight: 400;
1931
+ line-height: 1.4;
1932
+ }
1933
+
1934
+ .eth-dev-log-console__heading p,
1935
+ .eth-dev-log-console__status,
1936
+ .eth-dev-log-console__summary dt,
1937
+ .eth-dev-log-console__empty p {
1938
+ color: var(--eth-color-text-secondary);
1939
+ font-size: calc(0.875rem * var(--eth-text-scale, 1));
1940
+ line-height: 1.4286;
1941
+ }
1942
+
1943
+ .eth-dev-log-console__status {
1944
+ align-items: center;
1945
+ display: inline-flex;
1946
+ flex: 0 0 auto;
1947
+ flex-wrap: wrap;
1948
+ gap: var(--eth-space-sm);
1949
+ justify-content: flex-end;
1950
+ min-block-size: 2rem;
1951
+ min-inline-size: 0;
1952
+ }
1953
+
1954
+ .eth-dev-log-console__toolbar {
1955
+ align-items: end;
1956
+ background: var(--eth-color-layer-02);
1957
+ border-block-end: 1px solid var(--eth-color-border-subtle);
1958
+ display: flex;
1959
+ flex-wrap: wrap;
1960
+ gap: var(--eth-space-md);
1961
+ justify-content: space-between;
1962
+ min-inline-size: 0;
1963
+ padding: var(--eth-space-md) var(--eth-space-lg);
1964
+ }
1965
+
1966
+ .eth-dev-log-console__filters {
1967
+ align-items: end;
1968
+ display: flex;
1969
+ flex: 1 1 auto;
1970
+ flex-wrap: wrap;
1971
+ gap: var(--eth-space-md);
1972
+ min-inline-size: 0;
1973
+ }
1974
+
1975
+ .eth-dev-log-console__filters :where(label) {
1976
+ color: var(--eth-color-text-secondary);
1977
+ display: grid;
1978
+ font-size: calc(0.75rem * var(--eth-text-scale, 1));
1979
+ font-weight: 600;
1980
+ gap: var(--eth-space-xs);
1981
+ line-height: 1.333;
1982
+ }
1983
+
1984
+ .eth-dev-log-console__filters :where(select, input) {
1985
+ background: var(--eth-color-layer-01);
1986
+ block-size: 2rem;
1987
+ border: 0;
1988
+ border-block-end: 1px solid var(--eth-color-border-strong);
1989
+ color: var(--eth-color-text-primary);
1990
+ font: inherit;
1991
+ font-size: calc(0.875rem * var(--eth-text-scale, 1));
1992
+ inline-size: min(14rem, 100%);
1993
+ min-inline-size: 10rem;
1994
+ padding-inline: var(--eth-space-md);
1995
+ }
1996
+
1997
+ .eth-dev-log-console__filters :where(select, input):focus {
1998
+ outline: 2px solid var(--eth-color-focus);
1999
+ outline-offset: -2px;
2000
+ }
2001
+
2002
+ .eth-dev-log-console__toolbar .eth-button {
2003
+ flex: 0 0 auto;
2004
+ min-inline-size: 9rem;
2005
+ }
2006
+
2007
+ .eth-dev-log-console__summary {
2008
+ background: var(--eth-color-layer-01);
2009
+ border-block-end: 1px solid var(--eth-color-border-subtle);
2010
+ display: grid;
2011
+ grid-template-columns: repeat(4, minmax(0, 1fr));
2012
+ }
2013
+
2014
+ .eth-dev-log-console__summary > div {
2015
+ display: grid;
2016
+ gap: var(--eth-space-xs);
2017
+ min-inline-size: 0;
2018
+ padding: var(--eth-space-md) var(--eth-space-lg);
2019
+ }
2020
+
2021
+ .eth-dev-log-console__summary > div + div {
2022
+ border-inline-start: 1px solid var(--eth-color-border-subtle);
2023
+ }
2024
+
2025
+ .eth-dev-log-console__summary dt {
2026
+ font-size: calc(0.75rem * var(--eth-text-scale, 1));
2027
+ font-weight: 600;
2028
+ letter-spacing: 0;
2029
+ line-height: 1.333;
2030
+ }
2031
+
2032
+ .eth-dev-log-console__summary dd {
2033
+ color: var(--eth-color-text-primary);
2034
+ font-family: var(--eth-font-mono);
2035
+ font-size: calc(1rem * var(--eth-text-scale, 1));
2036
+ font-weight: 600;
2037
+ line-height: 1.375;
2038
+ min-inline-size: 0;
2039
+ overflow: hidden;
2040
+ text-overflow: ellipsis;
2041
+ white-space: nowrap;
2042
+ }
2043
+
2044
+ .eth-dev-log-console__viewport {
2045
+ background: var(--eth-color-layer-01);
2046
+ inline-size: 100%;
2047
+ max-block-size: 28rem;
2048
+ min-block-size: 13rem;
2049
+ min-inline-size: 0;
2050
+ overflow: auto;
2051
+ }
2052
+
2053
+ .eth-dev-log-console__entries {
2054
+ display: grid;
2055
+ font-family: var(--eth-font-mono);
2056
+ inline-size: max-content;
2057
+ min-inline-size: 100%;
2058
+ padding-block: var(--eth-space-sm);
2059
+ }
2060
+
2061
+ .eth-dev-log-console__entry {
2062
+ align-items: start;
2063
+ border-inline-start: 0.25rem solid transparent;
2064
+ column-gap: var(--eth-space-md);
2065
+ display: grid;
2066
+ font-size: calc(0.8125rem * var(--eth-text-scale, 1));
2067
+ grid-template-columns: 5.5rem 4.75rem minmax(7rem, 10rem) minmax(18rem, 1fr);
2068
+ line-height: 1.5385;
2069
+ min-block-size: 2rem;
2070
+ min-inline-size: 42rem;
2071
+ padding: var(--eth-space-xs) var(--eth-space-lg) var(--eth-space-xs)
2072
+ var(--eth-space-md);
2073
+ }
2074
+
2075
+ .eth-dev-log-console__entry:hover {
2076
+ background: var(--eth-color-layer-02);
2077
+ }
2078
+
2079
+ .eth-dev-log-console__timestamp,
2080
+ .eth-dev-log-console__level,
2081
+ .eth-dev-log-console__source,
2082
+ .eth-dev-log-console__message {
2083
+ min-inline-size: 0;
2084
+ }
2085
+
2086
+ .eth-dev-log-console__timestamp {
2087
+ color: var(--eth-color-text-secondary);
2088
+ font-variant-numeric: tabular-nums;
2089
+ white-space: nowrap;
2090
+ }
2091
+
2092
+ .eth-dev-log-console__level {
2093
+ font-weight: 600;
2094
+ text-transform: uppercase;
2095
+ white-space: nowrap;
2096
+ }
2097
+
2098
+ .eth-dev-log-console__source {
2099
+ color: var(--eth-color-text-secondary);
2100
+ overflow: hidden;
2101
+ text-overflow: ellipsis;
2102
+ white-space: nowrap;
2103
+ }
2104
+
2105
+ .eth-dev-log-console__message {
2106
+ color: var(--eth-color-text-primary);
2107
+ font-family: inherit;
2108
+ overflow-wrap: anywhere;
2109
+ white-space: pre-wrap;
2110
+ }
2111
+
2112
+ .eth-dev-log-console__entry--debug .eth-dev-log-console__level {
2113
+ color: var(--eth-color-text-secondary);
2114
+ }
2115
+
2116
+ .eth-dev-log-console__entry--info .eth-dev-log-console__level,
2117
+ .eth-dev-log-console__entry--stdout .eth-dev-log-console__level {
2118
+ color: var(--eth-color-info);
2119
+ }
2120
+
2121
+ .eth-dev-log-console__entry--warn {
2122
+ background: color-mix(
2123
+ in srgb,
2124
+ var(--eth-color-warning) 8%,
2125
+ var(--eth-color-layer-01)
2126
+ );
2127
+ border-inline-start-color: var(--eth-color-warning);
2128
+ }
2129
+
2130
+ .eth-dev-log-console__entry--warn .eth-dev-log-console__level {
2131
+ color: var(--eth-color-warning);
2132
+ }
2133
+
2134
+ .eth-dev-log-console__entry--error,
2135
+ .eth-dev-log-console__entry--stderr {
2136
+ background: color-mix(
2137
+ in srgb,
2138
+ var(--eth-color-danger) 7%,
2139
+ var(--eth-color-layer-01)
2140
+ );
2141
+ border-inline-start-color: var(--eth-color-danger);
2142
+ }
2143
+
2144
+ .eth-dev-log-console__entry--error .eth-dev-log-console__level,
2145
+ .eth-dev-log-console__entry--stderr .eth-dev-log-console__level {
2146
+ color: var(--eth-color-danger);
2147
+ }
2148
+
2149
+ .eth-dev-log-console__entry--stdout {
2150
+ border-inline-start-color: var(--eth-color-info);
2151
+ }
2152
+
2153
+ .eth-dev-log-console__empty {
2154
+ align-content: center;
2155
+ display: grid;
2156
+ gap: var(--eth-space-xs);
2157
+ min-block-size: 13rem;
2158
+ padding: var(--eth-space-xl);
2159
+ }
2160
+
2161
+ .eth-dev-log-console__empty h4 {
2162
+ color: var(--eth-color-text-primary);
2163
+ font-size: calc(1rem * var(--eth-text-scale, 1));
2164
+ font-weight: 600;
2165
+ line-height: 1.375;
2166
+ }
2167
+
2168
+ @media (width <= 48rem) {
2169
+ .eth-dev-log-console__header {
2170
+ align-items: stretch;
2171
+ flex-direction: column;
2172
+ }
2173
+
2174
+ .eth-dev-log-console__status {
2175
+ justify-content: flex-start;
2176
+ }
2177
+
2178
+ .eth-dev-log-console__summary {
2179
+ grid-template-columns: repeat(2, minmax(0, 1fr));
2180
+ }
2181
+
2182
+ .eth-dev-log-console__summary > div:nth-child(2n + 1) {
2183
+ border-inline-start: 0;
2184
+ }
2185
+
2186
+ .eth-dev-log-console__summary > div:nth-child(n + 3) {
2187
+ border-block-start: 1px solid var(--eth-color-border-subtle);
2188
+ }
2189
+ }
2190
+
2191
+ @media (width <= 32rem) {
2192
+ .eth-dev-log-console__toolbar {
2193
+ align-items: stretch;
2194
+ display: grid;
2195
+ }
2196
+
2197
+ .eth-dev-log-console__filters,
2198
+ .eth-dev-log-console__filters :where(label, select, input),
2199
+ .eth-dev-log-console__toolbar .eth-button {
2200
+ inline-size: 100%;
2201
+ }
2202
+
2203
+ .eth-dev-log-console__summary {
2204
+ grid-template-columns: 1fr;
2205
+ }
2206
+
2207
+ .eth-dev-log-console__summary > div + div {
2208
+ border-block-start: 1px solid var(--eth-color-border-subtle);
2209
+ border-inline-start: 0;
2210
+ }
2211
+ }
2212
+
2213
+ .eth-dev-terminal-panel {
2214
+
2215
+ background: var(--eth-color-layer-01);
2216
+ border: 1px solid var(--eth-color-border-subtle);
2217
+ border-block-end-color: var(--eth-color-border-strong);
2218
+ color: var(--eth-color-text-primary);
2219
+ display: grid;
2220
+ font-family: var(--eth-font-family);
2221
+ inline-size: 100%;
2222
+ min-inline-size: 0;
2223
+ overflow: hidden;
2224
+ }
2225
+
2226
+ .eth-dev-terminal-panel__header {
2227
+ align-items: flex-start;
2228
+ border-block-end: 1px solid var(--eth-color-border-subtle);
2229
+ display: flex;
2230
+ gap: var(--eth-space-lg);
2231
+ justify-content: space-between;
2232
+ min-inline-size: 0;
2233
+ padding: var(--eth-space-lg);
2234
+ }
2235
+
2236
+ .eth-dev-terminal-panel__heading {
2237
+ display: grid;
2238
+ gap: var(--eth-space-xs);
2239
+ min-inline-size: 0;
2240
+ }
2241
+
2242
+ .eth-dev-terminal-panel__eyebrow,
2243
+ .eth-dev-terminal-panel__heading h3,
2244
+ .eth-dev-terminal-panel__heading p,
2245
+ .eth-dev-terminal-panel__summary,
2246
+ .eth-dev-terminal-panel__summary dd,
2247
+ .eth-dev-terminal-panel__output,
2248
+ .eth-dev-terminal-panel__empty h4,
2249
+ .eth-dev-terminal-panel__empty p {
2250
+ margin: 0;
2251
+ }
2252
+
2253
+ .eth-dev-terminal-panel__eyebrow {
2254
+ color: var(--eth-color-link);
2255
+ font-size: calc(0.75rem * var(--eth-text-scale, 1));
2256
+ font-weight: 600;
2257
+ letter-spacing: 0;
2258
+ line-height: 1.333;
2259
+ text-transform: uppercase;
2260
+ }
2261
+
2262
+ .eth-dev-terminal-panel__heading h3 {
2263
+ color: var(--eth-color-text-primary);
2264
+ font-size: calc(1.25rem * var(--eth-text-scale, 1));
2265
+ font-weight: 400;
2266
+ line-height: 1.4;
2267
+ }
2268
+
2269
+ .eth-dev-terminal-panel__heading p,
2270
+ .eth-dev-terminal-panel__status,
2271
+ .eth-dev-terminal-panel__summary dt,
2272
+ .eth-dev-terminal-panel__empty p {
2273
+ color: var(--eth-color-text-secondary);
2274
+ font-size: calc(0.875rem * var(--eth-text-scale, 1));
2275
+ line-height: 1.4286;
2276
+ }
2277
+
2278
+ .eth-dev-terminal-panel__status {
2279
+ align-items: center;
2280
+ background: var(--eth-color-layer-02);
2281
+ border: 1px solid var(--eth-color-border-subtle);
2282
+ display: inline-flex;
2283
+ flex: 0 0 auto;
2284
+ gap: var(--eth-space-xs);
2285
+ min-block-size: 2rem;
2286
+ padding-inline: var(--eth-space-md);
2287
+ white-space: nowrap;
2288
+ }
2289
+
2290
+ .eth-dev-terminal-panel__status-indicator {
2291
+ background: var(--eth-color-success);
2292
+ block-size: 0.5rem;
2293
+ border-radius: 50%;
2294
+ flex: 0 0 0.5rem;
2295
+ inline-size: 0.5rem;
2296
+ }
2297
+
2298
+ .eth-dev-terminal-panel--disabled .eth-dev-terminal-panel__status-indicator {
2299
+ background: #8d8d8d;
2300
+ }
2301
+
2302
+ .eth-dev-terminal-panel__summary {
2303
+ background: var(--eth-color-layer-02);
2304
+ border-block-end: 1px solid var(--eth-color-border-subtle);
2305
+ display: grid;
2306
+ grid-template-columns: repeat(3, minmax(0, 1fr));
2307
+ }
2308
+
2309
+ .eth-dev-terminal-panel__summary > div {
2310
+ display: grid;
2311
+ gap: var(--eth-space-xs);
2312
+ min-inline-size: 0;
2313
+ padding: var(--eth-space-md) var(--eth-space-lg);
2314
+ }
2315
+
2316
+ .eth-dev-terminal-panel__summary > div + div {
2317
+ border-inline-start: 1px solid var(--eth-color-border-subtle);
2318
+ }
2319
+
2320
+ .eth-dev-terminal-panel__summary dt {
2321
+ font-size: calc(0.75rem * var(--eth-text-scale, 1));
2322
+ font-weight: 600;
2323
+ letter-spacing: 0;
2324
+ line-height: 1.333;
2325
+ }
2326
+
2327
+ .eth-dev-terminal-panel__summary dd {
2328
+ color: var(--eth-color-text-primary);
2329
+ font-family: var(--eth-font-mono);
2330
+ font-size: calc(1rem * var(--eth-text-scale, 1));
2331
+ font-weight: 600;
2332
+ line-height: 1.375;
2333
+ min-inline-size: 0;
2334
+ overflow: hidden;
2335
+ text-overflow: ellipsis;
2336
+ white-space: nowrap;
2337
+ }
2338
+
2339
+ .eth-dev-terminal-panel__viewport {
2340
+ background: var(--eth-color-layer-01);
2341
+ inline-size: 100%;
2342
+ max-block-size: 30rem;
2343
+ min-block-size: 14rem;
2344
+ min-inline-size: 0;
2345
+ overflow: auto;
2346
+ }
2347
+
2348
+ .eth-dev-terminal-panel__output {
2349
+ background: transparent;
2350
+ color: var(--eth-color-text-primary);
2351
+ font-family: var(--eth-font-mono);
2352
+ font-size: calc(0.875rem * var(--eth-text-scale, 1));
2353
+ line-height: 1.4286;
2354
+ min-block-size: 14rem;
2355
+ min-inline-size: 0;
2356
+ padding-block: var(--eth-space-sm);
2357
+ tab-size: 2;
2358
+ }
2359
+
2360
+ .eth-dev-terminal-panel__output-code {
2361
+ display: grid;
2362
+ font-family: inherit;
2363
+ inline-size: 100%;
2364
+ min-inline-size: 0;
2365
+ }
2366
+
2367
+ .eth-dev-terminal-panel__line {
2368
+ align-items: start;
2369
+ border-inline-start: 0.25rem solid transparent;
2370
+ column-gap: var(--eth-space-md);
2371
+ display: grid;
2372
+ grid-template-columns: 3.5rem minmax(0, 1fr);
2373
+ min-block-size: 1.75rem;
2374
+ min-inline-size: 0;
2375
+ padding: var(--eth-space-xs) var(--eth-space-lg) var(--eth-space-xs)
2376
+ var(--eth-space-md);
2377
+ }
2378
+
2379
+ .eth-dev-terminal-panel__line:hover {
2380
+ background: var(--eth-color-layer-02);
2381
+ }
2382
+
2383
+ .eth-dev-terminal-panel__line--stderr {
2384
+ background: color-mix(
2385
+ in srgb,
2386
+ var(--eth-color-danger) 7%,
2387
+ var(--eth-color-layer-01)
2388
+ );
2389
+ border-inline-start-color: var(--eth-color-danger);
2390
+ }
2391
+
2392
+ .eth-dev-terminal-panel__stream {
2393
+ color: var(--eth-color-text-secondary);
2394
+ font-size: calc(0.75rem * var(--eth-text-scale, 1));
2395
+ font-weight: 600;
2396
+ line-height: 1.6667;
2397
+ text-align: end;
2398
+ user-select: none;
2399
+ white-space: nowrap;
2400
+ }
2401
+
2402
+ .eth-dev-terminal-panel__line--stderr .eth-dev-terminal-panel__stream {
2403
+ color: var(--eth-color-danger);
2404
+ }
2405
+
2406
+ .eth-dev-terminal-panel__line-text {
2407
+ color: inherit;
2408
+ min-inline-size: 0;
2409
+ overflow-wrap: anywhere;
2410
+ white-space: pre-wrap;
2411
+ }
2412
+
2413
+ .eth-dev-terminal-panel__empty {
2414
+ align-content: center;
2415
+ display: grid;
2416
+ gap: var(--eth-space-xs);
2417
+ min-block-size: 14rem;
2418
+ padding: var(--eth-space-xl);
2419
+ }
2420
+
2421
+ .eth-dev-terminal-panel__empty h4 {
2422
+ color: var(--eth-color-text-primary);
2423
+ font-size: calc(1rem * var(--eth-text-scale, 1));
2424
+ font-weight: 600;
2425
+ line-height: 1.375;
2426
+ }
2427
+
2428
+ .eth-dev-terminal-panel__input {
2429
+ align-items: center;
2430
+ background: var(--eth-color-layer-02);
2431
+ border-block-start: 1px solid var(--eth-color-border-subtle);
2432
+ display: grid;
2433
+ gap: var(--eth-space-sm);
2434
+ grid-template-columns: auto minmax(0, 1fr) auto;
2435
+ min-inline-size: 0;
2436
+ padding: var(--eth-space-md) var(--eth-space-lg);
2437
+ }
2438
+
2439
+ .eth-dev-terminal-panel__prompt {
2440
+ color: var(--eth-color-text-secondary);
2441
+ font-family: var(--eth-font-mono);
2442
+ font-size: calc(0.875rem * var(--eth-text-scale, 1));
2443
+ font-weight: 600;
2444
+ inline-size: 1.5rem;
2445
+ line-height: 1.4286;
2446
+ text-align: end;
2447
+ white-space: nowrap;
2448
+ }
2449
+
2450
+ .eth-dev-terminal-panel__input input {
2451
+ background: var(--eth-color-layer-01);
2452
+ block-size: 2.5rem;
2453
+ border: 0;
2454
+ border-block-end: 1px solid var(--eth-color-border-strong);
2455
+ color: var(--eth-color-text-primary);
2456
+ font-family: var(--eth-font-mono);
2457
+ font-size: calc(0.875rem * var(--eth-text-scale, 1));
2458
+ inline-size: 100%;
2459
+ line-height: 1.4286;
2460
+ min-inline-size: 0;
2461
+ padding-inline: var(--eth-space-md);
2462
+ }
2463
+
2464
+ .eth-dev-terminal-panel__input input::placeholder {
2465
+ color: var(--eth-color-text-secondary);
2466
+ }
2467
+
2468
+ .eth-dev-terminal-panel__input input:focus {
2469
+ outline: 2px solid var(--eth-color-focus);
2470
+ outline-offset: -2px;
2471
+ }
2472
+
2473
+ .eth-dev-terminal-panel__input input:disabled {
2474
+ background: var(--eth-color-layer-02);
2475
+ border-block-end-color: var(--eth-color-border-subtle);
2476
+ color: #8d8d8d;
2477
+ cursor: not-allowed;
2478
+ }
2479
+
2480
+ .eth-dev-terminal-panel__input .eth-button {
2481
+ min-inline-size: 6rem;
2482
+ }
2483
+
2484
+ .eth-dev-terminal-panel__visually-hidden {
2485
+ block-size: 1px;
2486
+ clip-path: inset(50%);
2487
+ inline-size: 1px;
2488
+ overflow: hidden;
2489
+ position: absolute;
2490
+ white-space: nowrap;
2491
+ }
2492
+
2493
+ @media (width <= 48rem) {
2494
+ .eth-dev-terminal-panel__header {
2495
+ align-items: stretch;
2496
+ flex-direction: column;
2497
+ }
2498
+
2499
+ .eth-dev-terminal-panel__status {
2500
+ inline-size: fit-content;
2501
+ }
2502
+
2503
+ .eth-dev-terminal-panel__summary {
2504
+ grid-template-columns: 1fr;
2505
+ }
2506
+
2507
+ .eth-dev-terminal-panel__summary > div + div {
2508
+ border-block-start: 1px solid var(--eth-color-border-subtle);
2509
+ border-inline-start: 0;
2510
+ }
2511
+ }
2512
+
2513
+ @media (width <= 32rem) {
2514
+ .eth-dev-terminal-panel__line {
2515
+ grid-template-columns: 2.75rem minmax(0, 1fr);
2516
+ padding-inline-end: var(--eth-space-md);
2517
+ }
2518
+
2519
+ .eth-dev-terminal-panel__input {
2520
+ grid-template-columns: auto minmax(0, 1fr);
2521
+ }
2522
+
2523
+ .eth-dev-terminal-panel__input .eth-button {
2524
+ grid-column: 1 / -1;
2525
+ inline-size: 100%;
2526
+ }
2527
+ }
2528
+
2529
+ .eth-dev-trace-timeline {
2530
+
2531
+ background: var(--eth-color-layer-01);
2532
+ border: 1px solid var(--eth-color-border-subtle);
2533
+ border-block-end-color: var(--eth-color-border-strong);
2534
+ color: var(--eth-color-text-primary);
2535
+ display: grid;
2536
+ font-family: var(--eth-font-family);
2537
+ inline-size: 100%;
2538
+ min-inline-size: 0;
2539
+ overflow: hidden;
2540
+ }
2541
+
2542
+ .eth-dev-trace-timeline__header {
2543
+ align-items: flex-start;
2544
+ border-block-end: 1px solid var(--eth-color-border-subtle);
2545
+ display: flex;
2546
+ gap: var(--eth-space-lg);
2547
+ justify-content: space-between;
2548
+ min-inline-size: 0;
2549
+ padding: var(--eth-space-lg);
2550
+ }
2551
+
2552
+ .eth-dev-trace-timeline__heading {
2553
+ display: grid;
2554
+ gap: var(--eth-space-xs);
2555
+ min-inline-size: 0;
2556
+ }
2557
+
2558
+ .eth-dev-trace-timeline__eyebrow,
2559
+ .eth-dev-trace-timeline__heading h3,
2560
+ .eth-dev-trace-timeline__heading p,
2561
+ .eth-dev-trace-timeline__summary,
2562
+ .eth-dev-trace-timeline__summary dd,
2563
+ .eth-dev-trace-timeline__empty h4,
2564
+ .eth-dev-trace-timeline__empty p {
2565
+ margin: 0;
2566
+ }
2567
+
2568
+ .eth-dev-trace-timeline__eyebrow {
2569
+ color: var(--eth-color-link);
2570
+ font-size: calc(0.75rem * var(--eth-text-scale, 1));
2571
+ font-weight: 600;
2572
+ letter-spacing: 0;
2573
+ line-height: 1.333;
2574
+ text-transform: uppercase;
2575
+ }
2576
+
2577
+ .eth-dev-trace-timeline__heading h3 {
2578
+ color: var(--eth-color-text-primary);
2579
+ font-size: calc(1.25rem * var(--eth-text-scale, 1));
2580
+ font-weight: 400;
2581
+ line-height: 1.4;
2582
+ }
2583
+
2584
+ .eth-dev-trace-timeline__heading p,
2585
+ .eth-dev-trace-timeline__summary dt,
2586
+ .eth-dev-trace-timeline__axis,
2587
+ .eth-dev-trace-timeline__span-meta,
2588
+ .eth-dev-trace-timeline__empty p {
2589
+ color: var(--eth-color-text-secondary);
2590
+ font-size: calc(0.875rem * var(--eth-text-scale, 1));
2591
+ line-height: 1.4286;
2592
+ }
2593
+
2594
+ .eth-dev-trace-timeline__header .eth-badge {
2595
+ flex: 0 0 auto;
2596
+ margin: 0;
2597
+ }
2598
+
2599
+ .eth-dev-trace-timeline__summary {
2600
+ background: var(--eth-color-layer-02);
2601
+ border-block-end: 1px solid var(--eth-color-border-subtle);
2602
+ display: grid;
2603
+ grid-template-columns: repeat(4, minmax(0, 1fr));
2604
+ }
2605
+
2606
+ .eth-dev-trace-timeline__summary > div {
2607
+ display: grid;
2608
+ gap: var(--eth-space-xs);
2609
+ min-inline-size: 0;
2610
+ padding: var(--eth-space-md) var(--eth-space-lg);
2611
+ }
2612
+
2613
+ .eth-dev-trace-timeline__summary > div + div {
2614
+ border-inline-start: 1px solid var(--eth-color-border-subtle);
2615
+ }
2616
+
2617
+ .eth-dev-trace-timeline__summary dt {
2618
+ font-size: calc(0.75rem * var(--eth-text-scale, 1));
2619
+ font-weight: 600;
2620
+ letter-spacing: 0;
2621
+ line-height: 1.333;
2622
+ }
2623
+
2624
+ .eth-dev-trace-timeline__summary dd {
2625
+ color: var(--eth-color-text-primary);
2626
+ font-family: var(--eth-font-mono);
2627
+ font-size: calc(1rem * var(--eth-text-scale, 1));
2628
+ font-weight: 600;
2629
+ font-variant-numeric: tabular-nums;
2630
+ line-height: 1.375;
2631
+ min-inline-size: 0;
2632
+ overflow: hidden;
2633
+ text-overflow: ellipsis;
2634
+ white-space: nowrap;
2635
+ }
2636
+
2637
+ .eth-dev-trace-timeline__viewport {
2638
+ min-inline-size: 0;
2639
+ overflow: auto;
2640
+ }
2641
+
2642
+ .eth-dev-trace-timeline__axis,
2643
+ .eth-dev-trace-timeline__row {
2644
+ display: grid;
2645
+ grid-template-columns: minmax(14rem, 19rem) minmax(18rem, 1fr);
2646
+ min-inline-size: 46rem;
2647
+ }
2648
+
2649
+ .eth-dev-trace-timeline__axis {
2650
+ align-items: center;
2651
+ background: var(--eth-color-layer-01);
2652
+ border-block-end: 1px solid var(--eth-color-border-subtle);
2653
+ min-block-size: 2.5rem;
2654
+ }
2655
+
2656
+ .eth-dev-trace-timeline__axis > span {
2657
+ color: var(--eth-color-text-secondary);
2658
+ font-size: calc(0.75rem * var(--eth-text-scale, 1));
2659
+ font-weight: 600;
2660
+ line-height: 1.333;
2661
+ padding-inline: var(--eth-space-lg);
2662
+ text-transform: uppercase;
2663
+ }
2664
+
2665
+ .eth-dev-trace-timeline__axis-scale {
2666
+ display: grid;
2667
+ font-size: calc(0.75rem * var(--eth-text-scale, 1));
2668
+ font-variant-numeric: tabular-nums;
2669
+ grid-template-columns: repeat(3, 1fr);
2670
+ line-height: 1.333;
2671
+ padding-inline: var(--eth-space-lg);
2672
+ }
2673
+
2674
+ .eth-dev-trace-timeline__axis-scale span:nth-child(2) {
2675
+ justify-self: center;
2676
+ }
2677
+
2678
+ .eth-dev-trace-timeline__axis-scale span:last-child {
2679
+ justify-self: end;
2680
+ }
2681
+
2682
+ .eth-dev-trace-timeline__rows {
2683
+ display: grid;
2684
+ inline-size: 100%;
2685
+ min-inline-size: 46rem;
2686
+ }
2687
+
2688
+ .eth-dev-trace-timeline__row {
2689
+ align-items: stretch;
2690
+ border-block-end: 1px solid var(--eth-color-border-subtle);
2691
+ min-block-size: 4.5rem;
2692
+ }
2693
+
2694
+ .eth-dev-trace-timeline__row:last-child {
2695
+ border-block-end: 0;
2696
+ }
2697
+
2698
+ .eth-dev-trace-timeline__row:hover {
2699
+ background: var(--eth-color-layer-02);
2700
+ }
2701
+
2702
+ .eth-dev-trace-timeline__label {
2703
+ border-inline-start: 0.25rem solid transparent;
2704
+ display: grid;
2705
+ gap: var(--eth-space-xs);
2706
+ min-inline-size: 0;
2707
+ padding: var(--eth-space-sm) var(--eth-space-lg);
2708
+ padding-inline-start: calc(
2709
+ var(--eth-space-lg) + var(--eth-dev-trace-indent, 0rem)
2710
+ );
2711
+ }
2712
+
2713
+ .eth-dev-trace-timeline__span-title {
2714
+ align-items: center;
2715
+ display: flex;
2716
+ gap: var(--eth-space-sm);
2717
+ min-inline-size: 0;
2718
+ }
2719
+
2720
+ .eth-dev-trace-timeline__span-title .eth-status-dot {
2721
+ flex: 0 0 auto;
2722
+ margin: 0;
2723
+ }
2724
+
2725
+ .eth-dev-trace-timeline__span-title strong {
2726
+ color: var(--eth-color-text-primary);
2727
+ font-family: var(--eth-font-mono);
2728
+ font-size: calc(0.875rem * var(--eth-text-scale, 1));
2729
+ font-weight: 600;
2730
+ line-height: 1.4286;
2731
+ min-inline-size: 0;
2732
+ overflow: hidden;
2733
+ text-overflow: ellipsis;
2734
+ white-space: nowrap;
2735
+ }
2736
+
2737
+ .eth-dev-trace-timeline__span-meta {
2738
+ display: flex;
2739
+ flex-wrap: wrap;
2740
+ gap: var(--eth-space-xs) var(--eth-space-md);
2741
+ min-inline-size: 0;
2742
+ padding-inline-start: var(--eth-dev-trace-indent, 0);
2743
+ }
2744
+
2745
+ .eth-dev-trace-timeline__span-meta span {
2746
+ min-inline-size: 0;
2747
+ overflow: hidden;
2748
+ text-overflow: ellipsis;
2749
+ white-space: nowrap;
2750
+ }
2751
+
2752
+ .eth-dev-trace-timeline__track {
2753
+ align-self: center;
2754
+ background:
2755
+ repeating-linear-gradient(
2756
+ to right,
2757
+ transparent 0,
2758
+ transparent calc(25% - 1px),
2759
+ var(--eth-color-border-subtle) calc(25% - 1px),
2760
+ var(--eth-color-border-subtle) 25%
2761
+ ),
2762
+ var(--eth-color-layer-02);
2763
+ block-size: 1.5rem;
2764
+ margin-inline: var(--eth-space-lg);
2765
+ min-inline-size: 18rem;
2766
+ overflow: hidden;
2767
+ position: relative;
2768
+ }
2769
+
2770
+ .eth-dev-trace-timeline__track:focus-visible {
2771
+ outline: 2px solid var(--eth-color-focus);
2772
+ outline-offset: -2px;
2773
+ }
2774
+
2775
+ .eth-dev-trace-timeline__bar {
2776
+ background: var(--eth-color-info);
2777
+ block-size: 100%;
2778
+ inline-size: var(--eth-dev-trace-width);
2779
+ inset-block-start: 0;
2780
+ inset-inline-start: var(--eth-dev-trace-left);
2781
+ max-inline-size: calc(100% - var(--eth-dev-trace-left));
2782
+ min-inline-size: var(--eth-space-sm);
2783
+ position: absolute;
2784
+ }
2785
+
2786
+ .eth-dev-trace-timeline__bar--completed,
2787
+ .eth-dev-trace-timeline__bar--succeeded,
2788
+ .eth-dev-trace-timeline__bar--synced,
2789
+ .eth-dev-trace-timeline__bar--active {
2790
+ background: var(--eth-color-success);
2791
+ }
2792
+
2793
+ .eth-dev-trace-timeline__bar--warning,
2794
+ .eth-dev-trace-timeline__bar--pending-approval,
2795
+ .eth-dev-trace-timeline__bar--approval-required,
2796
+ .eth-dev-trace-timeline__bar--stale {
2797
+ background: var(--eth-color-warning);
2798
+ }
2799
+
2800
+ .eth-dev-trace-timeline__bar--failed,
2801
+ .eth-dev-trace-timeline__bar--blocked {
2802
+ background: var(--eth-color-danger);
2803
+ }
2804
+
2805
+ .eth-dev-trace-timeline__bar--queued,
2806
+ .eth-dev-trace-timeline__bar--paused,
2807
+ .eth-dev-trace-timeline__bar--not-started,
2808
+ .eth-dev-trace-timeline__bar--inactive {
2809
+ background: var(--eth-color-border-strong);
2810
+ }
2811
+
2812
+ .eth-dev-trace-timeline__row--completed .eth-dev-trace-timeline__label,
2813
+ .eth-dev-trace-timeline__row--succeeded .eth-dev-trace-timeline__label,
2814
+ .eth-dev-trace-timeline__row--synced .eth-dev-trace-timeline__label,
2815
+ .eth-dev-trace-timeline__row--active .eth-dev-trace-timeline__label {
2816
+ border-inline-start-color: var(--eth-color-success);
2817
+ }
2818
+
2819
+ .eth-dev-trace-timeline__row--running .eth-dev-trace-timeline__label,
2820
+ .eth-dev-trace-timeline__row--in-progress .eth-dev-trace-timeline__label {
2821
+ border-inline-start-color: var(--eth-color-info);
2822
+ }
2823
+
2824
+ .eth-dev-trace-timeline__row--warning .eth-dev-trace-timeline__label,
2825
+ .eth-dev-trace-timeline__row--pending-approval .eth-dev-trace-timeline__label,
2826
+ .eth-dev-trace-timeline__row--approval-required .eth-dev-trace-timeline__label,
2827
+ .eth-dev-trace-timeline__row--stale .eth-dev-trace-timeline__label {
2828
+ border-inline-start-color: var(--eth-color-warning);
2829
+ }
2830
+
2831
+ .eth-dev-trace-timeline__row--failed .eth-dev-trace-timeline__label,
2832
+ .eth-dev-trace-timeline__row--blocked .eth-dev-trace-timeline__label {
2833
+ border-inline-start-color: var(--eth-color-danger);
2834
+ }
2835
+
2836
+ .eth-dev-trace-timeline__row--queued .eth-dev-trace-timeline__label,
2837
+ .eth-dev-trace-timeline__row--paused .eth-dev-trace-timeline__label,
2838
+ .eth-dev-trace-timeline__row--not-started .eth-dev-trace-timeline__label,
2839
+ .eth-dev-trace-timeline__row--inactive .eth-dev-trace-timeline__label {
2840
+ border-inline-start-color: var(--eth-color-border-strong);
2841
+ }
2842
+
2843
+ .eth-dev-trace-timeline__empty {
2844
+ align-content: center;
2845
+ display: grid;
2846
+ gap: var(--eth-space-xs);
2847
+ min-block-size: 10rem;
2848
+ padding: var(--eth-space-xl);
2849
+ }
2850
+
2851
+ .eth-dev-trace-timeline__empty h4 {
2852
+ color: var(--eth-color-text-primary);
2853
+ font-size: calc(1rem * var(--eth-text-scale, 1));
2854
+ font-weight: 600;
2855
+ line-height: 1.375;
2856
+ }
2857
+
2858
+ @media (width <= 48rem) {
2859
+ .eth-dev-trace-timeline__header {
2860
+ align-items: stretch;
2861
+ flex-direction: column;
2862
+ }
2863
+
2864
+ .eth-dev-trace-timeline__header .eth-badge {
2865
+ inline-size: fit-content;
2866
+ }
2867
+
2868
+ .eth-dev-trace-timeline__summary {
2869
+ grid-template-columns: repeat(2, minmax(0, 1fr));
2870
+ }
2871
+
2872
+ .eth-dev-trace-timeline__summary > div:nth-child(2n + 1) {
2873
+ border-inline-start: 0;
2874
+ }
2875
+
2876
+ .eth-dev-trace-timeline__summary > div:nth-child(n + 3) {
2877
+ border-block-start: 1px solid var(--eth-color-border-subtle);
2878
+ }
2879
+ }
2880
+
2881
+ @media (width <= 36rem) {
2882
+ .eth-dev-trace-timeline__summary {
2883
+ grid-template-columns: 1fr;
2884
+ }
2885
+
2886
+ .eth-dev-trace-timeline__summary > div + div {
2887
+ border-block-start: 1px solid var(--eth-color-border-subtle);
2888
+ border-inline-start: 0;
2889
+ }
2890
+ }
2891
+
2892
+ .eth-dev-diff-viewer {
2893
+ --eth-dev-diff-line-height: 1.5rem;
2894
+ --eth-dev-diff-gutter-width: 3.5rem;
2895
+ --eth-dev-diff-marker-width: 1.75rem;
2896
+ --eth-dev-diff-add-bg: color-mix(
2897
+ in srgb,
2898
+ var(--eth-color-success) 13%,
2899
+ var(--eth-color-layer-01)
2900
+ );
2901
+ --eth-dev-diff-remove-bg: color-mix(
2902
+ in srgb,
2903
+ var(--eth-color-danger) 10%,
2904
+ var(--eth-color-layer-01)
2905
+ );
2906
+
2907
+ background: var(--eth-color-layer-01);
2908
+ border: 1px solid var(--eth-color-border-subtle);
2909
+ border-block-end-color: var(--eth-color-border-strong);
2910
+ color: var(--eth-color-text-primary);
2911
+ display: grid;
2912
+ font-family: var(--eth-font-family);
2913
+ inline-size: 100%;
2914
+ min-inline-size: 0;
2915
+ }
2916
+
2917
+ .eth-dev-diff-viewer__header {
2918
+ align-items: center;
2919
+ background: var(--eth-color-layer-02);
2920
+ border-block-end: 1px solid var(--eth-color-border-subtle);
2921
+ display: grid;
2922
+ gap: var(--eth-space-md);
2923
+ grid-template-columns: minmax(0, 1fr) auto auto;
2924
+ min-block-size: 3rem;
2925
+ min-inline-size: 0;
2926
+ padding: var(--eth-space-md) var(--eth-space-lg);
2927
+ }
2928
+
2929
+ .eth-dev-diff-viewer__heading {
2930
+ align-items: center;
2931
+ display: flex;
2932
+ flex-wrap: wrap;
2933
+ gap: var(--eth-space-sm);
2934
+ min-inline-size: 0;
2935
+ }
2936
+
2937
+ .eth-dev-diff-viewer__language {
2938
+ color: var(--eth-color-text-primary);
2939
+ font-size: calc(0.875rem * var(--eth-text-scale, 1));
2940
+ font-weight: 600;
2941
+ line-height: 1.4286;
2942
+ min-inline-size: 0;
2943
+ overflow: hidden;
2944
+ text-overflow: ellipsis;
2945
+ text-transform: uppercase;
2946
+ white-space: nowrap;
2947
+ }
2948
+
2949
+ .eth-dev-diff-viewer__mode {
2950
+ background: var(--eth-color-layer-01);
2951
+ border: 1px solid var(--eth-color-border-subtle);
2952
+ color: var(--eth-color-text-secondary);
2953
+ font-size: calc(0.75rem * var(--eth-text-scale, 1));
2954
+ line-height: 1.333;
2955
+ padding: var(--eth-space-2xs) var(--eth-space-sm);
2956
+ }
2957
+
2958
+ .eth-dev-diff-viewer__summary,
2959
+ .eth-dev-diff-viewer__view-switch {
2960
+ align-items: center;
2961
+ display: flex;
2962
+ flex-wrap: wrap;
2963
+ gap: var(--eth-space-xs);
2964
+ min-inline-size: 0;
2965
+ }
2966
+
2967
+ .eth-dev-diff-viewer__summary {
2968
+ justify-content: flex-end;
2969
+ }
2970
+
2971
+ .eth-dev-diff-viewer__stat {
2972
+ align-items: center;
2973
+ background: var(--eth-color-layer-01);
2974
+ border: 1px solid var(--eth-color-border-subtle);
2975
+ color: var(--eth-color-text-secondary);
2976
+ display: inline-flex;
2977
+ font-size: calc(0.75rem * var(--eth-text-scale, 1));
2978
+ gap: var(--eth-space-xs);
2979
+ line-height: 1.333;
2980
+ min-block-size: 1.5rem;
2981
+ padding: 0 var(--eth-space-sm);
2982
+ white-space: nowrap;
2983
+ }
2984
+
2985
+ .eth-dev-diff-viewer__stat strong {
2986
+ color: var(--eth-color-text-primary);
2987
+ font-family: var(--eth-font-mono);
2988
+ font-size: calc(0.8125rem * var(--eth-text-scale, 1));
2989
+ font-weight: 600;
2990
+ line-height: 1.385;
2991
+ }
2992
+
2993
+ .eth-dev-diff-viewer__stat--add {
2994
+ border-inline-start: 3px solid var(--eth-color-success);
2995
+ }
2996
+
2997
+ .eth-dev-diff-viewer__stat--remove {
2998
+ border-inline-start: 3px solid var(--eth-color-danger);
2999
+ }
3000
+
3001
+ .eth-dev-diff-viewer__view-switch {
3002
+ justify-content: flex-end;
3003
+ }
3004
+
3005
+ .eth-dev-diff-viewer__view-switch .eth-button {
3006
+ min-inline-size: 6rem;
3007
+ }
3008
+
3009
+ .eth-dev-diff-viewer__inline,
3010
+ .eth-dev-diff-viewer__split {
3011
+ background: var(--eth-color-layer-01);
3012
+ font-family: var(--eth-font-mono);
3013
+ font-size: calc(0.875rem * var(--eth-text-scale, 1));
3014
+ line-height: 1.4286;
3015
+ margin: 0;
3016
+ max-block-size: 30rem;
3017
+ min-block-size: 0;
3018
+ min-inline-size: 0;
3019
+ overflow: auto;
3020
+ tab-size: 2;
3021
+ }
3022
+
3023
+ .eth-dev-diff-viewer__inline {
3024
+ padding-block: var(--eth-space-md);
3025
+ }
3026
+
3027
+ .eth-dev-diff-viewer__code,
3028
+ .eth-dev-diff-viewer__split-body {
3029
+ display: grid;
3030
+ }
3031
+
3032
+ .eth-dev-diff-viewer__code {
3033
+ inline-size: max-content;
3034
+ min-inline-size: 100%;
3035
+ }
3036
+
3037
+ .eth-dev-diff-viewer__line,
3038
+ .eth-dev-diff-viewer__cell-code {
3039
+ align-items: start;
3040
+ color: inherit;
3041
+ display: grid;
3042
+ grid-template-columns:
3043
+ var(--eth-dev-diff-gutter-width) var(--eth-dev-diff-marker-width)
3044
+ minmax(max-content, 1fr);
3045
+ min-block-size: var(--eth-dev-diff-line-height);
3046
+ }
3047
+
3048
+ .eth-dev-diff-viewer__line {
3049
+ inline-size: 100%;
3050
+ }
3051
+
3052
+ .eth-dev-diff-viewer__line--add,
3053
+ .eth-dev-diff-viewer__cell--add {
3054
+ background: var(--eth-dev-diff-add-bg);
3055
+ box-shadow: inset 3px 0 0 var(--eth-color-success);
3056
+ }
3057
+
3058
+ .eth-dev-diff-viewer__line--remove,
3059
+ .eth-dev-diff-viewer__cell--remove {
3060
+ background: var(--eth-dev-diff-remove-bg);
3061
+ box-shadow: inset 3px 0 0 var(--eth-color-danger);
3062
+ }
3063
+
3064
+ .eth-dev-diff-viewer__line:hover,
3065
+ .eth-dev-diff-viewer__split-row:hover
3066
+ .eth-dev-diff-viewer__cell:not(.eth-dev-diff-viewer__cell--empty) {
3067
+ background: var(--eth-color-layer-02);
3068
+ }
3069
+
3070
+ .eth-dev-diff-viewer__line--add:hover,
3071
+ .eth-dev-diff-viewer__split-row:hover .eth-dev-diff-viewer__cell--add {
3072
+ background: color-mix(
3073
+ in srgb,
3074
+ var(--eth-color-success) 18%,
3075
+ var(--eth-color-layer-01)
3076
+ );
3077
+ }
3078
+
3079
+ .eth-dev-diff-viewer__line--remove:hover,
3080
+ .eth-dev-diff-viewer__split-row:hover .eth-dev-diff-viewer__cell--remove {
3081
+ background: color-mix(
3082
+ in srgb,
3083
+ var(--eth-color-danger) 15%,
3084
+ var(--eth-color-layer-01)
3085
+ );
3086
+ }
3087
+
3088
+ .eth-dev-diff-viewer__gutter {
3089
+ border-inline-end: 1px solid var(--eth-color-border-subtle);
3090
+ color: var(--eth-color-text-secondary);
3091
+ font-variant-numeric: tabular-nums;
3092
+ padding-inline: var(--eth-space-md);
3093
+ text-align: end;
3094
+ user-select: none;
3095
+ }
3096
+
3097
+ .eth-dev-diff-viewer__marker {
3098
+ color: var(--eth-color-text-secondary);
3099
+ font-weight: 600;
3100
+ text-align: center;
3101
+ user-select: none;
3102
+ }
3103
+
3104
+ .eth-dev-diff-viewer__line--add .eth-dev-diff-viewer__marker,
3105
+ .eth-dev-diff-viewer__cell--add .eth-dev-diff-viewer__marker {
3106
+ color: var(--eth-color-success);
3107
+ }
3108
+
3109
+ .eth-dev-diff-viewer__line--remove .eth-dev-diff-viewer__marker,
3110
+ .eth-dev-diff-viewer__cell--remove .eth-dev-diff-viewer__marker {
3111
+ color: var(--eth-color-danger);
3112
+ }
3113
+
3114
+ .eth-dev-diff-viewer__content {
3115
+ min-inline-size: 0;
3116
+ overflow-wrap: normal;
3117
+ padding-inline-end: var(--eth-space-lg);
3118
+ white-space: pre;
3119
+ }
3120
+
3121
+ .eth-dev-diff-viewer__split {
3122
+ display: grid;
3123
+ grid-template-rows: auto 1fr;
3124
+ }
3125
+
3126
+ .eth-dev-diff-viewer__split-header,
3127
+ .eth-dev-diff-viewer__split-row {
3128
+ display: grid;
3129
+ grid-template-columns: minmax(20rem, 1fr) minmax(20rem, 1fr);
3130
+ min-inline-size: 48rem;
3131
+ }
3132
+
3133
+ .eth-dev-diff-viewer__split-header {
3134
+ background: var(--eth-color-layer-02);
3135
+ border-block-end: 1px solid var(--eth-color-border-subtle);
3136
+ color: var(--eth-color-text-secondary);
3137
+ font-family: var(--eth-font-family);
3138
+ font-size: calc(0.75rem * var(--eth-text-scale, 1));
3139
+ font-weight: 600;
3140
+ letter-spacing: 0;
3141
+ line-height: 1.333;
3142
+ position: sticky;
3143
+ text-transform: uppercase;
3144
+ top: 0;
3145
+ z-index: 1;
3146
+ }
3147
+
3148
+ .eth-dev-diff-viewer__split-header div {
3149
+ min-block-size: 2rem;
3150
+ padding: var(--eth-space-sm) var(--eth-space-lg);
3151
+ }
3152
+
3153
+ .eth-dev-diff-viewer__split-header div + div,
3154
+ .eth-dev-diff-viewer__split-row .eth-dev-diff-viewer__cell + .eth-dev-diff-viewer__cell {
3155
+ border-inline-start: 1px solid var(--eth-color-border-subtle);
3156
+ }
3157
+
3158
+ .eth-dev-diff-viewer__split-row {
3159
+ border-block-end: 1px solid var(--eth-color-border-subtle);
3160
+ }
3161
+
3162
+ .eth-dev-diff-viewer__cell {
3163
+ background: transparent;
3164
+ color: inherit;
3165
+ font-family: inherit;
3166
+ font-size: inherit;
3167
+ line-height: inherit;
3168
+ margin: 0;
3169
+ min-block-size: var(--eth-dev-diff-line-height);
3170
+ overflow: visible;
3171
+ }
3172
+
3173
+ .eth-dev-diff-viewer__cell--empty {
3174
+ background:
3175
+ repeating-linear-gradient(
3176
+ 135deg,
3177
+ transparent 0,
3178
+ transparent 0.5rem,
3179
+ color-mix(
3180
+ in srgb,
3181
+ var(--eth-color-border-subtle) 40%,
3182
+ transparent
3183
+ )
3184
+ 0.5rem,
3185
+ color-mix(
3186
+ in srgb,
3187
+ var(--eth-color-border-subtle) 40%,
3188
+ transparent
3189
+ )
3190
+ 0.5625rem
3191
+ ),
3192
+ var(--eth-color-layer-01);
3193
+ }
3194
+
3195
+ @media (width <= 760px) {
3196
+ .eth-dev-diff-viewer__header {
3197
+ align-items: start;
3198
+ grid-template-columns: 1fr;
3199
+ }
3200
+
3201
+ .eth-dev-diff-viewer__summary,
3202
+ .eth-dev-diff-viewer__view-switch {
3203
+ justify-content: start;
3204
+ }
3205
+
3206
+ .eth-dev-diff-viewer__view-switch .eth-button {
3207
+ min-inline-size: max-content;
3208
+ }
3209
+ }
3210
+
3211
+ @media (width <= 520px) {
3212
+ .eth-dev-diff-viewer {
3213
+ --eth-dev-diff-gutter-width: 2.75rem;
3214
+ --eth-dev-diff-marker-width: 1.5rem;
3215
+ }
3216
+
3217
+ .eth-dev-diff-viewer__inline,
3218
+ .eth-dev-diff-viewer__split {
3219
+ font-size: calc(0.8125rem * var(--eth-text-scale, 1));
3220
+ }
3221
+ }
3222
+
3223
+ .eth-dev-request-response-viewer {
3224
+ background: var(--eth-color-layer-01);
3225
+ border: 1px solid var(--eth-color-border-subtle);
3226
+ border-block-end-color: var(--eth-color-border-strong);
3227
+ color: var(--eth-color-text-primary);
3228
+ display: grid;
3229
+ font-family: var(--eth-font-family);
3230
+ inline-size: 100%;
3231
+ min-inline-size: 0;
3232
+ }
3233
+
3234
+ .eth-dev-request-response-viewer__header {
3235
+ align-items: center;
3236
+ background: var(--eth-color-layer-01);
3237
+ border-block-end: 1px solid var(--eth-color-border-subtle);
3238
+ display: grid;
3239
+ gap: var(--eth-space-lg);
3240
+ grid-template-columns: minmax(0, 1fr) auto;
3241
+ min-block-size: 4rem;
3242
+ min-inline-size: 0;
3243
+ padding: var(--eth-space-lg);
3244
+ }
3245
+
3246
+ .eth-dev-request-response-viewer__request {
3247
+ align-items: center;
3248
+ display: flex;
3249
+ gap: var(--eth-space-sm);
3250
+ min-inline-size: 0;
3251
+ }
3252
+
3253
+ .eth-dev-request-response-viewer__method {
3254
+ align-items: center;
3255
+ background: var(--eth-color-layer-02);
3256
+ border-inline-start: 3px solid var(--eth-color-info);
3257
+ color: var(--eth-color-text-primary);
3258
+ display: inline-flex;
3259
+ flex: 0 0 auto;
3260
+ font-family: var(--eth-font-mono);
3261
+ font-size: calc(0.75rem * var(--eth-text-scale, 1));
3262
+ font-weight: 600;
3263
+ line-height: 1.333;
3264
+ min-block-size: 1.5rem;
3265
+ padding: 0 var(--eth-space-sm);
3266
+ text-transform: uppercase;
3267
+ }
3268
+
3269
+ .eth-dev-request-response-viewer__method--get {
3270
+ border-inline-start-color: var(--eth-color-success);
3271
+ }
3272
+
3273
+ .eth-dev-request-response-viewer__method--delete {
3274
+ border-inline-start-color: var(--eth-color-danger);
3275
+ }
3276
+
3277
+ .eth-dev-request-response-viewer__method--patch,
3278
+ .eth-dev-request-response-viewer__method--put {
3279
+ border-inline-start-color: var(--eth-color-warning);
3280
+ }
3281
+
3282
+ .eth-dev-request-response-viewer__request code {
3283
+ background: var(--eth-color-layer-02);
3284
+ border: 1px solid var(--eth-color-border-subtle);
3285
+ color: var(--eth-color-text-primary);
3286
+ display: block;
3287
+ font-family: var(--eth-font-mono);
3288
+ font-size: calc(0.875rem * var(--eth-text-scale, 1));
3289
+ line-height: 1.4286;
3290
+ max-inline-size: 100%;
3291
+ min-inline-size: 0;
3292
+ overflow: hidden;
3293
+ padding: var(--eth-space-xs) var(--eth-space-sm);
3294
+ text-overflow: ellipsis;
3295
+ white-space: nowrap;
3296
+ }
3297
+
3298
+ .eth-dev-request-response-viewer__meta {
3299
+ background: var(--eth-color-border-subtle);
3300
+ display: grid;
3301
+ gap: 1px;
3302
+ grid-template-columns: repeat(2, minmax(5.5rem, auto));
3303
+ margin: 0;
3304
+ min-inline-size: 0;
3305
+ }
3306
+
3307
+ .eth-dev-request-response-viewer__meta div {
3308
+ background: var(--eth-color-layer-02);
3309
+ display: grid;
3310
+ gap: var(--eth-space-2xs);
3311
+ min-inline-size: 0;
3312
+ padding: var(--eth-space-sm) var(--eth-space-md);
3313
+ }
3314
+
3315
+ .eth-dev-request-response-viewer__meta dt,
3316
+ .eth-dev-request-response-viewer__meta dd {
3317
+ margin: 0;
3318
+ }
3319
+
3320
+ .eth-dev-request-response-viewer__meta dt {
3321
+ color: var(--eth-color-text-secondary);
3322
+ font-size: calc(0.75rem * var(--eth-text-scale, 1));
3323
+ font-weight: 600;
3324
+ line-height: 1.333;
3325
+ }
3326
+
3327
+ .eth-dev-request-response-viewer__meta dd {
3328
+ color: var(--eth-color-text-primary);
3329
+ font-family: var(--eth-font-mono);
3330
+ font-size: calc(0.8125rem * var(--eth-text-scale, 1));
3331
+ line-height: 1.385;
3332
+ overflow: hidden;
3333
+ text-overflow: ellipsis;
3334
+ white-space: nowrap;
3335
+ }
3336
+
3337
+ .eth-dev-request-response-viewer__status {
3338
+ align-items: center;
3339
+ display: inline-flex;
3340
+ gap: var(--eth-space-xs);
3341
+ }
3342
+
3343
+ .eth-dev-request-response-viewer__status::before {
3344
+ background: var(--eth-color-text-secondary);
3345
+ block-size: 0.5rem;
3346
+ content: "";
3347
+ flex: 0 0 auto;
3348
+ inline-size: 0.5rem;
3349
+ }
3350
+
3351
+ .eth-dev-request-response-viewer__status--success::before {
3352
+ background: var(--eth-color-success);
3353
+ }
3354
+
3355
+ .eth-dev-request-response-viewer__status--redirect::before {
3356
+ background: var(--eth-color-info);
3357
+ }
3358
+
3359
+ .eth-dev-request-response-viewer__status--warning::before {
3360
+ background: var(--eth-color-warning);
3361
+ }
3362
+
3363
+ .eth-dev-request-response-viewer__status--error::before {
3364
+ background: var(--eth-color-danger);
3365
+ }
3366
+
3367
+ .eth-dev-request-response-viewer__tabs {
3368
+ align-items: center;
3369
+ background: var(--eth-color-layer-02);
3370
+ border-block-end: 1px solid var(--eth-color-border-subtle);
3371
+ display: flex;
3372
+ min-block-size: 2.5rem;
3373
+ min-inline-size: 0;
3374
+ overflow-x: auto;
3375
+ }
3376
+
3377
+ .eth-dev-request-response-viewer__tab {
3378
+ appearance: none;
3379
+ align-items: center;
3380
+ background: transparent;
3381
+ border: 0;
3382
+ border-block-end: 2px solid transparent;
3383
+ color: var(--eth-color-text-secondary);
3384
+ cursor: pointer;
3385
+ display: inline-flex;
3386
+ flex: 0 0 auto;
3387
+ font: inherit;
3388
+ font-size: calc(0.875rem * var(--eth-text-scale, 1));
3389
+ justify-content: center;
3390
+ line-height: 1.2857;
3391
+ min-block-size: 2.5rem;
3392
+ min-inline-size: 9rem;
3393
+ padding: 0 var(--eth-space-lg);
3394
+ }
3395
+
3396
+ .eth-dev-request-response-viewer__tab:hover {
3397
+ background: var(--eth-color-layer-03);
3398
+ color: var(--eth-color-text-primary);
3399
+ }
3400
+
3401
+ .eth-dev-request-response-viewer__tab:focus-visible,
3402
+ .eth-dev-request-response-viewer__panel:focus-visible {
3403
+ outline: 2px solid var(--eth-color-focus);
3404
+ outline-offset: -2px;
3405
+ }
3406
+
3407
+ .eth-dev-request-response-viewer__tab[aria-selected="true"] {
3408
+ background: var(--eth-color-layer-01);
3409
+ border-block-end-color: var(--eth-color-focus);
3410
+ color: var(--eth-color-text-primary);
3411
+ font-weight: 600;
3412
+ }
3413
+
3414
+ .eth-dev-request-response-viewer__panel {
3415
+ background: var(--eth-color-layer-01);
3416
+ color: var(--eth-color-text-primary);
3417
+ font-family: var(--eth-font-mono);
3418
+ font-size: calc(0.875rem * var(--eth-text-scale, 1));
3419
+ line-height: 1.4286;
3420
+ margin: 0;
3421
+ max-block-size: 26rem;
3422
+ min-block-size: 10rem;
3423
+ min-inline-size: 0;
3424
+ overflow: auto;
3425
+ padding: var(--eth-space-md) var(--eth-space-lg);
3426
+ tab-size: 2;
3427
+ }
3428
+
3429
+ .eth-dev-request-response-viewer__panel code {
3430
+ display: block;
3431
+ font-family: inherit;
3432
+ inline-size: max-content;
3433
+ min-inline-size: 100%;
3434
+ white-space: pre;
3435
+ }
3436
+
3437
+ .eth-dev-request-response-viewer__panel--empty code {
3438
+ color: var(--eth-color-text-secondary);
3439
+ font-family: var(--eth-font-family);
3440
+ }
3441
+
3442
+ @media (width <= 760px) {
3443
+ .eth-dev-request-response-viewer__header {
3444
+ align-items: start;
3445
+ grid-template-columns: 1fr;
3446
+ }
3447
+
3448
+ .eth-dev-request-response-viewer__meta {
3449
+ grid-template-columns: repeat(2, minmax(0, 1fr));
3450
+ }
3451
+ }
3452
+
3453
+ @media (width <= 520px) {
3454
+ .eth-dev-request-response-viewer__request {
3455
+ align-items: stretch;
3456
+ display: grid;
3457
+ }
3458
+
3459
+ .eth-dev-request-response-viewer__meta {
3460
+ grid-template-columns: 1fr;
3461
+ }
3462
+
3463
+ .eth-dev-request-response-viewer__tab {
3464
+ min-inline-size: 7.75rem;
3465
+ padding-inline: var(--eth-space-md);
3466
+ }
3467
+
3468
+ .eth-dev-request-response-viewer__panel {
3469
+ font-size: calc(0.8125rem * var(--eth-text-scale, 1));
3470
+ min-block-size: 8rem;
3471
+ padding: var(--eth-space-md);
3472
+ }
3473
+ }
3474
+
3475
+ .eth-dev-json-viewer {
3476
+ background: var(--eth-color-layer-01);
3477
+ border: 1px solid var(--eth-color-border-subtle);
3478
+ border-block-end-color: var(--eth-color-border-strong);
3479
+ color: var(--eth-color-text-primary);
3480
+ display: grid;
3481
+ font-family: var(--eth-font-family);
3482
+ inline-size: 100%;
3483
+ min-inline-size: 0;
3484
+ }
3485
+
3486
+ .eth-dev-json-viewer__tabs {
3487
+ align-items: center;
3488
+ background: var(--eth-color-layer-02);
3489
+ border-block-end: 1px solid var(--eth-color-border-subtle);
3490
+ display: flex;
3491
+ min-block-size: 2.5rem;
3492
+ min-inline-size: 0;
3493
+ overflow-x: auto;
3494
+ }
3495
+
3496
+ .eth-dev-json-viewer__tab {
3497
+ appearance: none;
3498
+ align-items: center;
3499
+ background: transparent;
3500
+ border: 0;
3501
+ border-block-end: 2px solid transparent;
3502
+ color: var(--eth-color-text-secondary);
3503
+ cursor: pointer;
3504
+ display: inline-flex;
3505
+ flex: 0 0 auto;
3506
+ font: inherit;
3507
+ font-size: calc(0.875rem * var(--eth-text-scale, 1));
3508
+ justify-content: center;
3509
+ line-height: 1.2857;
3510
+ min-block-size: 2.5rem;
3511
+ min-inline-size: 5rem;
3512
+ padding: 0 var(--eth-space-lg);
3513
+ }
3514
+
3515
+ .eth-dev-json-viewer__tab:hover {
3516
+ background: var(--eth-color-layer-03);
3517
+ color: var(--eth-color-text-primary);
3518
+ }
3519
+
3520
+ .eth-dev-json-viewer__tab:focus-visible {
3521
+ outline: 2px solid var(--eth-color-focus);
3522
+ outline-offset: -2px;
3523
+ }
3524
+
3525
+ .eth-dev-json-viewer__tab[aria-selected="true"] {
3526
+ background: var(--eth-color-layer-01);
3527
+ border-block-end-color: var(--eth-color-focus);
3528
+ color: var(--eth-color-text-primary);
3529
+ font-weight: 600;
3530
+ }
3531
+
3532
+ .eth-dev-json-viewer__tree,
3533
+ .eth-dev-json-viewer__raw {
3534
+ background: var(--eth-color-layer-01);
3535
+ color: var(--eth-color-text-primary);
3536
+ font-family: var(--eth-font-mono);
3537
+ font-size: calc(0.875rem * var(--eth-text-scale, 1));
3538
+ line-height: 1.4286;
3539
+ margin: 0;
3540
+ max-block-size: 28rem;
3541
+ min-block-size: 0;
3542
+ min-inline-size: 0;
3543
+ overflow: auto;
3544
+ tab-size: 2;
3545
+ }
3546
+
3547
+ .eth-dev-json-viewer__tree {
3548
+ padding-block: var(--eth-space-md);
3549
+ }
3550
+
3551
+ .eth-dev-json-viewer__raw {
3552
+ padding: var(--eth-space-md) var(--eth-space-lg);
3553
+ }
3554
+
3555
+ .eth-dev-json-viewer__tree:focus-visible,
3556
+ .eth-dev-json-viewer__raw:focus-visible {
3557
+ outline: 2px solid var(--eth-color-focus);
3558
+ outline-offset: -2px;
3559
+ }
3560
+
3561
+ .eth-dev-json-viewer__tree-body {
3562
+ display: grid;
3563
+ inline-size: max-content;
3564
+ min-inline-size: 100%;
3565
+ }
3566
+
3567
+ .eth-dev-json-viewer__raw code {
3568
+ display: block;
3569
+ font-family: inherit;
3570
+ inline-size: max-content;
3571
+ min-inline-size: 100%;
3572
+ white-space: pre;
3573
+ }
3574
+
3575
+ .eth-dev-json-viewer__branch,
3576
+ .eth-dev-json-viewer__leaf {
3577
+ inline-size: 100%;
3578
+ margin: 0;
3579
+ }
3580
+
3581
+ .eth-dev-json-viewer__branch summary {
3582
+ align-items: center;
3583
+ cursor: pointer;
3584
+ display: flex;
3585
+ gap: var(--eth-space-xs);
3586
+ inline-size: 100%;
3587
+ list-style: none;
3588
+ min-block-size: 1.5rem;
3589
+ outline-offset: 0.125rem;
3590
+ padding-inline: var(--eth-space-lg) var(--eth-space-sm);
3591
+ white-space: nowrap;
3592
+ }
3593
+
3594
+ .eth-dev-json-viewer__branch summary::-webkit-details-marker {
3595
+ display: none;
3596
+ }
3597
+
3598
+ .eth-dev-json-viewer__branch summary:focus-visible {
3599
+ outline: 2px solid var(--eth-color-focus);
3600
+ outline-offset: -2px;
3601
+ }
3602
+
3603
+ .eth-dev-json-viewer__branch summary:hover,
3604
+ .eth-dev-json-viewer__leaf:hover {
3605
+ background: var(--eth-color-layer-02);
3606
+ }
3607
+
3608
+ .eth-dev-json-viewer__children {
3609
+ border-inline-start: 1px solid var(--eth-color-border-subtle);
3610
+ margin-inline-start: var(--eth-space-xl);
3611
+ padding-inline-start: var(--eth-space-sm);
3612
+ }
3613
+
3614
+ .eth-dev-json-viewer__leaf {
3615
+ align-items: baseline;
3616
+ display: flex;
3617
+ gap: var(--eth-space-xs);
3618
+ min-block-size: 1.5rem;
3619
+ padding-inline: var(--eth-space-lg) var(--eth-space-sm);
3620
+ white-space: nowrap;
3621
+ }
3622
+
3623
+ .eth-dev-json-viewer__disclosure {
3624
+ block-size: 0.5rem;
3625
+ border-block-start: 1.5px solid currentColor;
3626
+ border-inline-end: 1.5px solid currentColor;
3627
+ color: var(--eth-color-text-secondary);
3628
+ flex: 0 0 auto;
3629
+ inline-size: 0.5rem;
3630
+ margin-inline: 0 var(--eth-space-xs);
3631
+ transform: rotate(45deg);
3632
+ transform-origin: center;
3633
+ }
3634
+
3635
+ .eth-dev-json-viewer__branch[open] > summary .eth-dev-json-viewer__disclosure {
3636
+ transform: rotate(135deg);
3637
+ }
3638
+
3639
+ .eth-dev-json-viewer__key,
3640
+ .eth-dev-json-viewer__summary-label {
3641
+ color: var(--eth-color-text-primary);
3642
+ font-weight: 600;
3643
+ }
3644
+
3645
+ .eth-dev-json-viewer__node-meta,
3646
+ .eth-dev-json-viewer__punctuation {
3647
+ color: var(--eth-color-text-secondary);
3648
+ }
3649
+
3650
+ .eth-dev-json-viewer__leaf--empty .eth-dev-json-viewer__node-meta {
3651
+ color: var(--eth-color-text-primary);
3652
+ }
3653
+
3654
+ .eth-dev-json-viewer__value--string {
3655
+ color: #198038;
3656
+ }
3657
+
3658
+ .eth-dev-json-viewer__value--number,
3659
+ .eth-dev-json-viewer__value--bigint {
3660
+ color: #8a3ffc;
3661
+ }
3662
+
3663
+ .eth-dev-json-viewer__value--boolean {
3664
+ color: #0f62fe;
3665
+ }
3666
+
3667
+ .eth-dev-json-viewer__value--symbol,
3668
+ .eth-dev-json-viewer__value--function {
3669
+ color: #d02670;
3670
+ }
3671
+
3672
+ .eth-dev-json-viewer__value--null,
3673
+ .eth-dev-json-viewer__value--undefined {
3674
+ color: var(--eth-color-text-secondary);
3675
+ font-style: italic;
3676
+ }
3677
+
3678
+ .eth-dev-schema-viewer {
3679
+ --eth-dev-schema-accent: var(--eth-color-border-strong);
3680
+ --eth-dev-schema-status-bg: color-mix(
3681
+ in srgb,
3682
+ var(--eth-dev-schema-accent) 12%,
3683
+ var(--eth-color-layer-01)
3684
+ );
3685
+
3686
+ background: var(--eth-color-layer-01);
3687
+ border: 1px solid var(--eth-color-border-subtle);
3688
+ border-block-end-color: var(--eth-color-border-strong);
3689
+ color: var(--eth-color-text-primary);
3690
+ display: grid;
3691
+ font-family: var(--eth-font-family);
3692
+ inline-size: min(100%, 61.25rem);
3693
+ min-inline-size: 0;
3694
+ }
3695
+
3696
+ .eth-dev-schema-viewer[data-validation-state="valid"] {
3697
+ --eth-dev-schema-accent: var(--eth-color-success, #24a148);
3698
+ }
3699
+
3700
+ .eth-dev-schema-viewer[data-validation-state="invalid"] {
3701
+ --eth-dev-schema-accent: var(--eth-color-danger, #da1e28);
3702
+ }
3703
+
3704
+ .eth-dev-schema-viewer[data-validation-state="warning"] {
3705
+ --eth-dev-schema-accent: var(--eth-color-warning, #f1c21b);
3706
+ }
3707
+
3708
+ .eth-dev-schema-viewer__status {
3709
+ align-items: center;
3710
+ background: var(--eth-dev-schema-status-bg);
3711
+ border-block-end: 1px solid var(--eth-color-border-subtle);
3712
+ border-inline-start: 4px solid var(--eth-dev-schema-accent);
3713
+ display: grid;
3714
+ gap: var(--eth-space-md);
3715
+ grid-template-columns: auto minmax(0, 1fr) auto;
3716
+ min-block-size: 4rem;
3717
+ padding: var(--eth-space-md) var(--eth-space-lg);
3718
+ }
3719
+
3720
+ .eth-dev-schema-viewer__status-icon {
3721
+ align-items: center;
3722
+ color: var(--eth-dev-schema-accent);
3723
+ display: inline-flex;
3724
+ justify-content: center;
3725
+ }
3726
+
3727
+ .eth-dev-schema-viewer__status-copy {
3728
+ display: grid;
3729
+ gap: var(--eth-space-2xs);
3730
+ min-inline-size: 0;
3731
+ }
3732
+
3733
+ .eth-dev-schema-viewer__status-title,
3734
+ .eth-dev-schema-viewer__status-description,
3735
+ .eth-dev-schema-viewer__stats,
3736
+ .eth-dev-schema-viewer__stats dt,
3737
+ .eth-dev-schema-viewer__stats dd {
3738
+ margin: 0;
3739
+ }
3740
+
3741
+ .eth-dev-schema-viewer__status-title {
3742
+ color: var(--eth-color-text-primary);
3743
+ font-size: calc(1rem * var(--eth-text-scale, 1));
3744
+ font-weight: 600;
3745
+ line-height: 1.375;
3746
+ }
3747
+
3748
+ .eth-dev-schema-viewer__status-description {
3749
+ color: var(--eth-color-text-secondary);
3750
+ font-size: calc(0.8125rem * var(--eth-text-scale, 1));
3751
+ line-height: 1.3846;
3752
+ }
3753
+
3754
+ .eth-dev-schema-viewer__stats {
3755
+ align-items: stretch;
3756
+ display: grid;
3757
+ grid-auto-flow: column;
3758
+ grid-auto-columns: minmax(4.5rem, auto);
3759
+ }
3760
+
3761
+ .eth-dev-schema-viewer__stats div {
3762
+ border-inline-start: 1px solid var(--eth-color-border-subtle);
3763
+ display: grid;
3764
+ gap: var(--eth-space-2xs);
3765
+ padding-inline: var(--eth-space-md);
3766
+ }
3767
+
3768
+ .eth-dev-schema-viewer__stats dt {
3769
+ color: var(--eth-color-text-secondary);
3770
+ font-size: calc(0.75rem * var(--eth-text-scale, 1));
3771
+ line-height: 1.3333;
3772
+ }
3773
+
3774
+ .eth-dev-schema-viewer__stats dd {
3775
+ color: var(--eth-color-text-primary);
3776
+ font-size: calc(1rem * var(--eth-text-scale, 1));
3777
+ font-weight: 600;
3778
+ line-height: 1.25;
3779
+ }
3780
+
3781
+ .eth-dev-schema-viewer__json.eth-dev-json-viewer {
3782
+ border: 0;
3783
+ border-block-end: 0;
3784
+ }
3785
+
3786
+ @media (width <= 680px) {
3787
+ .eth-dev-schema-viewer__status {
3788
+ align-items: start;
3789
+ grid-template-columns: auto minmax(0, 1fr);
3790
+ }
3791
+
3792
+ .eth-dev-schema-viewer__stats {
3793
+ grid-column: 1 / -1;
3794
+ grid-auto-flow: row;
3795
+ grid-template-columns: repeat(3, minmax(0, 1fr));
3796
+ }
3797
+
3798
+ .eth-dev-schema-viewer__stats div {
3799
+ border-block-start: 1px solid var(--eth-color-border-subtle);
3800
+ border-inline-start: 0;
3801
+ padding-block-start: var(--eth-space-sm);
3802
+ padding-inline: 0;
3803
+ }
3804
+ }
3805
+
3806
+ .eth-dev-event-payload-viewer {
3807
+ background: var(--eth-color-layer-01);
3808
+ border: 1px solid var(--eth-color-border-subtle);
3809
+ color: var(--eth-color-text-primary);
3810
+ display: grid;
3811
+ font-family: var(--eth-font-family);
3812
+ inline-size: 100%;
3813
+ min-inline-size: 0;
3814
+ }
3815
+
3816
+ .eth-dev-event-payload-viewer__header {
3817
+ align-items: start;
3818
+ background: var(--eth-color-layer-01);
3819
+ border-block-end: 1px solid var(--eth-color-border-subtle);
3820
+ display: grid;
3821
+ gap: var(--eth-space-lg);
3822
+ grid-template-columns: minmax(0, 1fr) auto;
3823
+ min-inline-size: 0;
3824
+ padding: var(--eth-space-lg);
3825
+ }
3826
+
3827
+ .eth-dev-event-payload-viewer__heading {
3828
+ display: grid;
3829
+ gap: var(--eth-space-xs);
3830
+ min-inline-size: 0;
3831
+ }
3832
+
3833
+ .eth-dev-event-payload-viewer__heading span {
3834
+ color: var(--eth-color-text-secondary);
3835
+ font-size: calc(0.75rem * var(--eth-text-scale, 1));
3836
+ font-weight: 600;
3837
+ letter-spacing: 0;
3838
+ line-height: 1.333;
3839
+ text-transform: uppercase;
3840
+ }
3841
+
3842
+ .eth-dev-event-payload-viewer__heading h3 {
3843
+ color: var(--eth-color-text-primary);
3844
+ font-size: calc(1rem * var(--eth-text-scale, 1));
3845
+ font-weight: 600;
3846
+ line-height: 1.375;
3847
+ margin: 0;
3848
+ min-inline-size: 0;
3849
+ }
3850
+
3851
+ .eth-dev-event-payload-viewer__heading code {
3852
+ background: var(--eth-color-layer-02);
3853
+ border: 1px solid var(--eth-color-border-subtle);
3854
+ color: var(--eth-color-text-primary);
3855
+ display: inline-block;
3856
+ font-family: var(--eth-font-mono);
3857
+ font-size: calc(0.875rem * var(--eth-text-scale, 1));
3858
+ line-height: 1.428;
3859
+ max-inline-size: 100%;
3860
+ overflow: hidden;
3861
+ padding: var(--eth-space-xs) var(--eth-space-sm);
3862
+ text-overflow: ellipsis;
3863
+ vertical-align: top;
3864
+ white-space: nowrap;
3865
+ }
3866
+
3867
+ .eth-dev-event-payload-viewer__summary {
3868
+ background: var(--eth-color-border-subtle);
3869
+ display: grid;
3870
+ gap: 1px;
3871
+ grid-template-columns: repeat(3, minmax(5rem, auto));
3872
+ margin: 0;
3873
+ min-inline-size: 0;
3874
+ }
3875
+
3876
+ .eth-dev-event-payload-viewer__summary div {
3877
+ background: var(--eth-color-layer-02);
3878
+ display: grid;
3879
+ gap: var(--eth-space-2xs);
3880
+ min-inline-size: 0;
3881
+ padding: var(--eth-space-sm) var(--eth-space-md);
3882
+ }
3883
+
3884
+ .eth-dev-event-payload-viewer__summary dt,
3885
+ .eth-dev-event-payload-viewer__summary dd {
3886
+ margin: 0;
3887
+ }
3888
+
3889
+ .eth-dev-event-payload-viewer__summary dt {
3890
+ color: var(--eth-color-text-secondary);
3891
+ font-size: calc(0.75rem * var(--eth-text-scale, 1));
3892
+ font-weight: 600;
3893
+ line-height: 1.333;
3894
+ }
3895
+
3896
+ .eth-dev-event-payload-viewer__summary dd {
3897
+ color: var(--eth-color-text-primary);
3898
+ font-family: var(--eth-font-mono);
3899
+ font-size: calc(0.8125rem * var(--eth-text-scale, 1));
3900
+ line-height: 1.385;
3901
+ overflow: hidden;
3902
+ text-overflow: ellipsis;
3903
+ white-space: nowrap;
3904
+ }
3905
+
3906
+ .eth-dev-event-payload-viewer__json.eth-dev-json-viewer {
3907
+ border: 0;
3908
+ }
3909
+
3910
+ @media (width <= 760px) {
3911
+ .eth-dev-event-payload-viewer__header {
3912
+ grid-template-columns: 1fr;
3913
+ }
3914
+
3915
+ .eth-dev-event-payload-viewer__summary {
3916
+ grid-template-columns: repeat(3, minmax(0, 1fr));
3917
+ }
3918
+ }
3919
+
3920
+ @media (width <= 520px) {
3921
+ .eth-dev-event-payload-viewer__summary {
3922
+ grid-template-columns: 1fr;
3923
+ }
3924
+
3925
+ .eth-dev-json-viewer__tab {
3926
+ min-inline-size: 4rem;
3927
+ padding-inline: var(--eth-space-md);
3928
+ }
3929
+
3930
+ .eth-dev-json-viewer__tree,
3931
+ .eth-dev-json-viewer__raw {
3932
+ font-size: calc(0.8125rem * var(--eth-text-scale, 1));
3933
+ }
3934
+
3935
+ .eth-dev-json-viewer__raw {
3936
+ padding: var(--eth-space-md);
3937
+ }
3938
+
3939
+ .eth-dev-json-viewer__branch summary,
3940
+ .eth-dev-json-viewer__leaf {
3941
+ padding-inline: var(--eth-space-md) var(--eth-space-sm);
3942
+ }
3943
+
3944
+ .eth-dev-json-viewer__children {
3945
+ margin-inline-start: var(--eth-space-lg);
3946
+ padding-inline-start: var(--eth-space-sm);
3947
+ }
3948
+ }
3949
+
3950
+ .eth-dev-api-explorer {
3951
+ background: var(--eth-color-layer-01);
3952
+ border: 1px solid var(--eth-color-border-subtle);
3953
+ color: var(--eth-color-text-primary);
3954
+ display: grid;
3955
+ font-family: var(--eth-font-family);
3956
+ grid-template-columns: minmax(14rem, 18rem) minmax(24rem, 1.1fr) minmax(20rem, 0.9fr);
3957
+ inline-size: 100%;
3958
+ min-block-size: 34rem;
3959
+ min-inline-size: 0;
3960
+ }
3961
+
3962
+ .eth-dev-api-explorer__nav {
3963
+ background: var(--eth-color-layer-02);
3964
+ border-inline-end: 1px solid var(--eth-color-border-subtle);
3965
+ display: grid;
3966
+ grid-template-rows: auto 1fr;
3967
+ min-inline-size: 0;
3968
+ }
3969
+
3970
+ .eth-dev-api-explorer__nav-heading {
3971
+ align-items: center;
3972
+ border-block-end: 1px solid var(--eth-color-border-subtle);
3973
+ color: var(--eth-color-text-secondary);
3974
+ display: flex;
3975
+ font-size: calc(0.75rem * var(--eth-text-scale, 1));
3976
+ font-weight: 600;
3977
+ justify-content: space-between;
3978
+ letter-spacing: 0;
3979
+ line-height: 1.333;
3980
+ padding: var(--eth-space-md);
3981
+ text-transform: uppercase;
3982
+ }
3983
+
3984
+ .eth-dev-api-explorer__nav-heading span:last-child {
3985
+ background: var(--eth-color-layer-01);
3986
+ border: 1px solid var(--eth-color-border-subtle);
3987
+ color: var(--eth-color-text-primary);
3988
+ min-inline-size: 1.5rem;
3989
+ padding: 0.0625rem var(--eth-space-sm);
3990
+ text-align: center;
3991
+ }
3992
+
3993
+ .eth-dev-api-explorer__endpoint-list {
3994
+ align-content: start;
3995
+ display: grid;
3996
+ min-block-size: 0;
3997
+ overflow: auto;
3998
+ padding-block: var(--eth-space-sm);
3999
+ }
4000
+
4001
+ .eth-dev-api-explorer__endpoint-list button {
4002
+ appearance: none;
4003
+ background: transparent;
4004
+ border: 0;
4005
+ border-inline-start: 3px solid transparent;
4006
+ color: var(--eth-color-text-primary);
4007
+ cursor: pointer;
4008
+ display: grid;
4009
+ gap: var(--eth-space-sm);
4010
+ grid-template-columns: auto minmax(0, 1fr);
4011
+ min-block-size: 4.5rem;
4012
+ padding: var(--eth-space-md);
4013
+ text-align: start;
4014
+ }
4015
+
4016
+ .eth-dev-api-explorer__endpoint-list button:hover {
4017
+ background: var(--eth-color-layer-03);
4018
+ }
4019
+
4020
+ .eth-dev-api-explorer__endpoint-list button:focus-visible {
4021
+ outline: 2px solid var(--eth-color-focus);
4022
+ outline-offset: -2px;
4023
+ }
4024
+
4025
+ .eth-dev-api-explorer__endpoint-list button[aria-current="true"] {
4026
+ background: var(--eth-color-layer-01);
4027
+ border-inline-start-color: var(--eth-color-focus);
4028
+ }
4029
+
4030
+ .eth-dev-api-explorer__method {
4031
+ align-self: start;
4032
+ border: 1px solid currentcolor;
4033
+ color: var(--eth-color-text-secondary);
4034
+ font-family: var(--eth-font-mono);
4035
+ font-size: calc(0.6875rem * var(--eth-text-scale, 1));
4036
+ font-weight: 600;
4037
+ line-height: 1.45;
4038
+ min-inline-size: 3.25rem;
4039
+ padding: 0 var(--eth-space-xs);
4040
+ text-align: center;
4041
+ }
4042
+
4043
+ .eth-dev-api-explorer__method--get {
4044
+ color: var(--eth-color-info);
4045
+ }
4046
+
4047
+ .eth-dev-api-explorer__method--post {
4048
+ color: var(--eth-color-success);
4049
+ }
4050
+
4051
+ .eth-dev-api-explorer__method--put,
4052
+ .eth-dev-api-explorer__method--patch {
4053
+ color: var(--eth-color-warning);
4054
+ }
4055
+
4056
+ .eth-dev-api-explorer__method--delete {
4057
+ color: var(--eth-color-danger);
4058
+ }
4059
+
4060
+ .eth-dev-api-explorer__endpoint-copy {
4061
+ display: grid;
4062
+ gap: var(--eth-space-xs);
4063
+ min-inline-size: 0;
4064
+ }
4065
+
4066
+ .eth-dev-api-explorer__endpoint-copy code {
4067
+ color: var(--eth-color-text-primary);
4068
+ font-family: var(--eth-font-mono);
4069
+ font-size: calc(0.8125rem * var(--eth-text-scale, 1));
4070
+ line-height: 1.385;
4071
+ overflow-wrap: anywhere;
4072
+ }
4073
+
4074
+ .eth-dev-api-explorer__endpoint-copy small {
4075
+ color: var(--eth-color-text-secondary);
4076
+ font-size: calc(0.75rem * var(--eth-text-scale, 1));
4077
+ line-height: 1.333;
4078
+ }
4079
+
4080
+ .eth-dev-api-explorer__request {
4081
+ align-content: start;
4082
+ display: grid;
4083
+ gap: var(--eth-space-lg);
4084
+ min-inline-size: 0;
4085
+ padding: var(--eth-space-xl);
4086
+ }
4087
+
4088
+ .eth-dev-api-explorer__request-header {
4089
+ align-items: start;
4090
+ border-block-end: 1px solid var(--eth-color-border-subtle);
4091
+ display: flex;
4092
+ gap: var(--eth-space-lg);
4093
+ justify-content: space-between;
4094
+ min-inline-size: 0;
4095
+ padding-block-end: var(--eth-space-lg);
4096
+ }
4097
+
4098
+ .eth-dev-api-explorer__request-header div {
4099
+ min-inline-size: 0;
4100
+ }
4101
+
4102
+ .eth-dev-api-explorer__request-header p {
4103
+ color: var(--eth-color-text-secondary);
4104
+ font-size: calc(0.75rem * var(--eth-text-scale, 1));
4105
+ font-weight: 600;
4106
+ line-height: 1.333;
4107
+ margin: 0 0 var(--eth-space-xs);
4108
+ text-transform: uppercase;
4109
+ }
4110
+
4111
+ .eth-dev-api-explorer__request-header h3,
4112
+ .eth-dev-api-explorer__response h3 {
4113
+ font-size: calc(1rem * var(--eth-text-scale, 1));
4114
+ font-weight: 600;
4115
+ line-height: 1.375;
4116
+ margin: 0;
4117
+ }
4118
+
4119
+ .eth-dev-api-explorer__request-header code {
4120
+ background: var(--eth-color-layer-02);
4121
+ border: 1px solid var(--eth-color-border-subtle);
4122
+ color: var(--eth-color-text-secondary);
4123
+ font-family: var(--eth-font-mono);
4124
+ font-size: calc(0.75rem * var(--eth-text-scale, 1));
4125
+ line-height: 1.333;
4126
+ padding: var(--eth-space-xs) var(--eth-space-sm);
4127
+ }
4128
+
4129
+ .eth-dev-api-explorer__method-path {
4130
+ display: grid;
4131
+ gap: var(--eth-space-lg);
4132
+ grid-template-columns: minmax(8rem, 11rem) minmax(0, 1fr);
4133
+ }
4134
+
4135
+ .eth-dev-api-explorer .cds--form-item {
4136
+ margin-block-end: 0;
4137
+ }
4138
+
4139
+ .eth-dev-api-explorer .cds--label {
4140
+ color: var(--eth-color-text-secondary);
4141
+ font-size: calc(0.75rem * var(--eth-text-scale, 1));
4142
+ line-height: 1.333;
4143
+ margin-block-end: var(--eth-space-sm);
4144
+ }
4145
+
4146
+ .eth-dev-api-explorer .cds--select,
4147
+ .eth-dev-api-explorer .cds--text-input-wrapper,
4148
+ .eth-dev-api-explorer .cds--text-area__wrapper {
4149
+ inline-size: 100%;
4150
+ }
4151
+
4152
+ .eth-dev-api-explorer .cds--text-input,
4153
+ .eth-dev-api-explorer .cds--text-area,
4154
+ .eth-dev-api-explorer .cds--select-input {
4155
+ background: var(--eth-color-layer-02);
4156
+ color: var(--eth-color-text-primary);
4157
+ }
4158
+
4159
+ .eth-dev-api-explorer__code-field textarea,
4160
+ .eth-dev-api-explorer__code-field.cds--text-area {
4161
+ font-family: var(--eth-font-mono);
4162
+ font-size: calc(0.8125rem * var(--eth-text-scale, 1));
4163
+ line-height: 1.5;
4164
+ }
4165
+
4166
+ .eth-dev-api-explorer__actions {
4167
+ align-items: center;
4168
+ border-block-start: 1px solid var(--eth-color-border-subtle);
4169
+ display: flex;
4170
+ gap: var(--eth-space-lg);
4171
+ justify-content: space-between;
4172
+ min-inline-size: 0;
4173
+ padding-block-start: var(--eth-space-lg);
4174
+ }
4175
+
4176
+ .eth-dev-api-explorer__actions > span {
4177
+ color: var(--eth-color-text-secondary);
4178
+ font-family: var(--eth-font-mono);
4179
+ font-size: calc(0.75rem * var(--eth-text-scale, 1));
4180
+ line-height: 1.333;
4181
+ min-inline-size: 0;
4182
+ overflow: hidden;
4183
+ text-overflow: ellipsis;
4184
+ white-space: nowrap;
4185
+ }
4186
+
4187
+ .eth-dev-api-explorer__response {
4188
+ background: var(--eth-color-layer-02);
4189
+ border-inline-start: 1px solid var(--eth-color-border-subtle);
4190
+ display: grid;
4191
+ grid-template-rows: auto minmax(0, 1fr);
4192
+ min-block-size: 0;
4193
+ min-inline-size: 0;
4194
+ }
4195
+
4196
+ .eth-dev-api-explorer__response-header {
4197
+ align-items: center;
4198
+ border-block-end: 1px solid var(--eth-color-border-subtle);
4199
+ display: flex;
4200
+ gap: var(--eth-space-lg);
4201
+ justify-content: space-between;
4202
+ padding: var(--eth-space-lg);
4203
+ }
4204
+
4205
+ .eth-dev-api-explorer__response-state {
4206
+ background: var(--eth-color-layer-01);
4207
+ border: 1px solid var(--eth-color-border-subtle);
4208
+ color: var(--eth-color-text-secondary);
4209
+ font-size: calc(0.75rem * var(--eth-text-scale, 1));
4210
+ font-weight: 600;
4211
+ line-height: 1.333;
4212
+ padding: var(--eth-space-xs) var(--eth-space-sm);
4213
+ text-transform: capitalize;
4214
+ }
4215
+
4216
+ .eth-dev-api-explorer__response-state--success {
4217
+ color: var(--eth-color-success);
4218
+ }
4219
+
4220
+ .eth-dev-api-explorer__response-state--error {
4221
+ color: var(--eth-color-danger);
4222
+ }
4223
+
4224
+ .eth-dev-api-explorer__response-state--loading {
4225
+ color: var(--eth-color-info);
4226
+ }
4227
+
4228
+ .eth-dev-api-explorer__response pre {
4229
+ background: var(--eth-color-layer-01);
4230
+ color: var(--eth-color-text-primary);
4231
+ font-family: var(--eth-font-mono);
4232
+ font-size: calc(0.8125rem * var(--eth-text-scale, 1));
4233
+ line-height: 1.5;
4234
+ margin: 0;
4235
+ min-block-size: 0;
4236
+ overflow: auto;
4237
+ padding: var(--eth-space-lg);
4238
+ white-space: pre-wrap;
4239
+ }
4240
+
4241
+ .eth-dev-api-explorer__response code {
4242
+ font-family: inherit;
4243
+ }
4244
+
4245
+ .eth-dev-api-explorer__response-empty,
4246
+ .eth-dev-api-explorer__empty {
4247
+ color: var(--eth-color-text-secondary);
4248
+ font-size: calc(0.875rem * var(--eth-text-scale, 1));
4249
+ line-height: 1.428;
4250
+ margin: 0;
4251
+ }
4252
+
4253
+ .eth-dev-api-explorer__response-empty {
4254
+ align-self: start;
4255
+ padding: var(--eth-space-lg);
4256
+ }
4257
+
4258
+ .eth-dev-api-explorer__empty {
4259
+ padding: var(--eth-space-md);
4260
+ }
4261
+
4262
+ @media (width <= 1180px) {
4263
+ .eth-dev-api-explorer {
4264
+ grid-template-columns: minmax(13rem, 16rem) minmax(0, 1fr);
4265
+ }
4266
+
4267
+ .eth-dev-api-explorer__response {
4268
+ border-block-start: 1px solid var(--eth-color-border-subtle);
4269
+ border-inline-start: 0;
4270
+ grid-column: 2;
4271
+ min-block-size: 18rem;
4272
+ }
4273
+ }
4274
+
4275
+ @media (width <= 760px) {
4276
+ .eth-dev-api-explorer {
4277
+ grid-template-columns: 1fr;
4278
+ }
4279
+
4280
+ .eth-dev-api-explorer__nav {
4281
+ border-block-end: 1px solid var(--eth-color-border-subtle);
4282
+ border-inline-end: 0;
4283
+ }
4284
+
4285
+ .eth-dev-api-explorer__endpoint-list {
4286
+ max-block-size: 16rem;
4287
+ }
4288
+
4289
+ .eth-dev-api-explorer__method-path {
4290
+ grid-template-columns: 1fr;
4291
+ }
4292
+
4293
+ .eth-dev-api-explorer__response {
4294
+ grid-column: auto;
4295
+ }
4296
+ }