@smwb/ui-css 1.1.0 → 2.0.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.
- package/dist/ui.css +1779 -177
- package/package.json +2 -2
package/dist/ui.css
CHANGED
|
@@ -37,6 +37,32 @@
|
|
|
37
37
|
padding: 12px;
|
|
38
38
|
height: 48px;
|
|
39
39
|
}
|
|
40
|
+
.smwb-appbar.smwb-appbar_variant-window {
|
|
41
|
+
-webkit-app-region: drag;
|
|
42
|
+
app-region: drag;
|
|
43
|
+
user-select: none;
|
|
44
|
+
--smwb-appbar-wc-left: env(titlebar-area-x, 0px);
|
|
45
|
+
--smwb-appbar-wc-right: calc(100vw - env(titlebar-area-x, 0px) - env(titlebar-area-width, 100vw));
|
|
46
|
+
padding-left: calc(16px + var(--smwb-appbar-wc-left));
|
|
47
|
+
padding-right: calc(16px + var(--smwb-appbar-wc-right));
|
|
48
|
+
}
|
|
49
|
+
.smwb-appbar.smwb-appbar_variant-window.smwb-appbar_window-controls-left {
|
|
50
|
+
--smwb-appbar-wc-left: env(titlebar-area-x, var(--smui-appBarWindowControlsWidth, 64px));
|
|
51
|
+
}
|
|
52
|
+
.smwb-appbar.smwb-appbar_variant-window.smwb-appbar_window-controls-right {
|
|
53
|
+
--smwb-appbar-wc-right: calc(100vw - env(titlebar-area-x, 0px) - env(titlebar-area-width, calc(100vw - var(--smui-appBarWindowControlsWidth, 138px))));
|
|
54
|
+
}
|
|
55
|
+
.smwb-appbar.smwb-appbar_variant-window.smwb-appbar_window-controls-none {
|
|
56
|
+
--smwb-appbar-wc-left: 0px;
|
|
57
|
+
--smwb-appbar-wc-right: 0px;
|
|
58
|
+
}
|
|
59
|
+
.smwb-appbar.smwb-appbar_variant-window :where( a[href], button, input, select, textarea, label, summary, iframe, video[controls], [contenteditable]:not([contenteditable="false"]), [tabindex]:not([tabindex="-1"]), [role="button"], [role="link"], [role="menuitem"], [role="tab"], [role="checkbox"], [role="switch"], [role="radio"], [role="combobox"], [role="textbox"], [role="searchbox"], [role="slider"], [role="option"], [role="menuitemcheckbox"], [role="menuitemradio"], [role="treeitem"], [role="spinbutton"], [role="gridcell"], [role="listbox"], [role="scrollbar"], .smwb-tooltip__wrapper, .smwb-appbar__no-drag, [data-no-drag]) {
|
|
60
|
+
-webkit-app-region: no-drag;
|
|
61
|
+
app-region: no-drag;
|
|
62
|
+
}
|
|
63
|
+
.smwb-appbar.smwb-appbar_variant-window.smwb-dense {
|
|
64
|
+
padding: 0 calc(16px + var(--smwb-appbar-wc-right)) 0 calc(16px + var(--smwb-appbar-wc-left));
|
|
65
|
+
}
|
|
40
66
|
.smwb-appbar__inner {
|
|
41
67
|
display: flex;
|
|
42
68
|
align-items: center;
|
|
@@ -50,6 +76,10 @@
|
|
|
50
76
|
gap: 10px;
|
|
51
77
|
white-space: nowrap;
|
|
52
78
|
}
|
|
79
|
+
.smwb-appbar__left__title {
|
|
80
|
+
margin: 0;
|
|
81
|
+
font: inherit;
|
|
82
|
+
}
|
|
53
83
|
.smwb-appbar__right {
|
|
54
84
|
white-space: nowrap;
|
|
55
85
|
}
|
|
@@ -69,6 +99,17 @@
|
|
|
69
99
|
.smwb-appbar__mid.smwb-left {
|
|
70
100
|
align-items: flex-start;
|
|
71
101
|
}
|
|
102
|
+
[data-smwb-overlay-layer],
|
|
103
|
+
.smwb-menu,
|
|
104
|
+
.smwb-tooltip,
|
|
105
|
+
.smwb-snackbars,
|
|
106
|
+
.smwb-chat-attachment-image__overlay,
|
|
107
|
+
.smwb-image-modal__overlay,
|
|
108
|
+
.smwb-thumb-card__preview,
|
|
109
|
+
.smwb-chat-shell {
|
|
110
|
+
-webkit-app-region: no-drag;
|
|
111
|
+
app-region: no-drag;
|
|
112
|
+
}
|
|
72
113
|
.smwb-appbar_color-primary {
|
|
73
114
|
background-color: var(--smui-primaryColor);
|
|
74
115
|
color: var(--smui-onPrimaryColor);
|
|
@@ -128,14 +169,17 @@
|
|
|
128
169
|
.smwb-button.smwb-small {
|
|
129
170
|
font-size: 13px;
|
|
130
171
|
padding: 4px 10px;
|
|
172
|
+
min-height: var(--smui-control-h-sm, 32px);
|
|
131
173
|
}
|
|
132
174
|
.smwb-button.smwb-medium {
|
|
133
175
|
font-size: 14px;
|
|
134
176
|
padding: 6px 14px;
|
|
177
|
+
min-height: var(--smui-control-h-md, 40px);
|
|
135
178
|
}
|
|
136
179
|
.smwb-button.smwb-large {
|
|
137
180
|
font-size: 15px;
|
|
138
181
|
padding: 8px 22px;
|
|
182
|
+
min-height: var(--smui-control-h-lg, 48px);
|
|
139
183
|
}
|
|
140
184
|
.smwb-button.smwb-contained {
|
|
141
185
|
color: var(--smui-onPrimaryColor);
|
|
@@ -371,6 +415,7 @@
|
|
|
371
415
|
left: 50%;
|
|
372
416
|
}
|
|
373
417
|
.smwb-checkbox__wrapper {
|
|
418
|
+
position: relative;
|
|
374
419
|
color: var(--smui-primaryTextColor);
|
|
375
420
|
display: flex;
|
|
376
421
|
align-items: center;
|
|
@@ -390,7 +435,15 @@
|
|
|
390
435
|
opacity: 0.8;
|
|
391
436
|
}
|
|
392
437
|
.smwb-checkbox__input {
|
|
393
|
-
|
|
438
|
+
position: absolute;
|
|
439
|
+
width: 18px;
|
|
440
|
+
height: 18px;
|
|
441
|
+
margin: 0;
|
|
442
|
+
opacity: 0;
|
|
443
|
+
}
|
|
444
|
+
.smwb-checkbox__input:focus-visible ~ .smwb-checkbox__btn {
|
|
445
|
+
outline: 2px solid var(--smui-primaryColor);
|
|
446
|
+
outline-offset: 2px;
|
|
394
447
|
}
|
|
395
448
|
.smwb-checkbox__input:hover ~ .smwb-checkbox__btn::before {
|
|
396
449
|
background-color: var(--smui-onSurfaceHover);
|
|
@@ -426,10 +479,29 @@
|
|
|
426
479
|
.smwb-checkbox__input:checked:disabled ~ .smwb-checkbox__btn .smwb-checkbox__icon {
|
|
427
480
|
color: var(--smui-disabledTextColor);
|
|
428
481
|
}
|
|
482
|
+
.smwb-checkbox_size-small {
|
|
483
|
+
min-height: var(--smui-control-h-sm, 32px);
|
|
484
|
+
}
|
|
485
|
+
.smwb-checkbox_size-small .smwb-checkbox__btn,
|
|
486
|
+
.smwb-checkbox_size-small .smwb-checkbox__input {
|
|
487
|
+
width: 16px;
|
|
488
|
+
height: 16px;
|
|
489
|
+
}
|
|
490
|
+
.smwb-checkbox_size-medium {
|
|
491
|
+
min-height: var(--smui-control-h-md, 40px);
|
|
492
|
+
}
|
|
493
|
+
.smwb-checkbox_size-large {
|
|
494
|
+
min-height: var(--smui-control-h-lg, 48px);
|
|
495
|
+
}
|
|
496
|
+
.smwb-checkbox_size-large .smwb-checkbox__btn,
|
|
497
|
+
.smwb-checkbox_size-large .smwb-checkbox__input {
|
|
498
|
+
width: 22px;
|
|
499
|
+
height: 22px;
|
|
500
|
+
}
|
|
429
501
|
.smwb-chip {
|
|
430
502
|
position: relative;
|
|
431
503
|
user-select: none;
|
|
432
|
-
height: 32px;
|
|
504
|
+
min-height: var(--smui-control-h-sm, 32px);
|
|
433
505
|
display: inline-flex;
|
|
434
506
|
align-items: center;
|
|
435
507
|
justify-content: center;
|
|
@@ -498,6 +570,27 @@
|
|
|
498
570
|
align-items: center;
|
|
499
571
|
justify-content: center;
|
|
500
572
|
}
|
|
573
|
+
.smwb-chip__content {
|
|
574
|
+
display: inline-flex;
|
|
575
|
+
align-items: center;
|
|
576
|
+
gap: 8px;
|
|
577
|
+
border-radius: inherit;
|
|
578
|
+
}
|
|
579
|
+
.smwb-chip__content:focus {
|
|
580
|
+
outline-offset: 9999px;
|
|
581
|
+
}
|
|
582
|
+
.smwb-chip__content:focus::after {
|
|
583
|
+
content: "";
|
|
584
|
+
position: absolute;
|
|
585
|
+
inset: 0;
|
|
586
|
+
border-radius: inherit;
|
|
587
|
+
outline: inherit;
|
|
588
|
+
pointer-events: none;
|
|
589
|
+
}
|
|
590
|
+
.smwb-chip.smwb-outlined > .smwb-chip__content:focus::after {
|
|
591
|
+
inset: -1px;
|
|
592
|
+
border: 1px solid transparent;
|
|
593
|
+
}
|
|
501
594
|
.smwb-chip__delete-icon {
|
|
502
595
|
background: transparent;
|
|
503
596
|
border: 0;
|
|
@@ -509,6 +602,7 @@
|
|
|
509
602
|
}
|
|
510
603
|
.smwb-chip_size-small {
|
|
511
604
|
height: 24px;
|
|
605
|
+
min-height: 24px;
|
|
512
606
|
padding: 0 8px;
|
|
513
607
|
font-size: 0.75rem;
|
|
514
608
|
}
|
|
@@ -1298,6 +1392,182 @@
|
|
|
1298
1392
|
.smwb-meter_color-error {
|
|
1299
1393
|
--smwb-meter-color: var(--smui-errorColor);
|
|
1300
1394
|
}
|
|
1395
|
+
.smwb-diff-stat {
|
|
1396
|
+
--smwb-diff-stat-added: color-mix(in srgb, var(--smui-successColor) 55%, var(--smui-onSurfaceColor));
|
|
1397
|
+
--smwb-diff-stat-removed: color-mix(in srgb, var(--smui-errorColor) 55%, var(--smui-onSurfaceColor));
|
|
1398
|
+
--smwb-diff-stat-neutral: color-mix(in srgb, var(--smui-onSurfaceColor) 60%, transparent);
|
|
1399
|
+
display: inline-flex;
|
|
1400
|
+
align-items: center;
|
|
1401
|
+
gap: 4px;
|
|
1402
|
+
min-width: 0;
|
|
1403
|
+
font-size: 0.875rem;
|
|
1404
|
+
line-height: 1.4;
|
|
1405
|
+
font-variant-numeric: tabular-nums;
|
|
1406
|
+
white-space: nowrap;
|
|
1407
|
+
}
|
|
1408
|
+
.smwb-diff-stat__text {
|
|
1409
|
+
display: inline-flex;
|
|
1410
|
+
gap: 2px;
|
|
1411
|
+
font-weight: 600;
|
|
1412
|
+
}
|
|
1413
|
+
.smwb-diff-stat__added {
|
|
1414
|
+
color: var(--smwb-diff-stat-added);
|
|
1415
|
+
}
|
|
1416
|
+
.smwb-diff-stat__removed {
|
|
1417
|
+
color: var(--smwb-diff-stat-removed);
|
|
1418
|
+
}
|
|
1419
|
+
.smwb-diff-stat__bar {
|
|
1420
|
+
display: inline-flex;
|
|
1421
|
+
align-items: center;
|
|
1422
|
+
gap: 2px;
|
|
1423
|
+
}
|
|
1424
|
+
.smwb-diff-stat__cell {
|
|
1425
|
+
width: 5px;
|
|
1426
|
+
height: 10px;
|
|
1427
|
+
border-radius: 2px;
|
|
1428
|
+
border: 1px solid var(--smwb-diff-stat-neutral);
|
|
1429
|
+
box-sizing: border-box;
|
|
1430
|
+
}
|
|
1431
|
+
.smwb-diff-stat__cell_added {
|
|
1432
|
+
border-color: var(--smwb-diff-stat-added);
|
|
1433
|
+
background-color: var(--smwb-diff-stat-added);
|
|
1434
|
+
}
|
|
1435
|
+
.smwb-diff-stat__cell_removed {
|
|
1436
|
+
border-color: var(--smwb-diff-stat-removed);
|
|
1437
|
+
background-color: var(--smwb-diff-stat-removed);
|
|
1438
|
+
}
|
|
1439
|
+
.smwb-diff-stat_compact {
|
|
1440
|
+
font-size: 0.75rem;
|
|
1441
|
+
}
|
|
1442
|
+
.smwb-diff-stat_compact .smwb-diff-stat__cell {
|
|
1443
|
+
height: 8px;
|
|
1444
|
+
}
|
|
1445
|
+
.smwb-status-dot {
|
|
1446
|
+
--smwb-status-dot-color: var(--smui-onSurfaceVariant);
|
|
1447
|
+
display: inline-block;
|
|
1448
|
+
position: relative;
|
|
1449
|
+
flex: none;
|
|
1450
|
+
box-sizing: border-box;
|
|
1451
|
+
width: 12px;
|
|
1452
|
+
height: 12px;
|
|
1453
|
+
border-radius: 50%;
|
|
1454
|
+
background-color: var(--smwb-status-dot-color);
|
|
1455
|
+
vertical-align: middle;
|
|
1456
|
+
}
|
|
1457
|
+
.smwb-status-dot_size-sm {
|
|
1458
|
+
width: 8px;
|
|
1459
|
+
height: 8px;
|
|
1460
|
+
}
|
|
1461
|
+
.smwb-status-dot_status-active {
|
|
1462
|
+
--smwb-status-dot-color: var(--smui-infoColor);
|
|
1463
|
+
}
|
|
1464
|
+
.smwb-status-dot_status-attention {
|
|
1465
|
+
--smwb-status-dot-color: var(--smui-warningColor);
|
|
1466
|
+
}
|
|
1467
|
+
.smwb-status-dot_status-idle {
|
|
1468
|
+
--smwb-status-dot-color: var(--smui-onSurfaceVariant);
|
|
1469
|
+
}
|
|
1470
|
+
.smwb-status-dot_status-done {
|
|
1471
|
+
--smwb-status-dot-color: var(--smui-successColor);
|
|
1472
|
+
}
|
|
1473
|
+
.smwb-status-dot_status-error {
|
|
1474
|
+
--smwb-status-dot-color: var(--smui-errorColor);
|
|
1475
|
+
}
|
|
1476
|
+
.smwb-status-dot_status-unknown {
|
|
1477
|
+
--smwb-status-dot-color: var(--smui-outlineColor);
|
|
1478
|
+
background-color: transparent;
|
|
1479
|
+
border: 2px solid var(--smwb-status-dot-color);
|
|
1480
|
+
}
|
|
1481
|
+
.smwb-status-dot_color-default {
|
|
1482
|
+
--smwb-status-dot-color: var(--smui-onSurfaceVariant);
|
|
1483
|
+
}
|
|
1484
|
+
.smwb-status-dot_color-primary {
|
|
1485
|
+
--smwb-status-dot-color: var(--smui-primaryColor);
|
|
1486
|
+
}
|
|
1487
|
+
.smwb-status-dot_color-secondary {
|
|
1488
|
+
--smwb-status-dot-color: var(--smui-secondaryColor);
|
|
1489
|
+
}
|
|
1490
|
+
.smwb-status-dot_color-error {
|
|
1491
|
+
--smwb-status-dot-color: var(--smui-errorColor);
|
|
1492
|
+
}
|
|
1493
|
+
.smwb-status-dot_color-success {
|
|
1494
|
+
--smwb-status-dot-color: var(--smui-successColor);
|
|
1495
|
+
}
|
|
1496
|
+
.smwb-status-dot_color-warning {
|
|
1497
|
+
--smwb-status-dot-color: var(--smui-warningColor);
|
|
1498
|
+
}
|
|
1499
|
+
.smwb-status-dot_color-info {
|
|
1500
|
+
--smwb-status-dot-color: var(--smui-infoColor);
|
|
1501
|
+
}
|
|
1502
|
+
.smwb-status-dot_pulse::after {
|
|
1503
|
+
content: "";
|
|
1504
|
+
position: absolute;
|
|
1505
|
+
inset: 0;
|
|
1506
|
+
border-radius: inherit;
|
|
1507
|
+
background-color: var(--smwb-status-dot-color);
|
|
1508
|
+
opacity: 0;
|
|
1509
|
+
pointer-events: none;
|
|
1510
|
+
}
|
|
1511
|
+
.smwb-status-dot_status-unknown.smwb-status-dot_pulse::after {
|
|
1512
|
+
inset: -2px;
|
|
1513
|
+
background-color: transparent;
|
|
1514
|
+
border: 2px solid var(--smwb-status-dot-color);
|
|
1515
|
+
}
|
|
1516
|
+
@media (prefers-reduced-motion: no-preference) {
|
|
1517
|
+
.smwb-status-dot_pulse::after {
|
|
1518
|
+
animation: smwb-status-dot-pulse 1.6s ease-out infinite;
|
|
1519
|
+
}
|
|
1520
|
+
}
|
|
1521
|
+
@keyframes smwb-status-dot-pulse {
|
|
1522
|
+
0% {
|
|
1523
|
+
transform: scale(1);
|
|
1524
|
+
opacity: 0.5;
|
|
1525
|
+
}
|
|
1526
|
+
100% {
|
|
1527
|
+
transform: scale(2.4);
|
|
1528
|
+
opacity: 0;
|
|
1529
|
+
}
|
|
1530
|
+
}
|
|
1531
|
+
@media (forced-colors: active) {
|
|
1532
|
+
.smwb-status-dot {
|
|
1533
|
+
background-color: CanvasText;
|
|
1534
|
+
}
|
|
1535
|
+
.smwb-status-dot_status-unknown {
|
|
1536
|
+
background-color: transparent;
|
|
1537
|
+
border-color: CanvasText;
|
|
1538
|
+
}
|
|
1539
|
+
.smwb-status-dot_pulse::after {
|
|
1540
|
+
background-color: CanvasText;
|
|
1541
|
+
}
|
|
1542
|
+
.smwb-status-dot_status-unknown.smwb-status-dot_pulse::after {
|
|
1543
|
+
background-color: transparent;
|
|
1544
|
+
border-color: CanvasText;
|
|
1545
|
+
}
|
|
1546
|
+
}
|
|
1547
|
+
.smwb-qr-code {
|
|
1548
|
+
display: inline-flex;
|
|
1549
|
+
flex-direction: column;
|
|
1550
|
+
align-items: center;
|
|
1551
|
+
gap: 8px;
|
|
1552
|
+
margin: 0;
|
|
1553
|
+
}
|
|
1554
|
+
.smwb-qr-code__image {
|
|
1555
|
+
border-radius: 4px;
|
|
1556
|
+
overflow: hidden;
|
|
1557
|
+
forced-color-adjust: none;
|
|
1558
|
+
print-color-adjust: exact;
|
|
1559
|
+
}
|
|
1560
|
+
.smwb-qr-code__light {
|
|
1561
|
+
fill: #ffffff;
|
|
1562
|
+
}
|
|
1563
|
+
.smwb-qr-code__dark {
|
|
1564
|
+
fill: #000000;
|
|
1565
|
+
}
|
|
1566
|
+
.smwb-qr-code__caption {
|
|
1567
|
+
color: var(--smui-onSurfaceVariant);
|
|
1568
|
+
font-size: 0.8125rem;
|
|
1569
|
+
text-align: center;
|
|
1570
|
+
}
|
|
1301
1571
|
.smwb-radio {
|
|
1302
1572
|
display: inline-flex;
|
|
1303
1573
|
gap: 20px;
|
|
@@ -1328,7 +1598,17 @@
|
|
|
1328
1598
|
display: none;
|
|
1329
1599
|
}
|
|
1330
1600
|
.smwb-radio__input {
|
|
1331
|
-
|
|
1601
|
+
position: absolute;
|
|
1602
|
+
top: 0;
|
|
1603
|
+
left: 0;
|
|
1604
|
+
width: 100%;
|
|
1605
|
+
height: 100%;
|
|
1606
|
+
margin: 0;
|
|
1607
|
+
opacity: 0;
|
|
1608
|
+
}
|
|
1609
|
+
.smwb-radio__input:focus-visible ~ .smwb-radio__btn {
|
|
1610
|
+
outline: 2px solid var(--smui-primaryColor);
|
|
1611
|
+
outline-offset: 2px;
|
|
1332
1612
|
}
|
|
1333
1613
|
.smwb-radio__input:active ~ .radio__btn:hover ~ .smwb-radio__bg {
|
|
1334
1614
|
transform: translate(-50%, -50%) scale(1);
|
|
@@ -1413,6 +1693,27 @@
|
|
|
1413
1693
|
pointer-events: none;
|
|
1414
1694
|
color: var(--smui-primaryTextColor);
|
|
1415
1695
|
}
|
|
1696
|
+
.smwb-radio_size-small {
|
|
1697
|
+
min-height: var(--smui-control-h-sm, 32px);
|
|
1698
|
+
}
|
|
1699
|
+
.smwb-radio_size-small .smwb-radio__btn {
|
|
1700
|
+
width: 16px;
|
|
1701
|
+
height: 16px;
|
|
1702
|
+
}
|
|
1703
|
+
.smwb-radio_size-small .smwb-radio__btn::after {
|
|
1704
|
+
width: 8px;
|
|
1705
|
+
height: 8px;
|
|
1706
|
+
}
|
|
1707
|
+
.smwb-radio_size-medium {
|
|
1708
|
+
min-height: var(--smui-control-h-md, 40px);
|
|
1709
|
+
}
|
|
1710
|
+
.smwb-radio_size-large {
|
|
1711
|
+
min-height: var(--smui-control-h-lg, 48px);
|
|
1712
|
+
}
|
|
1713
|
+
.smwb-radio_size-large .smwb-radio__btn {
|
|
1714
|
+
width: 22px;
|
|
1715
|
+
height: 22px;
|
|
1716
|
+
}
|
|
1416
1717
|
@keyframes ping {
|
|
1417
1718
|
75%,
|
|
1418
1719
|
100% {
|
|
@@ -1469,6 +1770,20 @@
|
|
|
1469
1770
|
.smwb-sidebar.smwb-compactMini .smwb-nav-item__title {
|
|
1470
1771
|
display: none;
|
|
1471
1772
|
}
|
|
1773
|
+
.smwb-sidebar.smwb-sidebar_contained {
|
|
1774
|
+
position: relative;
|
|
1775
|
+
top: auto;
|
|
1776
|
+
left: auto;
|
|
1777
|
+
height: 100%;
|
|
1778
|
+
min-height: 0;
|
|
1779
|
+
align-self: stretch;
|
|
1780
|
+
flex-shrink: 0;
|
|
1781
|
+
overflow-y: auto;
|
|
1782
|
+
overflow-x: hidden;
|
|
1783
|
+
}
|
|
1784
|
+
.smwb-sidebar.smwb-sidebar_contained .smwb-nav-item {
|
|
1785
|
+
overflow: hidden;
|
|
1786
|
+
}
|
|
1472
1787
|
.smwb-sidebar__collapse {
|
|
1473
1788
|
width: 100%;
|
|
1474
1789
|
display: flex;
|
|
@@ -1511,6 +1826,9 @@
|
|
|
1511
1826
|
align-items: center;
|
|
1512
1827
|
gap: 5px;
|
|
1513
1828
|
}
|
|
1829
|
+
.smwb-sidebar__nav .smwb-nav-item {
|
|
1830
|
+
flex-shrink: 0;
|
|
1831
|
+
}
|
|
1514
1832
|
.smwb-sidebar .smwb-nav-item {
|
|
1515
1833
|
position: relative;
|
|
1516
1834
|
color: var(--smui-primaryTextColor);
|
|
@@ -1843,6 +2161,10 @@
|
|
|
1843
2161
|
}
|
|
1844
2162
|
.smwb-text-field__input:not(.smwb-text-field__input--inline) {
|
|
1845
2163
|
padding: 16px 16px 17px;
|
|
2164
|
+
padding-top: 0;
|
|
2165
|
+
padding-bottom: 0;
|
|
2166
|
+
box-sizing: border-box;
|
|
2167
|
+
min-height: var(--smui-control-h-md, 40px);
|
|
1846
2168
|
}
|
|
1847
2169
|
.smwb-text-field__input::placeholder {
|
|
1848
2170
|
opacity: 0;
|
|
@@ -2046,19 +2368,33 @@
|
|
|
2046
2368
|
width: 100%;
|
|
2047
2369
|
min-width: 0;
|
|
2048
2370
|
}
|
|
2371
|
+
.smwb-text-field:not(.smwb-text-field--filled) .smwb-text-field__label:not(.smwb-text-field__label--shrink) {
|
|
2372
|
+
transform: translate(16px, calc((var(--smui-control-h-md, 40px) - 23px) / 2));
|
|
2373
|
+
}
|
|
2049
2374
|
.smwb-text-field_size-small .smwb-text-field__input:not(.smwb-text-field__input--inline) {
|
|
2050
|
-
padding-top:
|
|
2051
|
-
padding-bottom:
|
|
2375
|
+
padding-top: 0;
|
|
2376
|
+
padding-bottom: 0;
|
|
2377
|
+
min-height: var(--smui-control-h-sm, 32px);
|
|
2052
2378
|
font-size: 13px;
|
|
2053
2379
|
}
|
|
2054
2380
|
.smwb-text-field_size-small:not(.smwb-text-field--filled) .smwb-text-field__label:not(.smwb-text-field__label--shrink) {
|
|
2055
|
-
transform: translate(16px,
|
|
2381
|
+
transform: translate(16px, calc((var(--smui-control-h-sm, 32px) - 23px) / 2));
|
|
2056
2382
|
}
|
|
2057
2383
|
.smwb-text-field_size-large .smwb-text-field__input:not(.smwb-text-field__input--inline) {
|
|
2058
|
-
padding-top:
|
|
2059
|
-
padding-bottom:
|
|
2384
|
+
padding-top: 0;
|
|
2385
|
+
padding-bottom: 0;
|
|
2386
|
+
min-height: var(--smui-control-h-lg, 48px);
|
|
2060
2387
|
font-size: 16px;
|
|
2061
2388
|
}
|
|
2389
|
+
.smwb-text-field_size-large:not(.smwb-text-field--filled) .smwb-text-field__label:not(.smwb-text-field__label--shrink) {
|
|
2390
|
+
transform: translate(16px, calc((var(--smui-control-h-lg, 48px) - 23px) / 2));
|
|
2391
|
+
}
|
|
2392
|
+
.smwb-text-field--filled .smwb-text-field__input:not(.smwb-text-field__input--inline) {
|
|
2393
|
+
box-sizing: content-box;
|
|
2394
|
+
min-height: 0;
|
|
2395
|
+
padding-top: 23px;
|
|
2396
|
+
padding-bottom: 10px;
|
|
2397
|
+
}
|
|
2062
2398
|
.smwb-toggle {
|
|
2063
2399
|
width: 50px;
|
|
2064
2400
|
height: 30px;
|
|
@@ -2079,6 +2415,18 @@
|
|
|
2079
2415
|
flex-direction: row-reverse;
|
|
2080
2416
|
align-items: center;
|
|
2081
2417
|
}
|
|
2418
|
+
.smwb-toggle__wrapper:has(.smwb-toggle_size-small) {
|
|
2419
|
+
min-height: var(--smui-control-h-sm, 32px);
|
|
2420
|
+
justify-content: center;
|
|
2421
|
+
}
|
|
2422
|
+
.smwb-toggle__wrapper:has(.smwb-toggle_size-medium) {
|
|
2423
|
+
min-height: var(--smui-control-h-md, 40px);
|
|
2424
|
+
justify-content: center;
|
|
2425
|
+
}
|
|
2426
|
+
.smwb-toggle__wrapper:has(.smwb-toggle_size-large) {
|
|
2427
|
+
min-height: var(--smui-control-h-lg, 48px);
|
|
2428
|
+
justify-content: center;
|
|
2429
|
+
}
|
|
2082
2430
|
.smwb-toggle.smwb-disabled {
|
|
2083
2431
|
opacity: 0.35;
|
|
2084
2432
|
pointer-events: none;
|
|
@@ -2126,7 +2474,17 @@
|
|
|
2126
2474
|
opacity: 1;
|
|
2127
2475
|
}
|
|
2128
2476
|
.smwb-toggle__checkbox {
|
|
2129
|
-
|
|
2477
|
+
position: absolute;
|
|
2478
|
+
top: 0;
|
|
2479
|
+
left: 0;
|
|
2480
|
+
width: 100%;
|
|
2481
|
+
height: 100%;
|
|
2482
|
+
margin: 0;
|
|
2483
|
+
opacity: 0;
|
|
2484
|
+
}
|
|
2485
|
+
.smwb-toggle__checkbox:focus-visible ~ .smwb-toggle__track {
|
|
2486
|
+
outline: 2px solid var(--smui-primaryColor);
|
|
2487
|
+
outline-offset: 2px;
|
|
2130
2488
|
}
|
|
2131
2489
|
.smwb-toggle__checkbox:checked ~ .smwb-toggle__track {
|
|
2132
2490
|
background-color: var(--smui-toggleTrackActiveColor);
|
|
@@ -2179,7 +2537,7 @@
|
|
|
2179
2537
|
white-space: nowrap;
|
|
2180
2538
|
height: 48px;
|
|
2181
2539
|
}
|
|
2182
|
-
.smwb-menu__item:not(.smwb-menu__item--selected):not(:active):hover:before {
|
|
2540
|
+
.smwb-menu__item:not(.smwb-menu__item--selected):not(:active):not(:focus-visible):not(.smwb-select-field__option--active):hover:before {
|
|
2183
2541
|
opacity: 0.08;
|
|
2184
2542
|
}
|
|
2185
2543
|
.smwb-menu__item:before {
|
|
@@ -2201,6 +2559,16 @@
|
|
|
2201
2559
|
.smwb-menu__item--selected:before {
|
|
2202
2560
|
opacity: 0.08;
|
|
2203
2561
|
}
|
|
2562
|
+
.smwb-menu__item:focus-visible {
|
|
2563
|
+
outline: 2px solid var(--smui-primaryColor);
|
|
2564
|
+
outline-offset: -2px;
|
|
2565
|
+
}
|
|
2566
|
+
.smwb-menu__item:focus-visible:before {
|
|
2567
|
+
opacity: 0.12;
|
|
2568
|
+
}
|
|
2569
|
+
.smwb-menu__item:has( > .smwb-menu__item-inner:focus-visible):before {
|
|
2570
|
+
opacity: 0.12;
|
|
2571
|
+
}
|
|
2204
2572
|
.smwb-menu__item:active:before {
|
|
2205
2573
|
opacity: 0.12;
|
|
2206
2574
|
}
|
|
@@ -2212,6 +2580,10 @@
|
|
|
2212
2580
|
color: currentColor;
|
|
2213
2581
|
gap: 6px;
|
|
2214
2582
|
}
|
|
2583
|
+
.smwb-menu__item-inner:focus-visible {
|
|
2584
|
+
outline: 2px solid var(--smui-primaryColor);
|
|
2585
|
+
outline-offset: -2px;
|
|
2586
|
+
}
|
|
2215
2587
|
.smwb-menu__text {
|
|
2216
2588
|
flex-grow: 1;
|
|
2217
2589
|
}
|
|
@@ -2306,6 +2678,29 @@
|
|
|
2306
2678
|
opacity: 0.38;
|
|
2307
2679
|
cursor: default;
|
|
2308
2680
|
}
|
|
2681
|
+
.smwb-tabs__overflow-trigger {
|
|
2682
|
+
display: inline-flex;
|
|
2683
|
+
align-items: center;
|
|
2684
|
+
justify-content: center;
|
|
2685
|
+
flex: 0 0 auto;
|
|
2686
|
+
width: 40px;
|
|
2687
|
+
padding: 0;
|
|
2688
|
+
border: none;
|
|
2689
|
+
background: none;
|
|
2690
|
+
color: var(--smui-onSurfaceVariant);
|
|
2691
|
+
cursor: pointer;
|
|
2692
|
+
}
|
|
2693
|
+
.smwb-tabs__overflow-trigger:hover:not(:disabled) {
|
|
2694
|
+
background-color: var(--smui-onSurfaceHover);
|
|
2695
|
+
}
|
|
2696
|
+
.smwb-tabs__overflow-trigger:focus-visible {
|
|
2697
|
+
outline: 2px solid var(--smui-primaryColor);
|
|
2698
|
+
outline-offset: -2px;
|
|
2699
|
+
}
|
|
2700
|
+
.smwb-tabs__overflow-trigger:disabled {
|
|
2701
|
+
opacity: 0.38;
|
|
2702
|
+
cursor: default;
|
|
2703
|
+
}
|
|
2309
2704
|
.smwb-tabs__indicator {
|
|
2310
2705
|
display: flex;
|
|
2311
2706
|
justify-content: center;
|
|
@@ -2366,6 +2761,10 @@
|
|
|
2366
2761
|
opacity: 0.12;
|
|
2367
2762
|
transition-duration: 75ms;
|
|
2368
2763
|
}
|
|
2764
|
+
.smwb-tab:focus-visible {
|
|
2765
|
+
outline: 2px solid var(--smui-primaryColor);
|
|
2766
|
+
outline-offset: -2px;
|
|
2767
|
+
}
|
|
2369
2768
|
.smwb-tab__content {
|
|
2370
2769
|
position: relative;
|
|
2371
2770
|
display: flex;
|
|
@@ -2418,33 +2817,124 @@
|
|
|
2418
2817
|
pointer-events: none;
|
|
2419
2818
|
cursor: default;
|
|
2420
2819
|
}
|
|
2421
|
-
.smwb-
|
|
2422
|
-
padding: 0 12px;
|
|
2423
|
-
font-weight: 500;
|
|
2424
|
-
letter-spacing: normal;
|
|
2425
|
-
text-transform: none;
|
|
2426
|
-
}
|
|
2427
|
-
.smwb-slider {
|
|
2428
|
-
display: inline-block;
|
|
2820
|
+
.smwb-tab-item {
|
|
2429
2821
|
position: relative;
|
|
2430
|
-
height: 4px;
|
|
2431
|
-
width: 100%;
|
|
2432
|
-
padding: 13px 0;
|
|
2433
|
-
border-radius: 12px;
|
|
2434
|
-
cursor: pointer;
|
|
2435
|
-
box-sizing: content-box;
|
|
2436
|
-
color: var(--smui-primaryColor);
|
|
2437
|
-
touch-action: none;
|
|
2438
|
-
}
|
|
2439
|
-
.smwb-slider__ticks {
|
|
2440
2822
|
display: flex;
|
|
2441
2823
|
align-items: center;
|
|
2442
|
-
|
|
2824
|
+
flex: 1 0 auto;
|
|
2825
|
+
}
|
|
2826
|
+
.smwb-tab-item:before {
|
|
2443
2827
|
position: absolute;
|
|
2444
|
-
|
|
2445
|
-
|
|
2446
|
-
|
|
2447
|
-
|
|
2828
|
+
inset: 0;
|
|
2829
|
+
opacity: 0;
|
|
2830
|
+
content: "";
|
|
2831
|
+
pointer-events: none;
|
|
2832
|
+
transition: opacity 15ms linear;
|
|
2833
|
+
background-color: #6750a4;
|
|
2834
|
+
}
|
|
2835
|
+
.smwb-tab-item:hover:not(.smwb-tab-item--disabled):before {
|
|
2836
|
+
opacity: 0.04;
|
|
2837
|
+
}
|
|
2838
|
+
.smwb-tab-item > .smwb-tab:hover:before {
|
|
2839
|
+
opacity: 0;
|
|
2840
|
+
}
|
|
2841
|
+
.smwb-tab-item > .smwb-tab:focus:before {
|
|
2842
|
+
opacity: 0.12;
|
|
2843
|
+
}
|
|
2844
|
+
.smwb-tab-item > .smwb-tab:not(:last-child) {
|
|
2845
|
+
padding-right: 8px;
|
|
2846
|
+
}
|
|
2847
|
+
.smwb-tab__close,
|
|
2848
|
+
.smwb-tab__actions {
|
|
2849
|
+
position: relative;
|
|
2850
|
+
z-index: 1;
|
|
2851
|
+
flex: 0 0 auto;
|
|
2852
|
+
margin-right: 4px;
|
|
2853
|
+
}
|
|
2854
|
+
.smwb-tab__actions {
|
|
2855
|
+
display: inline-flex;
|
|
2856
|
+
align-items: center;
|
|
2857
|
+
}
|
|
2858
|
+
.smwb-tab__close {
|
|
2859
|
+
display: inline-flex;
|
|
2860
|
+
align-items: center;
|
|
2861
|
+
justify-content: center;
|
|
2862
|
+
box-sizing: border-box;
|
|
2863
|
+
width: 24px;
|
|
2864
|
+
height: 24px;
|
|
2865
|
+
padding: 0;
|
|
2866
|
+
border: none;
|
|
2867
|
+
border-radius: 50%;
|
|
2868
|
+
background: none;
|
|
2869
|
+
color: var(--smui-onSurfaceVariant);
|
|
2870
|
+
cursor: pointer;
|
|
2871
|
+
}
|
|
2872
|
+
.smwb-tab__close:hover:not(:disabled) {
|
|
2873
|
+
background-color: var(--smui-onSurfaceHover);
|
|
2874
|
+
}
|
|
2875
|
+
.smwb-tab__close:focus-visible {
|
|
2876
|
+
outline: 2px solid var(--smui-primaryColor);
|
|
2877
|
+
outline-offset: -2px;
|
|
2878
|
+
}
|
|
2879
|
+
.smwb-tab__close:disabled {
|
|
2880
|
+
opacity: 0.38;
|
|
2881
|
+
cursor: default;
|
|
2882
|
+
}
|
|
2883
|
+
.smwb-tabs--dense .smwb-tab {
|
|
2884
|
+
padding: 0 12px;
|
|
2885
|
+
font-weight: 500;
|
|
2886
|
+
letter-spacing: normal;
|
|
2887
|
+
text-transform: none;
|
|
2888
|
+
}
|
|
2889
|
+
.smwb-tabs .smwb-tab__close {
|
|
2890
|
+
opacity: 0;
|
|
2891
|
+
pointer-events: none;
|
|
2892
|
+
transition: opacity 0.15s linear;
|
|
2893
|
+
}
|
|
2894
|
+
.smwb-tabs .smwb-tab-item:hover:not(.smwb-tab-item--disabled) .smwb-tab__close:not(:disabled),
|
|
2895
|
+
.smwb-tabs .smwb-tab-item--active .smwb-tab__close:not(:disabled),
|
|
2896
|
+
.smwb-tabs .smwb-tab-item:focus-within .smwb-tab__close:not(:disabled) {
|
|
2897
|
+
opacity: 1;
|
|
2898
|
+
pointer-events: auto;
|
|
2899
|
+
}
|
|
2900
|
+
.smwb-tabs .smwb-tab-item--dragging {
|
|
2901
|
+
opacity: 0.6;
|
|
2902
|
+
}
|
|
2903
|
+
.smwb-tabs .smwb-tab-item--drop-target:after {
|
|
2904
|
+
content: "";
|
|
2905
|
+
position: absolute;
|
|
2906
|
+
top: 0;
|
|
2907
|
+
bottom: 0;
|
|
2908
|
+
left: 0;
|
|
2909
|
+
width: 2px;
|
|
2910
|
+
background-color: var(--smui-primaryColor);
|
|
2911
|
+
pointer-events: none;
|
|
2912
|
+
}
|
|
2913
|
+
.smwb-tab-panel:focus-visible {
|
|
2914
|
+
outline: 2px solid var(--smui-primaryColor);
|
|
2915
|
+
outline-offset: -2px;
|
|
2916
|
+
}
|
|
2917
|
+
.smwb-slider {
|
|
2918
|
+
display: inline-block;
|
|
2919
|
+
position: relative;
|
|
2920
|
+
height: 4px;
|
|
2921
|
+
width: 100%;
|
|
2922
|
+
padding: 13px 0;
|
|
2923
|
+
border-radius: 12px;
|
|
2924
|
+
cursor: pointer;
|
|
2925
|
+
box-sizing: content-box;
|
|
2926
|
+
color: var(--smui-primaryColor);
|
|
2927
|
+
touch-action: none;
|
|
2928
|
+
}
|
|
2929
|
+
.smwb-slider__ticks {
|
|
2930
|
+
display: flex;
|
|
2931
|
+
align-items: center;
|
|
2932
|
+
width: 100%;
|
|
2933
|
+
position: absolute;
|
|
2934
|
+
top: 50%;
|
|
2935
|
+
transform: translateY(-50%);
|
|
2936
|
+
left: 0;
|
|
2937
|
+
z-index: 1;
|
|
2448
2938
|
height: 4px;
|
|
2449
2939
|
justify-content: space-between;
|
|
2450
2940
|
}
|
|
@@ -2723,6 +3213,9 @@
|
|
|
2723
3213
|
}
|
|
2724
3214
|
.smwb-select-field:not(.smwb-select-field--inline) {
|
|
2725
3215
|
padding: 16px;
|
|
3216
|
+
padding-top: calc((var(--smui-control-h-md, 40px) - 24px) / 2);
|
|
3217
|
+
padding-bottom: calc((var(--smui-control-h-md, 40px) - 24px) / 2);
|
|
3218
|
+
min-height: var(--smui-control-h-md, 40px);
|
|
2726
3219
|
}
|
|
2727
3220
|
.smwb-select-field:not(.smwb-select-field--inline).smwb-select-field--filled {
|
|
2728
3221
|
padding: 22px 16px 10px 16px;
|
|
@@ -2751,12 +3244,39 @@
|
|
|
2751
3244
|
width: 0;
|
|
2752
3245
|
height: 0;
|
|
2753
3246
|
}
|
|
3247
|
+
.smwb-select-field__control {
|
|
3248
|
+
display: flex;
|
|
3249
|
+
flex: 1 1 auto;
|
|
3250
|
+
align-items: center;
|
|
3251
|
+
align-self: stretch;
|
|
3252
|
+
}
|
|
3253
|
+
.smwb-select-field__control:focus {
|
|
3254
|
+
outline-offset: 9999px;
|
|
3255
|
+
}
|
|
3256
|
+
.smwb-select-field__control:focus::after {
|
|
3257
|
+
content: "";
|
|
3258
|
+
position: absolute;
|
|
3259
|
+
inset: 0;
|
|
3260
|
+
outline: inherit;
|
|
3261
|
+
pointer-events: none;
|
|
3262
|
+
}
|
|
2754
3263
|
.smwb-select-field__actions {
|
|
2755
3264
|
display: flex;
|
|
2756
3265
|
align-items: center;
|
|
2757
3266
|
column-gap: 2px;
|
|
2758
3267
|
margin-right: -7px;
|
|
2759
3268
|
}
|
|
3269
|
+
.smwb-select-field__clear {
|
|
3270
|
+
display: inline-flex;
|
|
3271
|
+
flex-shrink: 0;
|
|
3272
|
+
margin: 0;
|
|
3273
|
+
padding: 0;
|
|
3274
|
+
border: 0;
|
|
3275
|
+
background: none;
|
|
3276
|
+
color: inherit;
|
|
3277
|
+
font: inherit;
|
|
3278
|
+
cursor: pointer;
|
|
3279
|
+
}
|
|
2760
3280
|
.smwb-select-field__values {
|
|
2761
3281
|
white-space: nowrap;
|
|
2762
3282
|
font: inherit;
|
|
@@ -2766,7 +3286,8 @@
|
|
|
2766
3286
|
.smwb-select-field__values > *:not(:first-child) {
|
|
2767
3287
|
margin-left: 4px;
|
|
2768
3288
|
}
|
|
2769
|
-
.smwb-select-field__values +
|
|
3289
|
+
.smwb-select-field__values + .smwb-select-field__search,
|
|
3290
|
+
.smwb-select-field__values + .smwb-select-field__control > .smwb-select-field__search {
|
|
2770
3291
|
margin-left: 4px;
|
|
2771
3292
|
}
|
|
2772
3293
|
.smwb-select-field__values .smwb-chip {
|
|
@@ -2866,16 +3387,37 @@
|
|
|
2866
3387
|
font-style: italic;
|
|
2867
3388
|
color: var(--smui-primaryColor);
|
|
2868
3389
|
}
|
|
3390
|
+
.smwb-select-field__listbox,
|
|
3391
|
+
.smwb-select-field__group-options {
|
|
3392
|
+
list-style: none;
|
|
3393
|
+
margin: 0;
|
|
3394
|
+
padding: 0;
|
|
3395
|
+
}
|
|
3396
|
+
.smwb-select-field__option--active {
|
|
3397
|
+
outline: 2px solid var(--smui-primaryColor);
|
|
3398
|
+
outline-offset: -2px;
|
|
3399
|
+
}
|
|
3400
|
+
.smwb-menu .smwb-menu__item.smwb-select-field__option--active:before {
|
|
3401
|
+
opacity: 0.12;
|
|
3402
|
+
}
|
|
2869
3403
|
.smwb-text-field_size-small .smwb-select-field:not(.smwb-select-field--inline) {
|
|
2870
|
-
padding-top:
|
|
2871
|
-
padding-bottom:
|
|
3404
|
+
padding-top: calc((var(--smui-control-h-sm, 32px) - 24px) / 2);
|
|
3405
|
+
padding-bottom: calc((var(--smui-control-h-sm, 32px) - 24px) / 2);
|
|
3406
|
+
min-height: var(--smui-control-h-sm, 32px);
|
|
2872
3407
|
font-size: 13px;
|
|
2873
3408
|
}
|
|
2874
3409
|
.smwb-text-field_size-large .smwb-select-field:not(.smwb-select-field--inline) {
|
|
2875
|
-
padding-top:
|
|
2876
|
-
padding-bottom:
|
|
3410
|
+
padding-top: calc((var(--smui-control-h-lg, 48px) - 24px) / 2);
|
|
3411
|
+
padding-bottom: calc((var(--smui-control-h-lg, 48px) - 24px) / 2);
|
|
3412
|
+
min-height: var(--smui-control-h-lg, 48px);
|
|
2877
3413
|
font-size: 16px;
|
|
2878
3414
|
}
|
|
3415
|
+
.smwb-select-field--filled:not(.smwb-select-field--inline),
|
|
3416
|
+
.smwb-text-field_size-small .smwb-select-field--filled:not(.smwb-select-field--inline),
|
|
3417
|
+
.smwb-text-field_size-large .smwb-select-field--filled:not(.smwb-select-field--inline) {
|
|
3418
|
+
min-height: 0;
|
|
3419
|
+
padding: 22px 16px 10px 16px;
|
|
3420
|
+
}
|
|
2879
3421
|
.smwb-ripple {
|
|
2880
3422
|
position: absolute;
|
|
2881
3423
|
inset: 0;
|
|
@@ -2971,6 +3513,39 @@
|
|
|
2971
3513
|
padding-top: 4px;
|
|
2972
3514
|
padding-bottom: 4px;
|
|
2973
3515
|
}
|
|
3516
|
+
.smwb-list__item.smwb-list__item_link,
|
|
3517
|
+
.smwb-list_dense .smwb-list__item.smwb-list__item_link {
|
|
3518
|
+
padding: 0;
|
|
3519
|
+
gap: 0;
|
|
3520
|
+
}
|
|
3521
|
+
.smwb-list__item_link > .smwb-list__item__end {
|
|
3522
|
+
padding-right: 16px;
|
|
3523
|
+
}
|
|
3524
|
+
.smwb-list__item_link > .smwb-list__item__end:empty {
|
|
3525
|
+
display: none;
|
|
3526
|
+
}
|
|
3527
|
+
.smwb-list__item__link {
|
|
3528
|
+
display: flex;
|
|
3529
|
+
align-items: center;
|
|
3530
|
+
align-self: stretch;
|
|
3531
|
+
flex: auto;
|
|
3532
|
+
min-width: 0;
|
|
3533
|
+
min-height: inherit;
|
|
3534
|
+
box-sizing: border-box;
|
|
3535
|
+
gap: 20px;
|
|
3536
|
+
padding: 8px 16px;
|
|
3537
|
+
color: inherit;
|
|
3538
|
+
text-decoration: none;
|
|
3539
|
+
}
|
|
3540
|
+
.smwb-list__item__link:focus-visible {
|
|
3541
|
+
outline: 2px solid var(--smui-primaryColor);
|
|
3542
|
+
outline-offset: -2px;
|
|
3543
|
+
}
|
|
3544
|
+
.smwb-list_dense .smwb-list__item__link,
|
|
3545
|
+
.smwb-list__item_dense > .smwb-list__item__link {
|
|
3546
|
+
padding-top: 4px;
|
|
3547
|
+
padding-bottom: 4px;
|
|
3548
|
+
}
|
|
2974
3549
|
.smwb-list__subheader {
|
|
2975
3550
|
padding: 8px 16px;
|
|
2976
3551
|
color: var(--smui-onSurfaceVariant);
|
|
@@ -3193,7 +3768,6 @@
|
|
|
3193
3768
|
flex-direction: column;
|
|
3194
3769
|
border-radius: 8px;
|
|
3195
3770
|
overflow: visible;
|
|
3196
|
-
outline: none;
|
|
3197
3771
|
}
|
|
3198
3772
|
.smwb-thumb-card--interactive {
|
|
3199
3773
|
cursor: pointer;
|
|
@@ -3202,6 +3776,11 @@
|
|
|
3202
3776
|
opacity: 0.5;
|
|
3203
3777
|
pointer-events: none;
|
|
3204
3778
|
}
|
|
3779
|
+
.smwb-thumb-card__content {
|
|
3780
|
+
display: flex;
|
|
3781
|
+
flex-direction: column;
|
|
3782
|
+
outline: none;
|
|
3783
|
+
}
|
|
3205
3784
|
.smwb-thumb-card__media {
|
|
3206
3785
|
position: relative;
|
|
3207
3786
|
width: 100%;
|
|
@@ -3214,7 +3793,7 @@
|
|
|
3214
3793
|
outline: 2px solid var(--smui-primaryColor);
|
|
3215
3794
|
outline-offset: 1px;
|
|
3216
3795
|
}
|
|
3217
|
-
.smwb-thumb-
|
|
3796
|
+
.smwb-thumb-card__content:focus-visible .smwb-thumb-card__media {
|
|
3218
3797
|
outline: 2px solid var(--smui-primaryColor);
|
|
3219
3798
|
outline-offset: 1px;
|
|
3220
3799
|
}
|
|
@@ -4130,80 +4709,308 @@
|
|
|
4130
4709
|
opacity: 0;
|
|
4131
4710
|
}
|
|
4132
4711
|
}
|
|
4133
|
-
.smwb-
|
|
4134
|
-
|
|
4135
|
-
|
|
4136
|
-
opacity: 0;
|
|
4137
|
-
transition: all 0.2s ease-in-out;
|
|
4138
|
-
box-shadow: rgba(0, 0, 0, 0.14) 0px 8px 10px -5px, rgba(0, 0, 0, 0.14) 0px 1px 14px 1px, rgba(0, 0, 0, 0.14) 0px 6px 22px 4px;
|
|
4139
|
-
z-index: 100;
|
|
4140
|
-
padding: 10px 20px 20px;
|
|
4141
|
-
box-sizing: border-box;
|
|
4142
|
-
overflow: hidden;
|
|
4143
|
-
display: flex;
|
|
4144
|
-
max-width: 100vw;
|
|
4145
|
-
}
|
|
4146
|
-
.smwb-sheet__header {
|
|
4147
|
-
display: flex;
|
|
4148
|
-
justify-content: space-between;
|
|
4712
|
+
.smwb-kbd {
|
|
4713
|
+
position: relative;
|
|
4714
|
+
display: inline-flex;
|
|
4149
4715
|
align-items: center;
|
|
4716
|
+
gap: 2px;
|
|
4150
4717
|
flex-shrink: 0;
|
|
4151
|
-
|
|
4152
|
-
|
|
4153
|
-
|
|
4154
|
-
|
|
4155
|
-
min-width: 0;
|
|
4718
|
+
font-family: inherit;
|
|
4719
|
+
font-size: inherit;
|
|
4720
|
+
line-height: 1;
|
|
4721
|
+
white-space: nowrap;
|
|
4156
4722
|
}
|
|
4157
|
-
.smwb-
|
|
4158
|
-
|
|
4159
|
-
display: flex;
|
|
4723
|
+
.smwb-kbd__key {
|
|
4724
|
+
box-sizing: border-box;
|
|
4725
|
+
display: inline-flex;
|
|
4160
4726
|
align-items: center;
|
|
4161
4727
|
justify-content: center;
|
|
4162
|
-
|
|
4163
|
-
|
|
4728
|
+
min-width: 1.5em;
|
|
4729
|
+
height: 1.5em;
|
|
4730
|
+
padding: 0 0.375em;
|
|
4731
|
+
border: 1px solid color-mix(in srgb, currentColor 35%, transparent);
|
|
4732
|
+
border-radius: 4px;
|
|
4733
|
+
background-color: color-mix(in srgb, currentColor 10%, transparent);
|
|
4734
|
+
font-family: inherit;
|
|
4735
|
+
font-size: inherit;
|
|
4736
|
+
font-weight: 500;
|
|
4737
|
+
line-height: 1;
|
|
4738
|
+
color: inherit;
|
|
4164
4739
|
user-select: none;
|
|
4165
4740
|
}
|
|
4166
|
-
|
|
4167
|
-
|
|
4168
|
-
|
|
4169
|
-
}
|
|
4170
|
-
.smwb-sheet__drag-handle-bar {
|
|
4171
|
-
display: block;
|
|
4172
|
-
border-radius: 999px;
|
|
4173
|
-
background-color: var(--smui-onSurfaceVariant);
|
|
4174
|
-
opacity: 0.4;
|
|
4175
|
-
transition: opacity 0.15s ease-in-out;
|
|
4741
|
+
@media (forced-colors: active) {
|
|
4742
|
+
.smwb-kbd__key {
|
|
4743
|
+
border-color: currentColor;
|
|
4744
|
+
}
|
|
4176
4745
|
}
|
|
4177
|
-
.smwb-
|
|
4178
|
-
.smwb-sheet__drag-handle:active .smwb-sheet__drag-handle-bar {
|
|
4746
|
+
.smwb-kbd__separator {
|
|
4179
4747
|
opacity: 0.7;
|
|
4748
|
+
user-select: none;
|
|
4180
4749
|
}
|
|
4181
|
-
.smwb-
|
|
4182
|
-
|
|
4183
|
-
|
|
4184
|
-
|
|
4185
|
-
|
|
4750
|
+
.smwb-kbd__text {
|
|
4751
|
+
position: absolute;
|
|
4752
|
+
width: 1px;
|
|
4753
|
+
height: 1px;
|
|
4754
|
+
margin: -1px;
|
|
4755
|
+
padding: 0;
|
|
4756
|
+
overflow: hidden;
|
|
4757
|
+
clip: rect(0 0 0 0);
|
|
4758
|
+
white-space: nowrap;
|
|
4759
|
+
border: 0;
|
|
4186
4760
|
}
|
|
4187
|
-
.smwb-
|
|
4188
|
-
|
|
4761
|
+
.smwb-modal__overlay > .smwb-modal.smwb-command-palette {
|
|
4762
|
+
width: min(640px, calc(100vw - 32px));
|
|
4763
|
+
height: auto;
|
|
4764
|
+
min-height: 0;
|
|
4765
|
+
max-height: min(560px, calc(100vh - 2 * min(12vh, 96px)));
|
|
4766
|
+
overflow: hidden;
|
|
4767
|
+
padding: 0;
|
|
4768
|
+
border-radius: 16px;
|
|
4769
|
+
margin-block: min(12vh, 96px) auto;
|
|
4189
4770
|
}
|
|
4190
|
-
|
|
4191
|
-
|
|
4771
|
+
@media (max-width: 600px) {
|
|
4772
|
+
.smwb-modal__overlay > .smwb-modal.smwb-command-palette {
|
|
4773
|
+
margin-block-start: 16px;
|
|
4774
|
+
}
|
|
4192
4775
|
}
|
|
4193
|
-
.smwb-
|
|
4194
|
-
|
|
4195
|
-
|
|
4196
|
-
|
|
4197
|
-
height:
|
|
4198
|
-
cursor: ns-resize;
|
|
4776
|
+
.smwb-command-palette__panel {
|
|
4777
|
+
display: flex;
|
|
4778
|
+
flex-direction: column;
|
|
4779
|
+
flex: 1 1 auto;
|
|
4780
|
+
min-height: 0;
|
|
4199
4781
|
}
|
|
4200
|
-
.smwb-
|
|
4201
|
-
|
|
4202
|
-
|
|
4203
|
-
|
|
4782
|
+
.smwb-command-palette__search {
|
|
4783
|
+
display: flex;
|
|
4784
|
+
align-items: center;
|
|
4785
|
+
gap: 8px;
|
|
4786
|
+
padding: 12px 16px;
|
|
4787
|
+
border-bottom: 1px solid var(--smui-dividerColor);
|
|
4204
4788
|
}
|
|
4205
|
-
.smwb-
|
|
4206
|
-
|
|
4789
|
+
.smwb-command-palette__search-icon {
|
|
4790
|
+
display: inline-flex;
|
|
4791
|
+
flex-shrink: 0;
|
|
4792
|
+
color: var(--smui-onSurfaceVariant);
|
|
4793
|
+
}
|
|
4794
|
+
.smwb-command-palette__input {
|
|
4795
|
+
flex: 1;
|
|
4796
|
+
min-width: 0;
|
|
4797
|
+
border: 0;
|
|
4798
|
+
background: transparent;
|
|
4799
|
+
font: inherit;
|
|
4800
|
+
font-size: 1rem;
|
|
4801
|
+
line-height: 1.5;
|
|
4802
|
+
color: var(--smui-onSurfaceColor);
|
|
4803
|
+
outline: none;
|
|
4804
|
+
}
|
|
4805
|
+
.smwb-command-palette__input::placeholder {
|
|
4806
|
+
color: var(--smui-onSurfaceVariant);
|
|
4807
|
+
opacity: 1;
|
|
4808
|
+
}
|
|
4809
|
+
.smwb-command-palette__results {
|
|
4810
|
+
flex: 1 1 auto;
|
|
4811
|
+
min-height: 0;
|
|
4812
|
+
overflow-y: auto;
|
|
4813
|
+
overscroll-behavior: contain;
|
|
4814
|
+
padding: 4px 0;
|
|
4815
|
+
}
|
|
4816
|
+
.smwb-command-palette__listbox,
|
|
4817
|
+
.smwb-command-palette__group-options {
|
|
4818
|
+
list-style: none;
|
|
4819
|
+
margin: 0;
|
|
4820
|
+
padding: 0;
|
|
4821
|
+
}
|
|
4822
|
+
.smwb-command-palette__group-label {
|
|
4823
|
+
padding: 8px 16px 4px;
|
|
4824
|
+
font-size: 12px;
|
|
4825
|
+
font-weight: 600;
|
|
4826
|
+
text-transform: uppercase;
|
|
4827
|
+
letter-spacing: 0.04em;
|
|
4828
|
+
color: var(--smui-onSurfaceVariant);
|
|
4829
|
+
}
|
|
4830
|
+
.smwb-command-palette__item {
|
|
4831
|
+
position: relative;
|
|
4832
|
+
display: grid;
|
|
4833
|
+
grid-template-columns: auto minmax(0, 1fr) auto;
|
|
4834
|
+
align-items: center;
|
|
4835
|
+
gap: 12px;
|
|
4836
|
+
min-height: 44px;
|
|
4837
|
+
padding: 4px 16px;
|
|
4838
|
+
margin: 0 4px;
|
|
4839
|
+
border-radius: 4px;
|
|
4840
|
+
cursor: pointer;
|
|
4841
|
+
color: var(--smui-onSurfaceColor);
|
|
4842
|
+
}
|
|
4843
|
+
.smwb-command-palette__item::before {
|
|
4844
|
+
content: "";
|
|
4845
|
+
position: absolute;
|
|
4846
|
+
inset: 0;
|
|
4847
|
+
border-radius: inherit;
|
|
4848
|
+
background: currentColor;
|
|
4849
|
+
opacity: 0;
|
|
4850
|
+
pointer-events: none;
|
|
4851
|
+
}
|
|
4852
|
+
.smwb-command-palette__item:hover:not(.smwb-command-palette__item_active):not(.smwb-command-palette__item_disabled)::before {
|
|
4853
|
+
opacity: 0.08;
|
|
4854
|
+
}
|
|
4855
|
+
.smwb-command-palette__item_active {
|
|
4856
|
+
outline: 2px solid var(--smui-primaryColor);
|
|
4857
|
+
outline-offset: -2px;
|
|
4858
|
+
}
|
|
4859
|
+
.smwb-command-palette__item_active::before {
|
|
4860
|
+
opacity: 0.12;
|
|
4861
|
+
}
|
|
4862
|
+
@media (forced-colors: active) {
|
|
4863
|
+
.smwb-command-palette__item_active {
|
|
4864
|
+
outline-color: Highlight;
|
|
4865
|
+
}
|
|
4866
|
+
}
|
|
4867
|
+
.smwb-command-palette__item_disabled {
|
|
4868
|
+
color: var(--smui-disabledTextColor);
|
|
4869
|
+
cursor: default;
|
|
4870
|
+
}
|
|
4871
|
+
.smwb-command-palette__item-icon {
|
|
4872
|
+
grid-column: 1;
|
|
4873
|
+
display: inline-flex;
|
|
4874
|
+
align-items: center;
|
|
4875
|
+
justify-content: center;
|
|
4876
|
+
width: 20px;
|
|
4877
|
+
height: 20px;
|
|
4878
|
+
color: var(--smui-onSurfaceVariant);
|
|
4879
|
+
}
|
|
4880
|
+
.smwb-command-palette__item-text {
|
|
4881
|
+
grid-column: 2;
|
|
4882
|
+
min-width: 0;
|
|
4883
|
+
}
|
|
4884
|
+
.smwb-command-palette__item:not(:has(> .smwb-command-palette__item-icon)) > .smwb-command-palette__item-text {
|
|
4885
|
+
grid-column: 1 / 3;
|
|
4886
|
+
}
|
|
4887
|
+
.smwb-command-palette__item-label {
|
|
4888
|
+
display: block;
|
|
4889
|
+
overflow: hidden;
|
|
4890
|
+
text-overflow: ellipsis;
|
|
4891
|
+
white-space: nowrap;
|
|
4892
|
+
}
|
|
4893
|
+
.smwb-command-palette__item-subtitle {
|
|
4894
|
+
display: block;
|
|
4895
|
+
overflow: hidden;
|
|
4896
|
+
text-overflow: ellipsis;
|
|
4897
|
+
white-space: nowrap;
|
|
4898
|
+
font-size: 0.8125rem;
|
|
4899
|
+
color: var(--smui-onSurfaceVariant);
|
|
4900
|
+
}
|
|
4901
|
+
.smwb-command-palette__item-shortcut.smwb-kbd {
|
|
4902
|
+
grid-column: 3;
|
|
4903
|
+
font-size: 0.75rem;
|
|
4904
|
+
color: var(--smui-onSurfaceVariant);
|
|
4905
|
+
}
|
|
4906
|
+
.smwb-command-palette__loading-row {
|
|
4907
|
+
display: grid;
|
|
4908
|
+
grid-template-columns: auto minmax(0, 1fr) auto;
|
|
4909
|
+
align-items: center;
|
|
4910
|
+
gap: 12px;
|
|
4911
|
+
min-height: 44px;
|
|
4912
|
+
padding: 4px 16px;
|
|
4913
|
+
margin: 0 4px;
|
|
4914
|
+
}
|
|
4915
|
+
.smwb-command-palette__message {
|
|
4916
|
+
padding: 16px 20px;
|
|
4917
|
+
text-align: center;
|
|
4918
|
+
color: var(--smui-onSurfaceVariant);
|
|
4919
|
+
}
|
|
4920
|
+
.smwb-command-palette__message_error {
|
|
4921
|
+
color: var(--smui-errorColor);
|
|
4922
|
+
}
|
|
4923
|
+
.smwb-command-palette__footer {
|
|
4924
|
+
display: flex;
|
|
4925
|
+
align-items: center;
|
|
4926
|
+
gap: 12px;
|
|
4927
|
+
padding: 8px 16px;
|
|
4928
|
+
border-top: 1px solid var(--smui-dividerColor);
|
|
4929
|
+
font-size: 0.75rem;
|
|
4930
|
+
color: var(--smui-onSurfaceVariant);
|
|
4931
|
+
}
|
|
4932
|
+
.smwb-command-palette__status {
|
|
4933
|
+
position: absolute;
|
|
4934
|
+
width: 1px;
|
|
4935
|
+
height: 1px;
|
|
4936
|
+
overflow: hidden;
|
|
4937
|
+
clip-path: inset(50%);
|
|
4938
|
+
white-space: nowrap;
|
|
4939
|
+
}
|
|
4940
|
+
.smwb-sheet {
|
|
4941
|
+
background-color: var(--smui-surfaceBackground);
|
|
4942
|
+
position: fixed;
|
|
4943
|
+
opacity: 0;
|
|
4944
|
+
transition: all 0.2s ease-in-out;
|
|
4945
|
+
box-shadow: rgba(0, 0, 0, 0.14) 0px 8px 10px -5px, rgba(0, 0, 0, 0.14) 0px 1px 14px 1px, rgba(0, 0, 0, 0.14) 0px 6px 22px 4px;
|
|
4946
|
+
z-index: 100;
|
|
4947
|
+
padding: 10px 20px 20px;
|
|
4948
|
+
box-sizing: border-box;
|
|
4949
|
+
overflow: hidden;
|
|
4950
|
+
display: flex;
|
|
4951
|
+
max-width: 100vw;
|
|
4952
|
+
}
|
|
4953
|
+
.smwb-sheet__header {
|
|
4954
|
+
display: flex;
|
|
4955
|
+
justify-content: space-between;
|
|
4956
|
+
align-items: center;
|
|
4957
|
+
flex-shrink: 0;
|
|
4958
|
+
gap: 4px;
|
|
4959
|
+
padding-bottom: 5px;
|
|
4960
|
+
}
|
|
4961
|
+
.smwb-sheet__header .smwb-button {
|
|
4962
|
+
min-width: 0;
|
|
4963
|
+
}
|
|
4964
|
+
.smwb-sheet__drag-handle {
|
|
4965
|
+
position: absolute;
|
|
4966
|
+
display: flex;
|
|
4967
|
+
align-items: center;
|
|
4968
|
+
justify-content: center;
|
|
4969
|
+
z-index: 1;
|
|
4970
|
+
touch-action: none;
|
|
4971
|
+
user-select: none;
|
|
4972
|
+
}
|
|
4973
|
+
.smwb-sheet__drag-handle:focus-visible {
|
|
4974
|
+
outline: 2px solid var(--smui-primaryColor);
|
|
4975
|
+
outline-offset: -2px;
|
|
4976
|
+
}
|
|
4977
|
+
.smwb-sheet__drag-handle-bar {
|
|
4978
|
+
display: block;
|
|
4979
|
+
border-radius: 999px;
|
|
4980
|
+
background-color: var(--smui-onSurfaceVariant);
|
|
4981
|
+
opacity: 0.4;
|
|
4982
|
+
transition: opacity 0.15s ease-in-out;
|
|
4983
|
+
}
|
|
4984
|
+
.smwb-sheet__drag-handle:hover .smwb-sheet__drag-handle-bar,
|
|
4985
|
+
.smwb-sheet__drag-handle:active .smwb-sheet__drag-handle-bar {
|
|
4986
|
+
opacity: 0.7;
|
|
4987
|
+
}
|
|
4988
|
+
.smwb-sheet_resizable.smwb-bottom {
|
|
4989
|
+
padding-top: 20px;
|
|
4990
|
+
}
|
|
4991
|
+
.smwb-sheet_resizable.smwb-top {
|
|
4992
|
+
padding-bottom: 20px;
|
|
4993
|
+
}
|
|
4994
|
+
.smwb-sheet_resizable.smwb-left {
|
|
4995
|
+
padding-right: 20px;
|
|
4996
|
+
}
|
|
4997
|
+
.smwb-sheet_resizable.smwb-right {
|
|
4998
|
+
padding-left: 20px;
|
|
4999
|
+
}
|
|
5000
|
+
.smwb-sheet.smwb-bottom .smwb-sheet__drag-handle,
|
|
5001
|
+
.smwb-sheet.smwb-top .smwb-sheet__drag-handle {
|
|
5002
|
+
left: 0;
|
|
5003
|
+
right: 0;
|
|
5004
|
+
height: 20px;
|
|
5005
|
+
cursor: ns-resize;
|
|
5006
|
+
}
|
|
5007
|
+
.smwb-sheet.smwb-bottom .smwb-sheet__drag-handle .smwb-sheet__drag-handle-bar,
|
|
5008
|
+
.smwb-sheet.smwb-top .smwb-sheet__drag-handle .smwb-sheet__drag-handle-bar {
|
|
5009
|
+
width: 36px;
|
|
5010
|
+
height: 4px;
|
|
5011
|
+
}
|
|
5012
|
+
.smwb-sheet.smwb-bottom .smwb-sheet__drag-handle {
|
|
5013
|
+
top: 0;
|
|
4207
5014
|
}
|
|
4208
5015
|
.smwb-sheet.smwb-top .smwb-sheet__drag-handle {
|
|
4209
5016
|
bottom: 0;
|
|
@@ -4626,6 +5433,13 @@
|
|
|
4626
5433
|
pointer-events: none;
|
|
4627
5434
|
opacity: 0.38;
|
|
4628
5435
|
}
|
|
5436
|
+
.smwb-card__content {
|
|
5437
|
+
display: flex;
|
|
5438
|
+
flex-direction: column;
|
|
5439
|
+
}
|
|
5440
|
+
.smwb-card__content:focus-visible {
|
|
5441
|
+
outline: none;
|
|
5442
|
+
}
|
|
4629
5443
|
.smwb-card__title {
|
|
4630
5444
|
font-size: 1.25rem;
|
|
4631
5445
|
font-weight: 500;
|
|
@@ -4636,7 +5450,7 @@
|
|
|
4636
5450
|
.smwb-card_interactive {
|
|
4637
5451
|
cursor: pointer;
|
|
4638
5452
|
}
|
|
4639
|
-
.smwb-
|
|
5453
|
+
.smwb-card:has( > .smwb-card__content:focus-visible) {
|
|
4640
5454
|
outline: 2px solid var(--smui-primaryColor);
|
|
4641
5455
|
outline-offset: 2px;
|
|
4642
5456
|
}
|
|
@@ -5804,6 +6618,14 @@
|
|
|
5804
6618
|
.smwb-table__cell.smwb-head-cell .smwb-head-cell__content input {
|
|
5805
6619
|
font-weight: 500;
|
|
5806
6620
|
}
|
|
6621
|
+
.smwb-table__cell.smwb-head-cell .smwb-head-cell__actions {
|
|
6622
|
+
align-items: center;
|
|
6623
|
+
display: inline-flex;
|
|
6624
|
+
vertical-align: middle;
|
|
6625
|
+
gap: 5px;
|
|
6626
|
+
margin-inline-start: 5px;
|
|
6627
|
+
cursor: auto;
|
|
6628
|
+
}
|
|
5807
6629
|
.smwb-table__cell.smwb-head-cell.smwb-align_left {
|
|
5808
6630
|
text-align: left;
|
|
5809
6631
|
}
|
|
@@ -6179,60 +7001,230 @@
|
|
|
6179
7001
|
min-width: 5px;
|
|
6180
7002
|
flex-shrink: 1;
|
|
6181
7003
|
}
|
|
6182
|
-
.smwb-
|
|
6183
|
-
|
|
6184
|
-
|
|
6185
|
-
|
|
6186
|
-
|
|
6187
|
-
|
|
6188
|
-
|
|
7004
|
+
.smwb-tab-groups {
|
|
7005
|
+
position: relative;
|
|
7006
|
+
display: grid;
|
|
7007
|
+
width: 100%;
|
|
7008
|
+
height: 100%;
|
|
7009
|
+
min-width: 0;
|
|
7010
|
+
min-height: 0;
|
|
6189
7011
|
overflow: hidden;
|
|
6190
|
-
|
|
7012
|
+
--smwb-tab-groups-separator-size: 4px;
|
|
6191
7013
|
}
|
|
6192
|
-
.smwb-
|
|
7014
|
+
.smwb-tab-groups__header {
|
|
6193
7015
|
display: flex;
|
|
6194
|
-
|
|
7016
|
+
align-items: stretch;
|
|
7017
|
+
box-sizing: border-box;
|
|
7018
|
+
min-width: 0;
|
|
7019
|
+
border-bottom: 1px solid var(--smui-dividerColor);
|
|
6195
7020
|
}
|
|
6196
|
-
.smwb-
|
|
6197
|
-
|
|
6198
|
-
justify-content: space-between;
|
|
6199
|
-
padding: 15px 12px;
|
|
7021
|
+
.smwb-tab-groups--split .smwb-tab-groups__header--active {
|
|
7022
|
+
box-shadow: inset 0 2px 0 0 var(--smui-primaryColor);
|
|
6200
7023
|
}
|
|
6201
|
-
.smwb-
|
|
6202
|
-
|
|
6203
|
-
|
|
7024
|
+
.smwb-tab-groups__tabs {
|
|
7025
|
+
flex: 1 1 auto;
|
|
7026
|
+
min-width: 0;
|
|
6204
7027
|
}
|
|
6205
|
-
.smwb-
|
|
6206
|
-
display: flex;
|
|
7028
|
+
.smwb-tab-groups__actions-trigger {
|
|
7029
|
+
display: inline-flex;
|
|
6207
7030
|
align-items: center;
|
|
6208
7031
|
justify-content: center;
|
|
6209
|
-
|
|
6210
|
-
|
|
7032
|
+
flex: 0 0 auto;
|
|
7033
|
+
width: 40px;
|
|
7034
|
+
padding: 0;
|
|
7035
|
+
border: none;
|
|
7036
|
+
background: none;
|
|
7037
|
+
color: var(--smui-onSurfaceVariant);
|
|
6211
7038
|
cursor: pointer;
|
|
6212
|
-
transition: color 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
|
|
6213
7039
|
}
|
|
6214
|
-
.smwb-
|
|
6215
|
-
|
|
6216
|
-
opacity: 1;
|
|
6217
|
-
transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms, transform 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
|
|
7040
|
+
.smwb-tab-groups__actions-trigger:hover:not(:disabled) {
|
|
7041
|
+
background-color: var(--smui-onSurfaceHover);
|
|
6218
7042
|
}
|
|
6219
|
-
.smwb-
|
|
6220
|
-
|
|
6221
|
-
|
|
6222
|
-
pointer-events: none;
|
|
7043
|
+
.smwb-tab-groups__actions-trigger:focus-visible {
|
|
7044
|
+
outline: 2px solid var(--smui-primaryColor);
|
|
7045
|
+
outline-offset: -2px;
|
|
6223
7046
|
}
|
|
6224
|
-
.smwb-
|
|
6225
|
-
opacity: 0;
|
|
6226
|
-
|
|
6227
|
-
transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms, visibility 0ms cubic-bezier(0.4, 0, 0.2, 1) 200ms;
|
|
7047
|
+
.smwb-tab-groups__actions-trigger:disabled {
|
|
7048
|
+
opacity: 0.38;
|
|
7049
|
+
cursor: default;
|
|
6228
7050
|
}
|
|
6229
|
-
.smwb-
|
|
6230
|
-
|
|
7051
|
+
.smwb-tab-groups__panel {
|
|
7052
|
+
position: relative;
|
|
7053
|
+
min-width: 0;
|
|
7054
|
+
min-height: 0;
|
|
7055
|
+
overflow: auto;
|
|
6231
7056
|
}
|
|
6232
|
-
.smwb-
|
|
6233
|
-
|
|
6234
|
-
|
|
6235
|
-
|
|
7057
|
+
.smwb-tab-groups__separator {
|
|
7058
|
+
position: relative;
|
|
7059
|
+
z-index: 1;
|
|
7060
|
+
box-sizing: border-box;
|
|
7061
|
+
background: var(--smui-primaryContainer);
|
|
7062
|
+
touch-action: none;
|
|
7063
|
+
user-select: none;
|
|
7064
|
+
}
|
|
7065
|
+
.smwb-tab-groups__separator::before {
|
|
7066
|
+
content: "";
|
|
7067
|
+
position: absolute;
|
|
7068
|
+
z-index: 1;
|
|
7069
|
+
}
|
|
7070
|
+
.smwb-tab-groups__separator--vertical {
|
|
7071
|
+
border-left: thin solid var(--smui-primaryColor);
|
|
7072
|
+
border-right: thin solid var(--smui-primaryColor);
|
|
7073
|
+
cursor: col-resize;
|
|
7074
|
+
}
|
|
7075
|
+
.smwb-tab-groups__separator--vertical::before {
|
|
7076
|
+
top: 0;
|
|
7077
|
+
bottom: 0;
|
|
7078
|
+
left: 50%;
|
|
7079
|
+
width: 8px;
|
|
7080
|
+
transform: translateX(-50%);
|
|
7081
|
+
}
|
|
7082
|
+
.smwb-tab-groups__separator--horizontal {
|
|
7083
|
+
border-top: thin solid var(--smui-primaryColor);
|
|
7084
|
+
border-bottom: thin solid var(--smui-primaryColor);
|
|
7085
|
+
cursor: row-resize;
|
|
7086
|
+
}
|
|
7087
|
+
.smwb-tab-groups__separator--horizontal::before {
|
|
7088
|
+
top: 50%;
|
|
7089
|
+
right: 0;
|
|
7090
|
+
left: 0;
|
|
7091
|
+
height: 8px;
|
|
7092
|
+
transform: translateY(-50%);
|
|
7093
|
+
}
|
|
7094
|
+
.smwb-tab-groups__separator:hover,
|
|
7095
|
+
.smwb-tab-groups__separator--dragging {
|
|
7096
|
+
background: var(--smui-primaryColor);
|
|
7097
|
+
}
|
|
7098
|
+
.smwb-tab-groups__separator:focus-visible {
|
|
7099
|
+
outline: 2px solid var(--smui-primaryColor);
|
|
7100
|
+
outline-offset: -2px;
|
|
7101
|
+
}
|
|
7102
|
+
.smwb-tab-groups__drop-target {
|
|
7103
|
+
position: relative;
|
|
7104
|
+
z-index: 2;
|
|
7105
|
+
}
|
|
7106
|
+
.smwb-tab-groups__drop-target::before {
|
|
7107
|
+
content: "";
|
|
7108
|
+
position: absolute;
|
|
7109
|
+
background: color-mix(in srgb, var(--smui-primaryColor) 16%, transparent);
|
|
7110
|
+
outline: 2px solid var(--smui-primaryColor);
|
|
7111
|
+
outline-offset: -2px;
|
|
7112
|
+
}
|
|
7113
|
+
.smwb-tab-groups__drop-target--center::before {
|
|
7114
|
+
inset: 0;
|
|
7115
|
+
}
|
|
7116
|
+
.smwb-tab-groups__drop-target--top::before {
|
|
7117
|
+
top: 0;
|
|
7118
|
+
right: 0;
|
|
7119
|
+
left: 0;
|
|
7120
|
+
height: 50%;
|
|
7121
|
+
}
|
|
7122
|
+
.smwb-tab-groups__drop-target--right::before {
|
|
7123
|
+
top: 0;
|
|
7124
|
+
right: 0;
|
|
7125
|
+
bottom: 0;
|
|
7126
|
+
width: 50%;
|
|
7127
|
+
}
|
|
7128
|
+
.smwb-tab-groups__drop-target--bottom::before {
|
|
7129
|
+
right: 0;
|
|
7130
|
+
bottom: 0;
|
|
7131
|
+
left: 0;
|
|
7132
|
+
height: 50%;
|
|
7133
|
+
}
|
|
7134
|
+
.smwb-tab-groups__drop-target--left::before {
|
|
7135
|
+
top: 0;
|
|
7136
|
+
bottom: 0;
|
|
7137
|
+
left: 0;
|
|
7138
|
+
width: 50%;
|
|
7139
|
+
}
|
|
7140
|
+
.smwb-tab-groups__empty {
|
|
7141
|
+
display: flex;
|
|
7142
|
+
align-items: center;
|
|
7143
|
+
justify-content: center;
|
|
7144
|
+
grid-area: 1 / 1 / -1 / -1;
|
|
7145
|
+
min-width: 0;
|
|
7146
|
+
min-height: 0;
|
|
7147
|
+
}
|
|
7148
|
+
.smwb-tab-groups__panel-end {
|
|
7149
|
+
position: absolute;
|
|
7150
|
+
width: 0;
|
|
7151
|
+
height: 0;
|
|
7152
|
+
overflow: hidden;
|
|
7153
|
+
outline: none;
|
|
7154
|
+
}
|
|
7155
|
+
.smwb-tab-groups__focus-guard {
|
|
7156
|
+
position: absolute;
|
|
7157
|
+
width: 1px;
|
|
7158
|
+
height: 1px;
|
|
7159
|
+
overflow: hidden;
|
|
7160
|
+
clip: rect(0 0 0 0);
|
|
7161
|
+
outline: none;
|
|
7162
|
+
}
|
|
7163
|
+
.smwb-tab-groups__status {
|
|
7164
|
+
position: absolute;
|
|
7165
|
+
width: 1px;
|
|
7166
|
+
height: 1px;
|
|
7167
|
+
margin: -1px;
|
|
7168
|
+
padding: 0;
|
|
7169
|
+
overflow: hidden;
|
|
7170
|
+
clip: rect(0 0 0 0);
|
|
7171
|
+
white-space: nowrap;
|
|
7172
|
+
border: 0;
|
|
7173
|
+
}
|
|
7174
|
+
.smwb-date-picker {
|
|
7175
|
+
border-radius: 4px;
|
|
7176
|
+
background-color: var(--smui-surfaceBackground);
|
|
7177
|
+
box-shadow: rgba(0, 0, 0, 0.2) 0 5px 5px -3px, rgba(0, 0, 0, 0.14) 0px 8px 10px 1px, rgba(0, 0, 0, 0.12) 0 3px 14px 2px;
|
|
7178
|
+
width: 328px;
|
|
7179
|
+
max-height: 428px;
|
|
7180
|
+
color: var(--smui-primaryTextColor);
|
|
7181
|
+
overflow: hidden;
|
|
7182
|
+
z-index: 1300;
|
|
7183
|
+
}
|
|
7184
|
+
.smwb-date-picker__inner {
|
|
7185
|
+
display: flex;
|
|
7186
|
+
flex-direction: column;
|
|
7187
|
+
}
|
|
7188
|
+
.smwb-date-picker__header {
|
|
7189
|
+
display: flex;
|
|
7190
|
+
justify-content: space-between;
|
|
7191
|
+
padding: 15px 12px;
|
|
7192
|
+
}
|
|
7193
|
+
.smwb-date-picker__action {
|
|
7194
|
+
display: flex;
|
|
7195
|
+
align-items: center;
|
|
7196
|
+
}
|
|
7197
|
+
.smwb-date-picker__action-label {
|
|
7198
|
+
display: flex;
|
|
7199
|
+
align-items: center;
|
|
7200
|
+
justify-content: center;
|
|
7201
|
+
min-width: 80px;
|
|
7202
|
+
user-select: none;
|
|
7203
|
+
cursor: pointer;
|
|
7204
|
+
transition: color 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
|
|
7205
|
+
}
|
|
7206
|
+
.smwb-date-picker__action-label > .smwb-icon__wrapper {
|
|
7207
|
+
margin-right: -4px;
|
|
7208
|
+
opacity: 1;
|
|
7209
|
+
transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms, transform 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
|
|
7210
|
+
}
|
|
7211
|
+
.smwb-date-picker__action-label--disabled {
|
|
7212
|
+
color: var(--smui-disabledTextColor);
|
|
7213
|
+
cursor: default;
|
|
7214
|
+
pointer-events: none;
|
|
7215
|
+
}
|
|
7216
|
+
.smwb-date-picker__action-label--disabled > .smwb-icon__wrapper {
|
|
7217
|
+
opacity: 0;
|
|
7218
|
+
visibility: hidden;
|
|
7219
|
+
transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms, visibility 0ms cubic-bezier(0.4, 0, 0.2, 1) 200ms;
|
|
7220
|
+
}
|
|
7221
|
+
.smwb-date-picker__action-label--active > .smwb-icon__wrapper {
|
|
7222
|
+
transform: rotate(180deg);
|
|
7223
|
+
}
|
|
7224
|
+
.smwb-date-picker__action-text {
|
|
7225
|
+
font-size: 14px;
|
|
7226
|
+
line-height: 19px;
|
|
7227
|
+
font-weight: 500;
|
|
6236
7228
|
margin-right: 10px;
|
|
6237
7229
|
text-transform: capitalize;
|
|
6238
7230
|
}
|
|
@@ -6483,15 +7475,45 @@
|
|
|
6483
7475
|
.smwb-tree__node__label > .smwb-icon__wrapper {
|
|
6484
7476
|
flex: none;
|
|
6485
7477
|
}
|
|
6486
|
-
.smwb-
|
|
7478
|
+
.smwb-tree__node__row {
|
|
6487
7479
|
display: flex;
|
|
6488
7480
|
align-items: center;
|
|
6489
7481
|
gap: 10px;
|
|
6490
7482
|
min-height: 40px;
|
|
7483
|
+
}
|
|
7484
|
+
.smwb-tree__node__toggle {
|
|
7485
|
+
display: inline-flex;
|
|
7486
|
+
flex: none;
|
|
7487
|
+
align-items: center;
|
|
7488
|
+
justify-content: center;
|
|
7489
|
+
width: 24px;
|
|
7490
|
+
cursor: pointer;
|
|
7491
|
+
user-select: none;
|
|
7492
|
+
}
|
|
7493
|
+
.smwb-tree__node__toggle:empty {
|
|
7494
|
+
cursor: default;
|
|
7495
|
+
}
|
|
7496
|
+
.smwb-tree__node__content {
|
|
7497
|
+
display: flex;
|
|
7498
|
+
align-items: center;
|
|
7499
|
+
flex: 1 1 auto;
|
|
7500
|
+
min-width: 0;
|
|
7501
|
+
align-self: stretch;
|
|
6491
7502
|
cursor: pointer;
|
|
6492
7503
|
user-select: none;
|
|
7504
|
+
border-radius: 4px;
|
|
7505
|
+
}
|
|
7506
|
+
.smwb-tree__node__content:focus-visible {
|
|
7507
|
+
outline: 2px solid var(--smui-primaryColor);
|
|
7508
|
+
outline-offset: -2px;
|
|
7509
|
+
}
|
|
7510
|
+
.smwb-tree__node__actions {
|
|
7511
|
+
display: inline-flex;
|
|
7512
|
+
flex: none;
|
|
7513
|
+
align-items: center;
|
|
7514
|
+
gap: 4px;
|
|
6493
7515
|
}
|
|
6494
|
-
.smwb-tree__node_selected > .smwb-
|
|
7516
|
+
.smwb-tree__node_selected > .smwb-tree__node__row {
|
|
6495
7517
|
background-color: var(--smui-onSurfaceHover);
|
|
6496
7518
|
border-radius: 4px;
|
|
6497
7519
|
}
|
|
@@ -6851,10 +7873,51 @@
|
|
|
6851
7873
|
display: inline-flex;
|
|
6852
7874
|
flex-direction: row;
|
|
6853
7875
|
align-items: center;
|
|
7876
|
+
isolation: isolate;
|
|
6854
7877
|
}
|
|
6855
7878
|
.smwb-avatar-group > :not(:first-child) {
|
|
6856
7879
|
margin-left: -8px;
|
|
6857
7880
|
}
|
|
7881
|
+
.smwb-avatar-group > :nth-child(1) {
|
|
7882
|
+
z-index: 12;
|
|
7883
|
+
}
|
|
7884
|
+
.smwb-avatar-group > :nth-child(2) {
|
|
7885
|
+
z-index: 11;
|
|
7886
|
+
}
|
|
7887
|
+
.smwb-avatar-group > :nth-child(3) {
|
|
7888
|
+
z-index: 10;
|
|
7889
|
+
}
|
|
7890
|
+
.smwb-avatar-group > :nth-child(4) {
|
|
7891
|
+
z-index: 9;
|
|
7892
|
+
}
|
|
7893
|
+
.smwb-avatar-group > :nth-child(5) {
|
|
7894
|
+
z-index: 8;
|
|
7895
|
+
}
|
|
7896
|
+
.smwb-avatar-group > :nth-child(6) {
|
|
7897
|
+
z-index: 7;
|
|
7898
|
+
}
|
|
7899
|
+
.smwb-avatar-group > :nth-child(7) {
|
|
7900
|
+
z-index: 6;
|
|
7901
|
+
}
|
|
7902
|
+
.smwb-avatar-group > :nth-child(8) {
|
|
7903
|
+
z-index: 5;
|
|
7904
|
+
}
|
|
7905
|
+
.smwb-avatar-group > :nth-child(9) {
|
|
7906
|
+
z-index: 4;
|
|
7907
|
+
}
|
|
7908
|
+
.smwb-avatar-group > :nth-child(10) {
|
|
7909
|
+
z-index: 3;
|
|
7910
|
+
}
|
|
7911
|
+
.smwb-avatar-group > :nth-child(11) {
|
|
7912
|
+
z-index: 2;
|
|
7913
|
+
}
|
|
7914
|
+
.smwb-avatar-group > :nth-child(12) {
|
|
7915
|
+
z-index: 1;
|
|
7916
|
+
}
|
|
7917
|
+
.smwb-avatar-group > :focus-visible,
|
|
7918
|
+
.smwb-avatar-group > :has(:focus-visible) {
|
|
7919
|
+
z-index: 13;
|
|
7920
|
+
}
|
|
6858
7921
|
.smwb-avatar-group .smwb-avatar {
|
|
6859
7922
|
border: 2px solid var(--smui-surfaceBackground);
|
|
6860
7923
|
box-sizing: content-box;
|
|
@@ -6877,7 +7940,7 @@
|
|
|
6877
7940
|
color: inherit;
|
|
6878
7941
|
text-decoration: none;
|
|
6879
7942
|
}
|
|
6880
|
-
.smwb-person-chip__avatar {
|
|
7943
|
+
.smwb-avatar.smwb-person-chip__avatar {
|
|
6881
7944
|
flex-shrink: 0;
|
|
6882
7945
|
color: #fff;
|
|
6883
7946
|
}
|
|
@@ -7126,14 +8189,23 @@
|
|
|
7126
8189
|
}
|
|
7127
8190
|
.smwb-rating {
|
|
7128
8191
|
display: inline-flex;
|
|
7129
|
-
|
|
7130
|
-
|
|
8192
|
+
flex-direction: column;
|
|
8193
|
+
align-items: flex-start;
|
|
7131
8194
|
color: var(--smui-primaryColor);
|
|
7132
8195
|
}
|
|
7133
8196
|
.smwb-rating_disabled {
|
|
7134
8197
|
opacity: 0.38;
|
|
7135
8198
|
pointer-events: none;
|
|
7136
8199
|
}
|
|
8200
|
+
.smwb-rating__control {
|
|
8201
|
+
display: inline-flex;
|
|
8202
|
+
align-items: center;
|
|
8203
|
+
gap: 2px;
|
|
8204
|
+
}
|
|
8205
|
+
.smwb-rating__control:focus-visible {
|
|
8206
|
+
outline: 2px solid var(--smui-primaryColor);
|
|
8207
|
+
outline-offset: 2px;
|
|
8208
|
+
}
|
|
7137
8209
|
.smwb-rating__item {
|
|
7138
8210
|
position: relative;
|
|
7139
8211
|
display: inline-flex;
|
|
@@ -7280,43 +8352,567 @@
|
|
|
7280
8352
|
--smwb-chart-series-6: #f27c3c;
|
|
7281
8353
|
--smwb-chart-series-7: #a8b0bc;
|
|
7282
8354
|
}
|
|
7283
|
-
.smwb-
|
|
7284
|
-
|
|
8355
|
+
.smwb-dag-view {
|
|
8356
|
+
--smwb-dag-view-node-bg: var(--smui-surfaceBackground);
|
|
8357
|
+
--smwb-dag-view-node-border: var(--smui-outlineColor);
|
|
8358
|
+
--smwb-dag-view-edge-color: var(--smui-outlineColor);
|
|
8359
|
+
--smwb-dag-view-edge-active-color: var(--smui-primaryColor);
|
|
8360
|
+
--smwb-dag-view-selected-ring: var(--smui-primaryColor);
|
|
8361
|
+
--smwb-dag-view-status-idle: var(--smui-outlineColor);
|
|
8362
|
+
--smwb-dag-view-status-pending: var(--smui-onSurfaceVariant);
|
|
8363
|
+
--smwb-dag-view-status-running: var(--smui-infoColor);
|
|
8364
|
+
--smwb-dag-view-status-success: var(--smui-successColor);
|
|
8365
|
+
--smwb-dag-view-status-warning: var(--smui-warningColor);
|
|
8366
|
+
--smwb-dag-view-status-error: var(--smui-errorColor);
|
|
8367
|
+
--smwb-dag-view-status-skipped: var(--smui-disabledTextColor);
|
|
8368
|
+
--smwb-dag-view-dim-opacity: 0.35;
|
|
8369
|
+
position: relative;
|
|
7285
8370
|
width: 100%;
|
|
8371
|
+
height: 480px;
|
|
8372
|
+
min-width: 0;
|
|
8373
|
+
box-sizing: border-box;
|
|
8374
|
+
overflow: hidden;
|
|
8375
|
+
overflow: clip;
|
|
8376
|
+
border: 1px solid var(--smui-dividerColor);
|
|
8377
|
+
border-radius: 12px;
|
|
8378
|
+
background-color: color-mix(in srgb, var(--smui-onSurfaceColor) 2%, var(--smui-surfaceBackground));
|
|
8379
|
+
color: var(--smui-onSurfaceColor);
|
|
8380
|
+
touch-action: none;
|
|
8381
|
+
overscroll-behavior: contain;
|
|
8382
|
+
user-select: none;
|
|
8383
|
+
-webkit-user-select: none;
|
|
8384
|
+
cursor: grab;
|
|
7286
8385
|
}
|
|
7287
|
-
.smwb-
|
|
7288
|
-
|
|
7289
|
-
align-items: center;
|
|
8386
|
+
.smwb-dag-view[data-interacting] {
|
|
8387
|
+
cursor: grabbing;
|
|
7290
8388
|
}
|
|
7291
|
-
.smwb-
|
|
7292
|
-
|
|
7293
|
-
|
|
8389
|
+
.smwb-dag-view__world {
|
|
8390
|
+
position: absolute;
|
|
8391
|
+
top: 0;
|
|
8392
|
+
left: 0;
|
|
8393
|
+
transform-origin: 0 0;
|
|
7294
8394
|
}
|
|
7295
|
-
.smwb-
|
|
7296
|
-
|
|
7297
|
-
flex: 0 0 auto;
|
|
7298
|
-
align-items: flex-start;
|
|
7299
|
-
gap: 8px;
|
|
7300
|
-
min-width: 0;
|
|
7301
|
-
text-align: start;
|
|
8395
|
+
.smwb-dag-view[data-interacting] .smwb-dag-view__world {
|
|
8396
|
+
will-change: transform;
|
|
7302
8397
|
}
|
|
7303
|
-
.smwb-
|
|
7304
|
-
|
|
8398
|
+
.smwb-dag-view__edges {
|
|
8399
|
+
position: absolute;
|
|
8400
|
+
top: 0;
|
|
8401
|
+
left: 0;
|
|
8402
|
+
overflow: visible;
|
|
8403
|
+
pointer-events: none;
|
|
7305
8404
|
}
|
|
7306
|
-
.smwb-
|
|
7307
|
-
|
|
7308
|
-
|
|
7309
|
-
|
|
7310
|
-
|
|
7311
|
-
margin: 4px 0 4px 12px;
|
|
7312
|
-
background-color: var(--smui-dividerColor);
|
|
7313
|
-
flex: 0 0 auto;
|
|
8405
|
+
.smwb-dag-view__edge {
|
|
8406
|
+
fill: none;
|
|
8407
|
+
stroke: var(--smwb-dag-view-edge-color);
|
|
8408
|
+
stroke-width: 1.5px;
|
|
8409
|
+
transition: stroke 0.12s, opacity 0.12s;
|
|
7314
8410
|
}
|
|
7315
|
-
.smwb-
|
|
8411
|
+
.smwb-dag-view__edge--active {
|
|
8412
|
+
stroke: var(--smwb-dag-view-edge-active-color);
|
|
8413
|
+
stroke-width: 2.5px;
|
|
8414
|
+
}
|
|
8415
|
+
.smwb-dag-view__edge--reversed {
|
|
8416
|
+
stroke-dasharray: 6 4;
|
|
8417
|
+
}
|
|
8418
|
+
.smwb-dag-view__edge--dimmed {
|
|
8419
|
+
opacity: var(--smwb-dag-view-dim-opacity);
|
|
8420
|
+
}
|
|
8421
|
+
.smwb-dag-view__arrow {
|
|
8422
|
+
fill: var(--smwb-dag-view-edge-color);
|
|
8423
|
+
}
|
|
8424
|
+
.smwb-dag-view__arrow--active {
|
|
8425
|
+
fill: var(--smwb-dag-view-edge-active-color);
|
|
8426
|
+
}
|
|
8427
|
+
.smwb-dag-view__node {
|
|
8428
|
+
--smwb-dag-view-accent: var(--smwb-dag-view-node-accent, var(--smwb-dag-view-status-idle));
|
|
8429
|
+
position: absolute;
|
|
8430
|
+
box-sizing: border-box;
|
|
7316
8431
|
display: flex;
|
|
7317
8432
|
align-items: center;
|
|
7318
8433
|
gap: 8px;
|
|
7319
|
-
|
|
8434
|
+
padding: 0 12px 0 10px;
|
|
8435
|
+
border: 1px solid var(--smwb-dag-view-node-border);
|
|
8436
|
+
border-left: 4px solid var(--smwb-dag-view-accent);
|
|
8437
|
+
border-radius: 8px;
|
|
8438
|
+
background-color: var(--smwb-dag-view-node-bg);
|
|
8439
|
+
color: var(--smui-onSurfaceColor);
|
|
8440
|
+
font-size: 0.875rem;
|
|
8441
|
+
line-height: 1.3;
|
|
8442
|
+
overflow: hidden;
|
|
8443
|
+
contain: layout paint;
|
|
8444
|
+
cursor: pointer;
|
|
8445
|
+
transition: box-shadow 0.12s, border-color 0.12s, opacity 0.12s;
|
|
8446
|
+
}
|
|
8447
|
+
.smwb-dag-view__node[data-status="pending"] {
|
|
8448
|
+
--smwb-dag-view-accent: var(--smwb-dag-view-node-accent, var(--smwb-dag-view-status-pending));
|
|
8449
|
+
}
|
|
8450
|
+
.smwb-dag-view__node[data-status="running"] {
|
|
8451
|
+
--smwb-dag-view-accent: var(--smwb-dag-view-node-accent, var(--smwb-dag-view-status-running));
|
|
8452
|
+
}
|
|
8453
|
+
.smwb-dag-view__node[data-status="success"] {
|
|
8454
|
+
--smwb-dag-view-accent: var(--smwb-dag-view-node-accent, var(--smwb-dag-view-status-success));
|
|
8455
|
+
}
|
|
8456
|
+
.smwb-dag-view__node[data-status="warning"] {
|
|
8457
|
+
--smwb-dag-view-accent: var(--smwb-dag-view-node-accent, var(--smwb-dag-view-status-warning));
|
|
8458
|
+
}
|
|
8459
|
+
.smwb-dag-view__node[data-status="error"] {
|
|
8460
|
+
--smwb-dag-view-accent: var(--smwb-dag-view-node-accent, var(--smwb-dag-view-status-error));
|
|
8461
|
+
}
|
|
8462
|
+
.smwb-dag-view__node[data-status="skipped"] {
|
|
8463
|
+
--smwb-dag-view-accent: var(--smwb-dag-view-node-accent, var(--smwb-dag-view-status-skipped));
|
|
8464
|
+
}
|
|
8465
|
+
.smwb-dag-view__node:hover {
|
|
8466
|
+
border-color: color-mix(in srgb, var(--smwb-dag-view-edge-active-color) 45%, var(--smwb-dag-view-node-border));
|
|
8467
|
+
border-left-color: var(--smwb-dag-view-accent);
|
|
8468
|
+
}
|
|
8469
|
+
.smwb-dag-view__node:focus-visible {
|
|
8470
|
+
outline: 2px solid var(--smui-primaryColor);
|
|
8471
|
+
outline-offset: 2px;
|
|
8472
|
+
}
|
|
8473
|
+
.smwb-dag-view__node--selected {
|
|
8474
|
+
box-shadow: 0 0 0 2px var(--smwb-dag-view-selected-ring);
|
|
8475
|
+
}
|
|
8476
|
+
.smwb-dag-view__node--upstream,
|
|
8477
|
+
.smwb-dag-view__node--downstream {
|
|
8478
|
+
border-color: var(--smwb-dag-view-edge-active-color);
|
|
8479
|
+
border-left-color: var(--smwb-dag-view-accent);
|
|
8480
|
+
}
|
|
8481
|
+
.smwb-dag-view__node--dimmed {
|
|
8482
|
+
opacity: var(--smwb-dag-view-dim-opacity);
|
|
8483
|
+
}
|
|
8484
|
+
.smwb-dag-view__node--disabled {
|
|
8485
|
+
cursor: default;
|
|
8486
|
+
color: var(--smui-disabledTextColor);
|
|
8487
|
+
}
|
|
8488
|
+
.smwb-dag-view__dot {
|
|
8489
|
+
flex-shrink: 0;
|
|
8490
|
+
width: 8px;
|
|
8491
|
+
height: 8px;
|
|
8492
|
+
border-radius: 50%;
|
|
8493
|
+
background-color: var(--smwb-dag-view-accent);
|
|
8494
|
+
}
|
|
8495
|
+
.smwb-dag-view__label {
|
|
8496
|
+
flex: 1 1 auto;
|
|
8497
|
+
min-width: 0;
|
|
8498
|
+
overflow: hidden;
|
|
8499
|
+
font-weight: 500;
|
|
8500
|
+
text-overflow: ellipsis;
|
|
8501
|
+
white-space: nowrap;
|
|
8502
|
+
}
|
|
8503
|
+
.smwb-dag-view__status {
|
|
8504
|
+
flex-shrink: 0;
|
|
8505
|
+
font-size: 0.75rem;
|
|
8506
|
+
color: var(--smui-onSurfaceVariant);
|
|
8507
|
+
}
|
|
8508
|
+
.smwb-dag-view[data-zoom="far"] .smwb-dag-view__status,
|
|
8509
|
+
.smwb-dag-view[data-zoom="far"] .smwb-dag-view__detail {
|
|
8510
|
+
display: none;
|
|
8511
|
+
}
|
|
8512
|
+
.smwb-dag-view__summary {
|
|
8513
|
+
position: absolute;
|
|
8514
|
+
width: 1px;
|
|
8515
|
+
height: 1px;
|
|
8516
|
+
margin: -1px;
|
|
8517
|
+
padding: 0;
|
|
8518
|
+
overflow: hidden;
|
|
8519
|
+
clip: rect(0 0 0 0);
|
|
8520
|
+
white-space: nowrap;
|
|
8521
|
+
border: 0;
|
|
8522
|
+
}
|
|
8523
|
+
.smwb-dag-view__controls {
|
|
8524
|
+
position: absolute;
|
|
8525
|
+
right: 8px;
|
|
8526
|
+
bottom: 8px;
|
|
8527
|
+
display: flex;
|
|
8528
|
+
flex-direction: column;
|
|
8529
|
+
gap: 4px;
|
|
8530
|
+
cursor: default;
|
|
8531
|
+
}
|
|
8532
|
+
.smwb-dag-view__control {
|
|
8533
|
+
display: inline-flex;
|
|
8534
|
+
align-items: center;
|
|
8535
|
+
justify-content: center;
|
|
8536
|
+
width: 32px;
|
|
8537
|
+
height: 32px;
|
|
8538
|
+
padding: 0;
|
|
8539
|
+
border: 1px solid var(--smui-dividerColor);
|
|
8540
|
+
border-radius: 8px;
|
|
8541
|
+
background-color: var(--smui-surfaceBackground);
|
|
8542
|
+
color: var(--smui-onSurfaceVariant);
|
|
8543
|
+
cursor: pointer;
|
|
8544
|
+
}
|
|
8545
|
+
.smwb-dag-view__control svg {
|
|
8546
|
+
width: 18px;
|
|
8547
|
+
height: 18px;
|
|
8548
|
+
fill: none;
|
|
8549
|
+
stroke: currentColor;
|
|
8550
|
+
stroke-width: 2;
|
|
8551
|
+
stroke-linecap: round;
|
|
8552
|
+
stroke-linejoin: round;
|
|
8553
|
+
}
|
|
8554
|
+
.smwb-dag-view__control:hover {
|
|
8555
|
+
background-color: color-mix(in srgb, var(--smui-onSurfaceColor) 8%, var(--smui-surfaceBackground));
|
|
8556
|
+
color: var(--smui-onSurfaceColor);
|
|
8557
|
+
}
|
|
8558
|
+
.smwb-dag-view__control:focus-visible {
|
|
8559
|
+
outline: 2px solid var(--smui-primaryColor);
|
|
8560
|
+
outline-offset: 2px;
|
|
8561
|
+
}
|
|
8562
|
+
@media (prefers-reduced-motion: no-preference) {
|
|
8563
|
+
.smwb-dag-view__node[data-status="running"] .smwb-dag-view__dot {
|
|
8564
|
+
animation: smwb-dag-view-pulse 1.4s ease-in-out infinite;
|
|
8565
|
+
}
|
|
8566
|
+
}
|
|
8567
|
+
@keyframes smwb-dag-view-pulse {
|
|
8568
|
+
50% {
|
|
8569
|
+
opacity: 0.35;
|
|
8570
|
+
}
|
|
8571
|
+
}
|
|
8572
|
+
.smwb-swimlanes {
|
|
8573
|
+
position: relative;
|
|
8574
|
+
box-sizing: border-box;
|
|
8575
|
+
width: 100%;
|
|
8576
|
+
height: 480px;
|
|
8577
|
+
min-width: 0;
|
|
8578
|
+
overflow: auto;
|
|
8579
|
+
overscroll-behavior: contain;
|
|
8580
|
+
border: 1px solid var(--smui-dividerColor);
|
|
8581
|
+
border-radius: 12px;
|
|
8582
|
+
background-color: var(--smui-surfaceBackground);
|
|
8583
|
+
color: var(--smui-onSurfaceColor);
|
|
8584
|
+
}
|
|
8585
|
+
.smwb-swimlanes_empty {
|
|
8586
|
+
display: grid;
|
|
8587
|
+
place-items: center;
|
|
8588
|
+
}
|
|
8589
|
+
.smwb-swimlanes__empty {
|
|
8590
|
+
padding: 32px 16px;
|
|
8591
|
+
color: var(--smui-onSurfaceVariant);
|
|
8592
|
+
text-align: center;
|
|
8593
|
+
}
|
|
8594
|
+
.smwb-swimlanes__sizer {
|
|
8595
|
+
position: relative;
|
|
8596
|
+
min-width: calc(var(--smwb-swimlanes-header-width, 240px) + var(--smwb-swimlanes-content-min-width, 0px));
|
|
8597
|
+
}
|
|
8598
|
+
.smwb-swimlanes__row {
|
|
8599
|
+
--smwb-swimlanes-tint: transparent;
|
|
8600
|
+
position: absolute;
|
|
8601
|
+
right: 0;
|
|
8602
|
+
left: 0;
|
|
8603
|
+
display: grid;
|
|
8604
|
+
grid-template-columns: var(--smwb-swimlanes-header-width, 240px) minmax(0, 1fr);
|
|
8605
|
+
box-sizing: border-box;
|
|
8606
|
+
height: var(--smwb-swimlanes-row-height);
|
|
8607
|
+
border-bottom: 1px solid var(--smui-dividerColor);
|
|
8608
|
+
}
|
|
8609
|
+
.smwb-swimlanes__row:where(:hover) {
|
|
8610
|
+
--smwb-swimlanes-tint: var(--smui-onSurfaceHover);
|
|
8611
|
+
}
|
|
8612
|
+
.smwb-swimlanes__row_selected {
|
|
8613
|
+
--smwb-swimlanes-tint: color-mix(in srgb, var(--smui-primaryColor) 12%, transparent);
|
|
8614
|
+
}
|
|
8615
|
+
.smwb-swimlanes__row_disabled {
|
|
8616
|
+
--smwb-swimlanes-tint: transparent;
|
|
8617
|
+
color: var(--smui-disabledTextColor);
|
|
8618
|
+
}
|
|
8619
|
+
.smwb-swimlanes__header,
|
|
8620
|
+
.smwb-swimlanes__content {
|
|
8621
|
+
display: flex;
|
|
8622
|
+
align-items: center;
|
|
8623
|
+
min-width: 0;
|
|
8624
|
+
padding: 8px 12px;
|
|
8625
|
+
overflow: hidden;
|
|
8626
|
+
}
|
|
8627
|
+
.smwb-swimlanes__header {
|
|
8628
|
+
position: sticky;
|
|
8629
|
+
inset-inline-start: 0;
|
|
8630
|
+
z-index: 1;
|
|
8631
|
+
background: linear-gradient(var(--smwb-swimlanes-tint), var(--smwb-swimlanes-tint)), var(--smui-surfaceBackground);
|
|
8632
|
+
box-shadow: inset -1px 0 0 var(--smui-dividerColor);
|
|
8633
|
+
}
|
|
8634
|
+
.smwb-swimlanes__row_selected .smwb-swimlanes__header {
|
|
8635
|
+
box-shadow: inset 3px 0 0 var(--smui-primaryColor), inset -1px 0 0 var(--smui-dividerColor);
|
|
8636
|
+
}
|
|
8637
|
+
.smwb-swimlanes__content {
|
|
8638
|
+
background-color: var(--smwb-swimlanes-tint);
|
|
8639
|
+
}
|
|
8640
|
+
.smwb-swimlanes__header:focus-visible,
|
|
8641
|
+
.smwb-swimlanes__content:focus-visible {
|
|
8642
|
+
outline: 2px solid var(--smui-primaryColor);
|
|
8643
|
+
outline-offset: -2px;
|
|
8644
|
+
}
|
|
8645
|
+
@media (forced-colors: active) {
|
|
8646
|
+
.smwb-swimlanes__header {
|
|
8647
|
+
background: Canvas;
|
|
8648
|
+
}
|
|
8649
|
+
.smwb-swimlanes__row_selected .smwb-swimlanes__header:not(:focus-visible),
|
|
8650
|
+
.smwb-swimlanes__row_selected .smwb-swimlanes__content:not(:focus-visible) {
|
|
8651
|
+
outline: 2px solid Highlight;
|
|
8652
|
+
outline-offset: -2px;
|
|
8653
|
+
}
|
|
8654
|
+
}
|
|
8655
|
+
.smwb-composer {
|
|
8656
|
+
position: relative;
|
|
8657
|
+
display: grid;
|
|
8658
|
+
grid-template-columns: auto minmax(0, 1fr) auto auto;
|
|
8659
|
+
align-items: center;
|
|
8660
|
+
box-sizing: border-box;
|
|
8661
|
+
width: 100%;
|
|
8662
|
+
min-width: 0;
|
|
8663
|
+
padding: 8px;
|
|
8664
|
+
border: 1px solid var(--smui-outlineColor);
|
|
8665
|
+
border-radius: 12px;
|
|
8666
|
+
background-color: var(--smui-surfaceBackground);
|
|
8667
|
+
color: var(--smui-onSurfaceColor);
|
|
8668
|
+
}
|
|
8669
|
+
.smwb-composer__attachments {
|
|
8670
|
+
grid-area: attachments;
|
|
8671
|
+
min-width: 0;
|
|
8672
|
+
margin-bottom: 4px;
|
|
8673
|
+
}
|
|
8674
|
+
.smwb-composer__field {
|
|
8675
|
+
grid-area: field;
|
|
8676
|
+
display: grid;
|
|
8677
|
+
min-width: 0;
|
|
8678
|
+
}
|
|
8679
|
+
.smwb-composer__field::after {
|
|
8680
|
+
box-sizing: border-box;
|
|
8681
|
+
margin: 0;
|
|
8682
|
+
border: 0;
|
|
8683
|
+
padding: 6px 8px;
|
|
8684
|
+
font: inherit;
|
|
8685
|
+
letter-spacing: inherit;
|
|
8686
|
+
line-height: 1.5rem;
|
|
8687
|
+
overflow-wrap: anywhere;
|
|
8688
|
+
min-height: calc(var(--smwb-composer-min-rows, 1) * 1.5rem + 2 * 6px);
|
|
8689
|
+
max-height: calc(var(--smwb-composer-max-rows, 8) * 1.5rem + 2 * 6px);
|
|
8690
|
+
content: attr(data-value) " ";
|
|
8691
|
+
grid-area: 1 / 1;
|
|
8692
|
+
visibility: hidden;
|
|
8693
|
+
pointer-events: none;
|
|
8694
|
+
white-space: pre-wrap;
|
|
8695
|
+
overflow: hidden;
|
|
8696
|
+
}
|
|
8697
|
+
.smwb-composer__input {
|
|
8698
|
+
box-sizing: border-box;
|
|
8699
|
+
margin: 0;
|
|
8700
|
+
border: 0;
|
|
8701
|
+
padding: 6px 8px;
|
|
8702
|
+
font: inherit;
|
|
8703
|
+
letter-spacing: inherit;
|
|
8704
|
+
line-height: 1.5rem;
|
|
8705
|
+
overflow-wrap: anywhere;
|
|
8706
|
+
min-height: calc(var(--smwb-composer-min-rows, 1) * 1.5rem + 2 * 6px);
|
|
8707
|
+
max-height: calc(var(--smwb-composer-max-rows, 8) * 1.5rem + 2 * 6px);
|
|
8708
|
+
grid-area: 1 / 1;
|
|
8709
|
+
display: block;
|
|
8710
|
+
width: 100%;
|
|
8711
|
+
resize: none;
|
|
8712
|
+
overflow-y: auto;
|
|
8713
|
+
outline: 0;
|
|
8714
|
+
background: transparent;
|
|
8715
|
+
color: var(--smui-onSurfaceColor);
|
|
8716
|
+
caret-color: var(--smui-onSurfaceColor);
|
|
8717
|
+
}
|
|
8718
|
+
.smwb-composer__input::placeholder {
|
|
8719
|
+
color: var(--smui-onSurfaceVariant);
|
|
8720
|
+
opacity: 1;
|
|
8721
|
+
}
|
|
8722
|
+
.smwb-composer__icon-button {
|
|
8723
|
+
display: inline-flex;
|
|
8724
|
+
align-items: center;
|
|
8725
|
+
justify-content: center;
|
|
8726
|
+
box-sizing: border-box;
|
|
8727
|
+
flex: none;
|
|
8728
|
+
width: 36px;
|
|
8729
|
+
height: 36px;
|
|
8730
|
+
margin: 0;
|
|
8731
|
+
padding: 0;
|
|
8732
|
+
border: 0;
|
|
8733
|
+
border-radius: 50%;
|
|
8734
|
+
background-color: transparent;
|
|
8735
|
+
color: var(--smui-onSurfaceColor);
|
|
8736
|
+
font: inherit;
|
|
8737
|
+
cursor: pointer;
|
|
8738
|
+
user-select: none;
|
|
8739
|
+
-webkit-user-select: none;
|
|
8740
|
+
transition: background-color 150ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
|
|
8741
|
+
}
|
|
8742
|
+
.smwb-composer__icon-button:hover:not(:disabled):not([aria-disabled="true"]) {
|
|
8743
|
+
background-color: var(--smui-onSurfaceHover);
|
|
8744
|
+
}
|
|
8745
|
+
.smwb-composer__icon-button:active:not(:disabled):not([aria-disabled="true"]) {
|
|
8746
|
+
background-color: var(--smui-onSurfaceActive);
|
|
8747
|
+
}
|
|
8748
|
+
.smwb-composer__icon-button:focus-visible {
|
|
8749
|
+
outline: 2px solid var(--smui-primaryColor);
|
|
8750
|
+
outline-offset: 2px;
|
|
8751
|
+
}
|
|
8752
|
+
.smwb-composer__icon-button:disabled {
|
|
8753
|
+
cursor: default;
|
|
8754
|
+
pointer-events: none;
|
|
8755
|
+
}
|
|
8756
|
+
.smwb-composer__attach {
|
|
8757
|
+
grid-area: attach;
|
|
8758
|
+
color: var(--smui-onSurfaceVariant);
|
|
8759
|
+
}
|
|
8760
|
+
.smwb-composer__toolbar {
|
|
8761
|
+
grid-area: toolbar;
|
|
8762
|
+
display: flex;
|
|
8763
|
+
flex-wrap: wrap;
|
|
8764
|
+
align-items: center;
|
|
8765
|
+
gap: 4px;
|
|
8766
|
+
min-width: 0;
|
|
8767
|
+
}
|
|
8768
|
+
.smwb-composer__attach ~ .smwb-composer__toolbar {
|
|
8769
|
+
margin-inline-start: 4px;
|
|
8770
|
+
}
|
|
8771
|
+
.smwb-composer__counter {
|
|
8772
|
+
grid-area: counter;
|
|
8773
|
+
margin-inline-start: 4px;
|
|
8774
|
+
color: var(--smui-onSurfaceVariant);
|
|
8775
|
+
font-size: 0.75rem;
|
|
8776
|
+
line-height: 1rem;
|
|
8777
|
+
font-variant-numeric: tabular-nums;
|
|
8778
|
+
white-space: nowrap;
|
|
8779
|
+
}
|
|
8780
|
+
.smwb-composer__counter_error {
|
|
8781
|
+
color: var(--smui-errorColor);
|
|
8782
|
+
font-weight: 500;
|
|
8783
|
+
}
|
|
8784
|
+
.smwb-composer__action {
|
|
8785
|
+
grid-area: action;
|
|
8786
|
+
margin-inline-start: 4px;
|
|
8787
|
+
}
|
|
8788
|
+
.smwb-composer__action:not([aria-disabled="true"]):not(:disabled) {
|
|
8789
|
+
background-color: var(--smui-primaryColor);
|
|
8790
|
+
color: var(--smui-onPrimaryColor);
|
|
8791
|
+
}
|
|
8792
|
+
.smwb-composer__action:not([aria-disabled="true"]):not(:disabled):hover {
|
|
8793
|
+
background-color: color-mix(in srgb, var(--smui-onPrimaryColor) 12%, var(--smui-primaryColor));
|
|
8794
|
+
}
|
|
8795
|
+
.smwb-composer__action:not([aria-disabled="true"]):not(:disabled):active {
|
|
8796
|
+
background-color: color-mix(in srgb, var(--smui-onPrimaryColor) 20%, var(--smui-primaryColor));
|
|
8797
|
+
}
|
|
8798
|
+
.smwb-composer__action[aria-disabled="true"],
|
|
8799
|
+
.smwb-composer__action:disabled {
|
|
8800
|
+
background-color: var(--smui-disabledBgColor);
|
|
8801
|
+
color: var(--smui-disabledTextColor);
|
|
8802
|
+
cursor: default;
|
|
8803
|
+
}
|
|
8804
|
+
.smwb-composer__action_stop:not([aria-disabled="true"]):not(:disabled) {
|
|
8805
|
+
background-color: var(--smui-onSurfaceColor);
|
|
8806
|
+
color: var(--smui-surfaceBackground);
|
|
8807
|
+
}
|
|
8808
|
+
.smwb-composer__action_stop:not([aria-disabled="true"]):not(:disabled):hover {
|
|
8809
|
+
background-color: var(--smui-onSurfaceColor);
|
|
8810
|
+
opacity: 0.88;
|
|
8811
|
+
}
|
|
8812
|
+
.smwb-composer__action_stop:not([aria-disabled="true"]):not(:disabled):active {
|
|
8813
|
+
background-color: var(--smui-onSurfaceColor);
|
|
8814
|
+
opacity: 0.76;
|
|
8815
|
+
}
|
|
8816
|
+
.smwb-composer__status {
|
|
8817
|
+
position: absolute;
|
|
8818
|
+
width: 1px;
|
|
8819
|
+
height: 1px;
|
|
8820
|
+
margin: -1px;
|
|
8821
|
+
padding: 0;
|
|
8822
|
+
border: 0;
|
|
8823
|
+
overflow: hidden;
|
|
8824
|
+
clip-path: inset(50%);
|
|
8825
|
+
white-space: nowrap;
|
|
8826
|
+
}
|
|
8827
|
+
.smwb-composer_stacked {
|
|
8828
|
+
grid-template-areas: "attachments attachments attachments attachments" "field field field field" "attach toolbar counter action";
|
|
8829
|
+
}
|
|
8830
|
+
.smwb-composer_stacked .smwb-composer__field {
|
|
8831
|
+
margin-bottom: 4px;
|
|
8832
|
+
}
|
|
8833
|
+
.smwb-composer_stacked .smwb-composer__action {
|
|
8834
|
+
justify-self: end;
|
|
8835
|
+
}
|
|
8836
|
+
.smwb-composer_inline {
|
|
8837
|
+
grid-template-areas: "attachments attachments attachments attachments" "attach field counter action" "toolbar toolbar toolbar toolbar";
|
|
8838
|
+
align-items: end;
|
|
8839
|
+
}
|
|
8840
|
+
.smwb-composer_inline .smwb-composer__toolbar {
|
|
8841
|
+
margin-top: 4px;
|
|
8842
|
+
}
|
|
8843
|
+
.smwb-composer_inline .smwb-composer__counter {
|
|
8844
|
+
align-self: end;
|
|
8845
|
+
padding-bottom: calc((36px - 1rem) / 2);
|
|
8846
|
+
}
|
|
8847
|
+
.smwb-composer_inline .smwb-composer__attach ~ .smwb-composer__toolbar {
|
|
8848
|
+
margin-inline-start: 0;
|
|
8849
|
+
}
|
|
8850
|
+
.smwb-composer_focused {
|
|
8851
|
+
border-color: var(--smui-primaryColor);
|
|
8852
|
+
box-shadow: inset 0 0 0 1px var(--smui-primaryColor);
|
|
8853
|
+
}
|
|
8854
|
+
.smwb-composer_drag-active {
|
|
8855
|
+
border-style: dashed;
|
|
8856
|
+
border-color: var(--smui-primaryColor);
|
|
8857
|
+
background-color: var(--smui-primaryContainer);
|
|
8858
|
+
}
|
|
8859
|
+
.smwb-composer_disabled {
|
|
8860
|
+
opacity: 0.6;
|
|
8861
|
+
cursor: default;
|
|
8862
|
+
}
|
|
8863
|
+
.smwb-composer_over-limit:not(.smwb-composer_focused) {
|
|
8864
|
+
border-color: var(--smui-errorColor);
|
|
8865
|
+
}
|
|
8866
|
+
@media (forced-colors: active) {
|
|
8867
|
+
.smwb-composer_focused {
|
|
8868
|
+
outline: 2px solid Highlight;
|
|
8869
|
+
outline-offset: -2px;
|
|
8870
|
+
}
|
|
8871
|
+
.smwb-composer__action:not([aria-disabled="true"]):not(:disabled) {
|
|
8872
|
+
border: 1px solid ButtonText;
|
|
8873
|
+
}
|
|
8874
|
+
.smwb-composer__action[aria-disabled="true"],
|
|
8875
|
+
.smwb-composer__action:disabled {
|
|
8876
|
+
color: GrayText;
|
|
8877
|
+
}
|
|
8878
|
+
}
|
|
8879
|
+
.smwb-stepper {
|
|
8880
|
+
display: flex;
|
|
8881
|
+
width: 100%;
|
|
8882
|
+
}
|
|
8883
|
+
.smwb-stepper_horizontal {
|
|
8884
|
+
flex-direction: row;
|
|
8885
|
+
align-items: center;
|
|
8886
|
+
}
|
|
8887
|
+
.smwb-stepper_vertical {
|
|
8888
|
+
flex-direction: column;
|
|
8889
|
+
align-items: stretch;
|
|
8890
|
+
}
|
|
8891
|
+
.smwb-stepper_vertical .smwb-stepper__step {
|
|
8892
|
+
flex-direction: row;
|
|
8893
|
+
flex: 0 0 auto;
|
|
8894
|
+
align-items: flex-start;
|
|
8895
|
+
gap: 8px;
|
|
8896
|
+
min-width: 0;
|
|
8897
|
+
text-align: start;
|
|
8898
|
+
}
|
|
8899
|
+
.smwb-stepper_vertical .smwb-stepper__text {
|
|
8900
|
+
align-items: flex-start;
|
|
8901
|
+
}
|
|
8902
|
+
.smwb-stepper_vertical .smwb-stepper__connector {
|
|
8903
|
+
width: 1px;
|
|
8904
|
+
height: auto;
|
|
8905
|
+
min-width: 0;
|
|
8906
|
+
min-height: 24px;
|
|
8907
|
+
margin: 4px 0 4px 12px;
|
|
8908
|
+
background-color: var(--smui-dividerColor);
|
|
8909
|
+
flex: 0 0 auto;
|
|
8910
|
+
}
|
|
8911
|
+
.smwb-stepper__step {
|
|
8912
|
+
display: flex;
|
|
8913
|
+
align-items: center;
|
|
8914
|
+
gap: 8px;
|
|
8915
|
+
flex-shrink: 0;
|
|
7320
8916
|
color: var(--smui-onSurfaceVariant);
|
|
7321
8917
|
}
|
|
7322
8918
|
.smwb-stepper__step_active {
|
|
@@ -7787,16 +9383,15 @@
|
|
|
7787
9383
|
font-size: 12px;
|
|
7788
9384
|
font-weight: 600;
|
|
7789
9385
|
line-height: 1.4;
|
|
9386
|
+
text-transform: var(--smui-font-overline-transform, uppercase);
|
|
9387
|
+
letter-spacing: var(--smui-font-overline-letter-spacing, 0.06em);
|
|
7790
9388
|
}
|
|
7791
9389
|
.smwb-typography_button {
|
|
7792
9390
|
font-size: 14px;
|
|
7793
9391
|
font-weight: 500;
|
|
7794
9392
|
line-height: 1.75;
|
|
7795
|
-
|
|
7796
|
-
|
|
7797
|
-
.smwb-typography_button {
|
|
7798
|
-
text-transform: uppercase;
|
|
7799
|
-
letter-spacing: 0.06em;
|
|
9393
|
+
text-transform: var(--smui-font-button-transform, uppercase);
|
|
9394
|
+
letter-spacing: var(--smui-font-button-letter-spacing, 0.06em);
|
|
7800
9395
|
}
|
|
7801
9396
|
.smwb-typography_color-primary {
|
|
7802
9397
|
color: var(--smui-primaryColor);
|
|
@@ -8158,10 +9753,14 @@
|
|
|
8158
9753
|
background: blue;
|
|
8159
9754
|
opacity: 1;
|
|
8160
9755
|
}
|
|
9756
|
+
.smwb-head-cell .smwb-head-cell__actions:has(> .smwb-rt-table--resizer:only-child) {
|
|
9757
|
+
margin-inline-start: 0;
|
|
9758
|
+
}
|
|
8161
9759
|
@media (hover: hover) {
|
|
8162
9760
|
.smwb-rt-table--resizer {
|
|
8163
9761
|
opacity: 0.5;
|
|
8164
9762
|
}
|
|
9763
|
+
.smwb-head-cell:hover .smwb-rt-table--resizer,
|
|
8165
9764
|
*:hover > .smwb-rt-table--resizer {
|
|
8166
9765
|
opacity: 1;
|
|
8167
9766
|
}
|
|
@@ -8519,6 +10118,9 @@
|
|
|
8519
10118
|
--smui-space-xl: 20px;
|
|
8520
10119
|
--smui-space-xxl: 24px;
|
|
8521
10120
|
--smui-space-xxxl: 32px;
|
|
10121
|
+
--smui-control-h-sm: 32px;
|
|
10122
|
+
--smui-control-h-md: 40px;
|
|
10123
|
+
--smui-control-h-lg: 48px;
|
|
8522
10124
|
/* Border-radius scale */
|
|
8523
10125
|
--smui-radius-xs: 2px;
|
|
8524
10126
|
--smui-radius-sm: 4px;
|