@workday/canvas-kit-css 16.0.0-alpha.0493-next.0 → 16.0.0-alpha.0499-next.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/banner.css +2 -2
- package/button.css +10 -10
- package/package.json +2 -2
- package/pill.css +4 -4
- package/side-panel.css +25 -70
package/banner.css
CHANGED
|
@@ -56,7 +56,7 @@
|
|
|
56
56
|
}
|
|
57
57
|
|
|
58
58
|
.cnvs-banner.has-errors:hover, .cnvs-banner.has-errors.hover {
|
|
59
|
-
background: color-mix(in srgb, var(--cnvs-sys-color-brand-accent-critical, var(--cnvs-brand-error-base, oklch(0.5342 0.2172 29.53 / 1))) , var(--cnvs-sys-color-accent-overlay-
|
|
59
|
+
background: color-mix(in srgb, var(--cnvs-sys-color-brand-accent-critical, var(--cnvs-brand-error-base, oklch(0.5342 0.2172 29.53 / 1))) , var(--cnvs-sys-color-accent-overlay-mixin, oklch(0 0 0 / 1)) calc(var(--cnvs-sys-opacity-accent-hover, 0.18) * 100%));
|
|
60
60
|
}
|
|
61
61
|
|
|
62
62
|
.cnvs-banner.has-errors [data-part="exclamation-circle-icon"] {
|
|
@@ -72,7 +72,7 @@
|
|
|
72
72
|
}
|
|
73
73
|
|
|
74
74
|
.cnvs-banner.has-errors-false:hover, .cnvs-banner.has-errors-false.hover {
|
|
75
|
-
background: color-mix(in srgb, var(--cnvs-sys-color-brand-accent-caution, oklch(0.7909 0.1711 70.15 / 1)) , var(--cnvs-sys-color-accent-overlay-
|
|
75
|
+
background: color-mix(in srgb, var(--cnvs-sys-color-brand-accent-caution, oklch(0.7909 0.1711 70.15 / 1)) , var(--cnvs-sys-color-accent-overlay-mixin, oklch(0 0 0 / 1)) calc(var(--cnvs-sys-opacity-accent-hover, 0.18) * 100%));
|
|
76
76
|
}
|
|
77
77
|
|
|
78
78
|
.cnvs-banner.has-errors-false [data-part="exclamation-triangle-icon"] {
|
package/button.css
CHANGED
|
@@ -400,12 +400,12 @@
|
|
|
400
400
|
}
|
|
401
401
|
|
|
402
402
|
.cnvs-toolbar-icon-button:hover, .cnvs-toolbar-icon-button.hover {
|
|
403
|
-
--cnvs-button-background:
|
|
403
|
+
--cnvs-button-background: var(--cnvs-sys-color-surface-overlay-hover-default, oklch(0.3343 0.0951 253.3 / 0.05));
|
|
404
404
|
--cnvs-system-icon-color: var(--cnvs-sys-color-fg-strong);
|
|
405
405
|
}
|
|
406
406
|
|
|
407
407
|
.cnvs-toolbar-icon-button:active, .cnvs-toolbar-icon-button.active {
|
|
408
|
-
--cnvs-button-background:
|
|
408
|
+
--cnvs-button-background: var(--cnvs-sys-color-surface-overlay-pressed-default, oklch(0.3337 0.0688 250.79 / 0.09));
|
|
409
409
|
--cnvs-system-icon-color: var(--cnvs-sys-color-fg-strong);
|
|
410
410
|
}
|
|
411
411
|
|
|
@@ -452,12 +452,12 @@
|
|
|
452
452
|
}
|
|
453
453
|
|
|
454
454
|
.cnvs-toolbar-dropdown-button:hover, .cnvs-toolbar-dropdown-button.hover {
|
|
455
|
-
--cnvs-button-background:
|
|
455
|
+
--cnvs-button-background: var(--cnvs-sys-color-surface-overlay-hover-default, oklch(0.3343 0.0951 253.3 / 0.05));
|
|
456
456
|
--cnvs-system-icon-color: var(--cnvs-button-color-prop-hover-icon, var(--cnvs-sys-color-fg-default));
|
|
457
457
|
}
|
|
458
458
|
|
|
459
459
|
.cnvs-toolbar-dropdown-button:active, .cnvs-toolbar-dropdown-button.active {
|
|
460
|
-
--cnvs-button-background:
|
|
460
|
+
--cnvs-button-background: var(--cnvs-sys-color-surface-overlay-pressed-default, oklch(0.3337 0.0688 250.79 / 0.09));
|
|
461
461
|
--cnvs-system-icon-color: var(--cnvs-button-color-prop-active-icon, var(--cnvs-sys-color-fg-strong));
|
|
462
462
|
}
|
|
463
463
|
|
|
@@ -607,13 +607,13 @@
|
|
|
607
607
|
}
|
|
608
608
|
|
|
609
609
|
.cnvs-primary-button:hover, .cnvs-primary-button.hover {
|
|
610
|
-
--cnvs-button-background: var(--cnvs-brand-action-dark, color-mix(in srgb, var(--cnvs-brand-action-base, var(--cnvs-sys-color-brand-accent-primary, var(--cnvs-brand-primary-base, oklch(0.5198 0.1782 256.11 / 1)))) , var(--cnvs-sys-color-accent-overlay-
|
|
610
|
+
--cnvs-button-background: var(--cnvs-brand-action-dark, color-mix(in srgb, var(--cnvs-brand-action-base, var(--cnvs-sys-color-brand-accent-primary, var(--cnvs-brand-primary-base, oklch(0.5198 0.1782 256.11 / 1)))) , var(--cnvs-sys-color-accent-overlay-mixin, oklch(0 0 0 / 1)) calc(var(--cnvs-sys-opacity-accent-hover, 0.18) * 100%)));
|
|
611
611
|
--cnvs-button-label: var(--cnvs-brand-action-accent, var(--cnvs-sys-color-fg-inverse));
|
|
612
612
|
--cnvs-system-icon-color: var(--cnvs-button-color-prop-hover-icon, currentColor);
|
|
613
613
|
}
|
|
614
614
|
|
|
615
615
|
.cnvs-primary-button:active, .cnvs-primary-button.active {
|
|
616
|
-
--cnvs-button-background: var(--cnvs-brand-action-darkest, color-mix(in srgb, var(--cnvs-brand-action-base, var(--cnvs-sys-color-brand-accent-primary, var(--cnvs-brand-primary-base, oklch(0.5198 0.1782 256.11 / 1)))) , var(--cnvs-sys-color-accent-overlay-
|
|
616
|
+
--cnvs-button-background: var(--cnvs-brand-action-darkest, color-mix(in srgb, var(--cnvs-brand-action-base, var(--cnvs-sys-color-brand-accent-primary, var(--cnvs-brand-primary-base, oklch(0.5198 0.1782 256.11 / 1)))) , var(--cnvs-sys-color-accent-overlay-mixin, oklch(0 0 0 / 1)) calc(var(--cnvs-sys-opacity-accent-pressed, 0.36) * 100%)));
|
|
617
617
|
--cnvs-button-label: var(--cnvs-brand-action-accent, var(--cnvs-sys-color-fg-inverse));
|
|
618
618
|
--cnvs-system-icon-color: var(--cnvs-button-color-prop-active-icon, currentColor);
|
|
619
619
|
}
|
|
@@ -634,7 +634,7 @@
|
|
|
634
634
|
}
|
|
635
635
|
|
|
636
636
|
.cnvs-primary-button.variant-inverse:hover, .cnvs-primary-button.variant-inverse.hover {
|
|
637
|
-
--cnvs-button-background: var(--cnvs-brand-action-lighter, color-mix(in srgb, var(--cnvs-brand-action-lightest, var(--cnvs-sys-color-surface-inverse, var(--cnvs-sys-color-bg-default, oklch(1 0 0 / 1)))) , var(--cnvs-sys-color-surface-overlay-
|
|
637
|
+
--cnvs-button-background: var(--cnvs-brand-action-lighter, color-mix(in srgb, var(--cnvs-brand-action-lightest, var(--cnvs-sys-color-surface-inverse, var(--cnvs-sys-color-bg-default, oklch(1 0 0 / 1)))) , var(--cnvs-sys-color-surface-overlay-mixin, oklch(0.629 0.0281 255.62 / 1)) calc(var(--cnvs-sys-opacity-surface-hover, 0.08) * 100%)));
|
|
638
638
|
--cnvs-button-label: var(--cnvs-sys-color-fg-stronger);
|
|
639
639
|
--cnvs-system-icon-color: var(--cnvs-button-color-prop-hover-icon, currentColor);
|
|
640
640
|
}
|
|
@@ -648,7 +648,7 @@
|
|
|
648
648
|
}
|
|
649
649
|
|
|
650
650
|
.cnvs-primary-button.variant-inverse:active, .cnvs-primary-button.variant-inverse.active {
|
|
651
|
-
--cnvs-button-background: var(--cnvs-brand-action-light, color-mix(in srgb, var(--cnvs-brand-action-lightest, var(--cnvs-sys-color-surface-inverse, var(--cnvs-sys-color-bg-default, oklch(1 0 0 / 1)))) , var(--cnvs-sys-color-surface-overlay-
|
|
651
|
+
--cnvs-button-background: var(--cnvs-brand-action-light, color-mix(in srgb, var(--cnvs-brand-action-lightest, var(--cnvs-sys-color-surface-inverse, var(--cnvs-sys-color-bg-default, oklch(1 0 0 / 1)))) , var(--cnvs-sys-color-surface-overlay-mixin, oklch(0.629 0.0281 255.62 / 1)) calc(var(--cnvs-sys-opacity-surface-pressed, 0.18) * 100%)));
|
|
652
652
|
--cnvs-button-label: var(--cnvs-sys-color-fg-stronger);
|
|
653
653
|
--cnvs-system-icon-color: var(--cnvs-button-color-prop-active-icon, currentColor);
|
|
654
654
|
}
|
|
@@ -752,13 +752,13 @@
|
|
|
752
752
|
}
|
|
753
753
|
|
|
754
754
|
.cnvs-delete-button:hover, .cnvs-delete-button.hover {
|
|
755
|
-
--cnvs-button-background: var(--cnvs-brand-critical-700, color-mix(in srgb, var(--cnvs-sys-color-brand-accent-critical, var(--cnvs-brand-error-base, oklch(0.5342 0.2172 29.53 / 1))) , var(--cnvs-sys-color-accent-overlay-
|
|
755
|
+
--cnvs-button-background: var(--cnvs-brand-critical-700, color-mix(in srgb, var(--cnvs-sys-color-brand-accent-critical, var(--cnvs-brand-error-base, oklch(0.5342 0.2172 29.53 / 1))) , var(--cnvs-sys-color-accent-overlay-mixin, oklch(0 0 0 / 1)) calc(var(--cnvs-sys-opacity-accent-hover, 0.18) * 100%)));
|
|
756
756
|
--cnvs-button-label: var(--cnvs-sys-color-fg-inverse);
|
|
757
757
|
--cnvs-system-icon-color: var(--cnvs-button-color-prop-hover-icon, var(--cnvs-sys-color-fg-inverse));
|
|
758
758
|
}
|
|
759
759
|
|
|
760
760
|
.cnvs-delete-button:active, .cnvs-delete-button.active {
|
|
761
|
-
--cnvs-button-background: var(--cnvs-brand-critical-800, color-mix(in srgb, var(--cnvs-sys-color-brand-accent-critical, var(--cnvs-brand-error-base, oklch(0.5342 0.2172 29.53 / 1))) , var(--cnvs-sys-color-accent-overlay-
|
|
761
|
+
--cnvs-button-background: var(--cnvs-brand-critical-800, color-mix(in srgb, var(--cnvs-sys-color-brand-accent-critical, var(--cnvs-brand-error-base, oklch(0.5342 0.2172 29.53 / 1))) , var(--cnvs-sys-color-accent-overlay-mixin, oklch(0 0 0 / 1)) calc(var(--cnvs-sys-opacity-accent-pressed, 0.36) * 100%)));
|
|
762
762
|
--cnvs-button-label: var(--cnvs-sys-color-fg-inverse);
|
|
763
763
|
--cnvs-system-icon-color: var(--cnvs-button-color-prop-active-icon, var(--cnvs-sys-color-fg-inverse));
|
|
764
764
|
}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@workday/canvas-kit-css",
|
|
3
|
-
"version": "16.0.0-alpha.
|
|
3
|
+
"version": "16.0.0-alpha.0499-next.0",
|
|
4
4
|
"type": "module",
|
|
5
5
|
"description": "The parent module that contains all Workday Canvas Kit CSS components",
|
|
6
6
|
"author": "Workday, Inc. (https://www.workday.com)",
|
|
@@ -26,5 +26,5 @@
|
|
|
26
26
|
"components",
|
|
27
27
|
"workday"
|
|
28
28
|
],
|
|
29
|
-
"gitHead": "
|
|
29
|
+
"gitHead": "cd5cbb846495120a4bffea4ee17b3b0a482e68c0"
|
|
30
30
|
}
|
package/pill.css
CHANGED
|
@@ -145,7 +145,7 @@
|
|
|
145
145
|
}
|
|
146
146
|
|
|
147
147
|
.cnvs-pill:hover, .cnvs-pill.hover {
|
|
148
|
-
--cnvs-button-background: color-mix(in srgb, var(--cnvs-sys-color-surface-alt-default, var(--cnvs-sys-color-bg-alt-soft, oklch(0.3343 0.0951 253.3 / 0.05))) , var(--cnvs-
|
|
148
|
+
--cnvs-button-background: color-mix(in srgb, var(--cnvs-sys-color-surface-alt-default, var(--cnvs-sys-color-bg-alt-soft, oklch(0.3343 0.0951 253.3 / 0.05))) , var(--cnvs-base-palette-neutral-1000, oklch(0 0 0 / 1)) calc(0.0392 * 100%));
|
|
149
149
|
--cnvs-button-border: var(--cnvs-sys-color-border-transparent);
|
|
150
150
|
--cnvs-button-label: var(--cnvs-sys-color-fg-stronger);
|
|
151
151
|
--cnvs-system-icon-color: currentColor;
|
|
@@ -153,7 +153,7 @@
|
|
|
153
153
|
}
|
|
154
154
|
|
|
155
155
|
.cnvs-pill:active, .cnvs-pill.active {
|
|
156
|
-
--cnvs-button-background: color-mix(in srgb, var(--cnvs-sys-color-surface-alt-default, var(--cnvs-sys-color-bg-alt-soft, oklch(0.3343 0.0951 253.3 / 0.05))) , var(--cnvs-
|
|
156
|
+
--cnvs-button-background: color-mix(in srgb, var(--cnvs-sys-color-surface-alt-default, var(--cnvs-sys-color-bg-alt-soft, oklch(0.3343 0.0951 253.3 / 0.05))) , var(--cnvs-base-palette-neutral-1000, oklch(0 0 0 / 1)) calc(0.0745 * 100%));
|
|
157
157
|
--cnvs-button-label: var(--cnvs-sys-color-fg-stronger);
|
|
158
158
|
--cnvs-system-icon-color: currentColor;
|
|
159
159
|
--cnvs-pill-count-border-color: transparent;
|
|
@@ -216,12 +216,12 @@
|
|
|
216
216
|
}
|
|
217
217
|
|
|
218
218
|
.cnvs-pill.variant-removable:hover, .cnvs-pill.variant-removable.hover {
|
|
219
|
-
--cnvs-button-background: color-mix(in srgb, var(--cnvs-sys-color-surface-alt-default, var(--cnvs-sys-color-bg-alt-soft, oklch(0.3343 0.0951 253.3 / 0.05))) , var(--cnvs-
|
|
219
|
+
--cnvs-button-background: color-mix(in srgb, var(--cnvs-sys-color-surface-alt-default, var(--cnvs-sys-color-bg-alt-soft, oklch(0.3343 0.0951 253.3 / 0.05))) , var(--cnvs-base-palette-neutral-1000, oklch(0 0 0 / 1)) calc(0.0392 * 100%));
|
|
220
220
|
--cnvs-pill-count-background-color: var(--cnvs-sys-color-surface-transparent, var(--cnvs-sys-color-bg-transparent-default, oklch(0 0 0 / 0)));
|
|
221
221
|
}
|
|
222
222
|
|
|
223
223
|
.cnvs-pill.variant-removable:active, .cnvs-pill.variant-removable.active {
|
|
224
|
-
--cnvs-button-background: color-mix(in srgb, var(--cnvs-sys-color-surface-alt-default, var(--cnvs-sys-color-bg-alt-soft, oklch(0.3343 0.0951 253.3 / 0.05))) , var(--cnvs-
|
|
224
|
+
--cnvs-button-background: color-mix(in srgb, var(--cnvs-sys-color-surface-alt-default, var(--cnvs-sys-color-bg-alt-soft, oklch(0.3343 0.0951 253.3 / 0.05))) , var(--cnvs-base-palette-neutral-1000, oklch(0 0 0 / 1)) calc(0.0745 * 100%));
|
|
225
225
|
--cnvs-pill-count-background-color: var(--cnvs-sys-color-surface-transparent, var(--cnvs-sys-color-bg-transparent-default, oklch(0 0 0 / 0)));
|
|
226
226
|
}
|
|
227
227
|
|
package/side-panel.css
CHANGED
|
@@ -1,6 +1,15 @@
|
|
|
1
1
|
.cnvs-side-panel-heading {
|
|
2
2
|
box-sizing: border-box;
|
|
3
|
-
|
|
3
|
+
display: flex;
|
|
4
|
+
align-items: center;
|
|
5
|
+
padding: var(--cnvs-sys-padding-sm, var(--cnvs-sys-space-x3, 0.75rem));
|
|
6
|
+
padding-inline-start: var(--cnvs-sys-padding-md, var(--cnvs-sys-space-x4, 1rem));
|
|
7
|
+
min-height: var(--cnvs-sys-size-xxl, var(--cnvs-sys-space-x16, 4rem));
|
|
8
|
+
margin: 0;
|
|
9
|
+
}
|
|
10
|
+
|
|
11
|
+
.cnvs-side-panel-heading:where([hidden]) {
|
|
12
|
+
display: none;
|
|
4
13
|
}
|
|
5
14
|
|
|
6
15
|
|
|
@@ -13,103 +22,44 @@
|
|
|
13
22
|
.cnvs-side-panel-toggle-button {
|
|
14
23
|
box-sizing: border-box;
|
|
15
24
|
position: absolute;
|
|
16
|
-
top:
|
|
17
|
-
width: var(--cnvs-sys-
|
|
18
|
-
|
|
25
|
+
top: 0.75rem;
|
|
26
|
+
width: var(--cnvs-sys-size-md, var(--cnvs-sys-space-x10, 2.5rem));
|
|
27
|
+
}
|
|
28
|
+
|
|
29
|
+
.cnvs-side-panel-toggle-button :dir(rtl) {
|
|
30
|
+
transform: scaleX(-1);
|
|
19
31
|
}
|
|
20
32
|
|
|
21
33
|
|
|
22
34
|
.cnvs-side-panel-toggle-button.state-collapsing {
|
|
23
35
|
margin: 0;
|
|
24
|
-
transform: scaleX(1);
|
|
25
|
-
}
|
|
26
|
-
|
|
27
|
-
.cnvs-side-panel-toggle-button.state-collapsing :dir(rtl) {
|
|
28
|
-
transform: scaleX(-1);
|
|
29
36
|
}
|
|
30
37
|
|
|
31
38
|
|
|
32
39
|
.cnvs-side-panel-toggle-button.state-collapsed {
|
|
33
40
|
margin: auto;
|
|
34
|
-
transform: scaleX(1);
|
|
35
|
-
}
|
|
36
|
-
|
|
37
|
-
.cnvs-side-panel-toggle-button.state-collapsed :dir(rtl) {
|
|
38
|
-
transform: scaleX(-1);
|
|
39
41
|
}
|
|
40
42
|
|
|
41
43
|
|
|
42
44
|
.cnvs-side-panel-toggle-button.state-expanded {
|
|
43
45
|
margin: 0;
|
|
44
|
-
transform: scaleX(-1);
|
|
45
|
-
}
|
|
46
|
-
|
|
47
|
-
.cnvs-side-panel-toggle-button.state-expanded :dir(rtl) {
|
|
48
|
-
transform: scaleX(1);
|
|
49
46
|
}
|
|
50
47
|
|
|
51
48
|
|
|
52
49
|
.cnvs-side-panel-toggle-button.state-expanding {
|
|
53
50
|
margin: 0;
|
|
54
|
-
transform: scaleX(-1);
|
|
55
|
-
}
|
|
56
|
-
|
|
57
|
-
.cnvs-side-panel-toggle-button.state-expanding :dir(rtl) {
|
|
58
|
-
transform: scaleX(1);
|
|
59
|
-
}
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
.cnvs-side-panel-toggle-button.origin-end {
|
|
64
|
-
transform: scaleX(1);
|
|
65
|
-
}
|
|
66
|
-
|
|
67
|
-
.cnvs-side-panel-toggle-button.origin-end :dir(rtl) {
|
|
68
|
-
transform: scaleX(-1);
|
|
69
51
|
}
|
|
70
52
|
|
|
71
53
|
|
|
72
|
-
.cnvs-side-panel-toggle-button.
|
|
73
|
-
transform: scaleX(-1);
|
|
74
|
-
}
|
|
75
|
-
|
|
76
|
-
.cnvs-side-panel-toggle-button.state-collapsed.origin-end :dir(rtl) {
|
|
77
|
-
transform: scaleX(1);
|
|
78
|
-
}
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
.cnvs-side-panel-toggle-button.state-collapsing.origin-end {
|
|
82
|
-
transform: scaleX(-1);
|
|
83
|
-
inset-inline-start: var(--cnvs-base-size-150, 0.75rem);
|
|
84
|
-
}
|
|
85
|
-
|
|
86
|
-
.cnvs-side-panel-toggle-button.state-collapsing.origin-end :dir(rtl) {
|
|
87
|
-
transform: scaleX(1);
|
|
88
|
-
inset-inline-end: var(--cnvs-base-size-150, 0.75rem);
|
|
89
|
-
}
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
.cnvs-side-panel-toggle-button.state-expanded.origin-end {
|
|
93
|
-
transform: scaleX(1);
|
|
94
|
-
inset-inline-start: var(--cnvs-base-size-150, 0.75rem);
|
|
95
|
-
}
|
|
96
|
-
|
|
97
|
-
.cnvs-side-panel-toggle-button.state-expanded.origin-end :dir(rtl) {
|
|
98
|
-
transform: scaleX(-1);
|
|
54
|
+
.cnvs-side-panel-toggle-button.origin-start {
|
|
99
55
|
inset-inline-end: var(--cnvs-base-size-150, 0.75rem);
|
|
100
56
|
}
|
|
101
57
|
|
|
102
58
|
|
|
103
|
-
.cnvs-side-panel-toggle-button.
|
|
104
|
-
transform: scaleX(1);
|
|
59
|
+
.cnvs-side-panel-toggle-button.origin-end {
|
|
105
60
|
inset-inline-start: var(--cnvs-base-size-150, 0.75rem);
|
|
106
61
|
}
|
|
107
62
|
|
|
108
|
-
.cnvs-side-panel-toggle-button.state-expanding.origin-end :dir(rtl) {
|
|
109
|
-
transform: scaleX(-1);
|
|
110
|
-
inset-inline-end: var(--cnvs-base-size-150, 0.75rem);
|
|
111
|
-
}
|
|
112
|
-
|
|
113
63
|
|
|
114
64
|
.cnvs-panel {
|
|
115
65
|
box-sizing: border-box;
|
|
@@ -121,9 +71,14 @@
|
|
|
121
71
|
}
|
|
122
72
|
|
|
123
73
|
|
|
124
|
-
.cnvs-panel.variant-
|
|
74
|
+
.cnvs-panel.variant-overlay {
|
|
125
75
|
background-color: var(--cnvs-sys-color-surface-default, var(--cnvs-sys-color-bg-default, oklch(1 0 0 / 1)));
|
|
126
|
-
box-shadow: var(--cnvs-sys-depth-
|
|
76
|
+
box-shadow: var(--cnvs-sys-depth-6);
|
|
77
|
+
}
|
|
78
|
+
|
|
79
|
+
|
|
80
|
+
.cnvs-panel.variant-alternative {
|
|
81
|
+
background-color: var(--cnvs-sys-color-surface-raised, var(--cnvs-sys-color-bg-alt-softer, oklch(0.4688 0.0781 250.43 / 0.03)));
|
|
127
82
|
}
|
|
128
83
|
|
|
129
84
|
|