@seed-design/css 1.2.7 → 1.2.8
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/all.css +212 -200
- package/all.layered.css +212 -200
- package/all.layered.min.css +1 -1
- package/all.min.css +1 -1
- package/base.css +6 -2
- package/base.layered.css +6 -2
- package/base.layered.min.css +1 -1
- package/base.min.css +1 -1
- package/package.json +1 -1
- package/recipes/action-button.css +14 -14
- package/recipes/action-button.layered.css +14 -14
- package/recipes/action-sheet.layered.css +3 -3
- package/recipes/app-screen.layered.css +13 -13
- package/recipes/bottom-sheet-handle.css +2 -2
- package/recipes/bottom-sheet-handle.layered.css +2 -2
- package/recipes/bottom-sheet.layered.css +3 -3
- package/recipes/callout.css +12 -12
- package/recipes/callout.layered.css +13 -13
- package/recipes/checkbox.layered.css +2 -2
- package/recipes/checkmark.css +12 -12
- package/recipes/checkmark.layered.css +12 -12
- package/recipes/chip-tabs.css +12 -12
- package/recipes/chip-tabs.layered.css +12 -12
- package/recipes/chip.css +12 -12
- package/recipes/chip.layered.css +12 -12
- package/recipes/contextual-floating-button.css +4 -4
- package/recipes/contextual-floating-button.layered.css +4 -4
- package/recipes/dialog.layered.css +3 -3
- package/recipes/extended-action-sheet.layered.css +3 -3
- package/recipes/field.layered.css +2 -2
- package/recipes/floating-action-button.css +2 -2
- package/recipes/floating-action-button.layered.css +2 -2
- package/recipes/help-bubble.layered.css +4 -4
- package/recipes/image-frame-reaction-button.layered.css +4 -4
- package/recipes/image-frame.css +11 -5
- package/recipes/image-frame.layered.css +8 -0
- package/recipes/inline-banner.layered.css +3 -3
- package/recipes/input-button.css +2 -2
- package/recipes/input-button.layered.css +2 -2
- package/recipes/list-item.css +8 -8
- package/recipes/list-item.layered.css +8 -8
- package/recipes/menu-sheet-item.css +2 -2
- package/recipes/menu-sheet-item.layered.css +2 -2
- package/recipes/menu-sheet.css +2 -2
- package/recipes/menu-sheet.layered.css +6 -6
- package/recipes/page-banner.css +22 -22
- package/recipes/page-banner.layered.css +27 -27
- package/recipes/pull-to-refresh.layered.css +1 -1
- package/recipes/radio.layered.css +2 -2
- package/recipes/radiomark.css +6 -6
- package/recipes/radiomark.layered.css +6 -6
- package/recipes/reaction-button.css +4 -4
- package/recipes/reaction-button.layered.css +4 -4
- package/recipes/segmented-control.css +4 -4
- package/recipes/segmented-control.layered.css +4 -4
- package/recipes/select-box.css +2 -2
- package/recipes/select-box.layered.css +2 -2
- package/recipes/selectBoxCheckmark.css +2 -2
- package/recipes/selectBoxCheckmark.layered.css +2 -2
- package/recipes/slider.layered.css +2 -2
- package/recipes/snackbar-region.layered.css +1 -1
- package/recipes/switch.layered.css +3 -3
- package/recipes/switchmark.layered.css +3 -3
- package/recipes/tabs.layered.css +4 -4
- package/recipes/toggle-button.css +8 -8
- package/recipes/toggle-button.layered.css +8 -8
- package/vars/component/menu-sheet.d.ts +1 -0
- package/vars/component/menu-sheet.mjs +1 -0
package/all.css
CHANGED
|
@@ -824,13 +824,13 @@
|
|
|
824
824
|
--range-color: var(--seed-color-palette-static-white);
|
|
825
825
|
}
|
|
826
826
|
|
|
827
|
-
@media (hover: hover) {
|
|
827
|
+
@media (hover: hover) and (pointer: fine) {
|
|
828
828
|
.seed-action-button--variant_brandSolid:is(:hover, [data-hover]) {
|
|
829
829
|
background: var(--seed-color-bg-brand-solid-pressed);
|
|
830
830
|
}
|
|
831
831
|
}
|
|
832
832
|
|
|
833
|
-
@media (hover:
|
|
833
|
+
@media not all and (hover: hover) and (pointer: fine) {
|
|
834
834
|
.seed-action-button--variant_brandSolid:is(:active, [data-active]) {
|
|
835
835
|
background: var(--seed-color-bg-brand-solid-pressed);
|
|
836
836
|
}
|
|
@@ -859,13 +859,13 @@
|
|
|
859
859
|
--range-color: var(--seed-color-palette-static-white);
|
|
860
860
|
}
|
|
861
861
|
|
|
862
|
-
@media (hover: hover) {
|
|
862
|
+
@media (hover: hover) and (pointer: fine) {
|
|
863
863
|
.seed-action-button--variant_neutralSolid:is(:hover, [data-hover]) {
|
|
864
864
|
background: var(--seed-color-bg-neutral-inverted-pressed);
|
|
865
865
|
}
|
|
866
866
|
}
|
|
867
867
|
|
|
868
|
-
@media (hover:
|
|
868
|
+
@media not all and (hover: hover) and (pointer: fine) {
|
|
869
869
|
.seed-action-button--variant_neutralSolid:is(:active, [data-active]) {
|
|
870
870
|
background: var(--seed-color-bg-neutral-inverted-pressed);
|
|
871
871
|
}
|
|
@@ -894,13 +894,13 @@
|
|
|
894
894
|
--range-color: var(--seed-color-fg-neutral);
|
|
895
895
|
}
|
|
896
896
|
|
|
897
|
-
@media (hover: hover) {
|
|
897
|
+
@media (hover: hover) and (pointer: fine) {
|
|
898
898
|
.seed-action-button--variant_neutralWeak:is(:hover, [data-hover]) {
|
|
899
899
|
background: var(--seed-color-bg-neutral-weak-pressed);
|
|
900
900
|
}
|
|
901
901
|
}
|
|
902
902
|
|
|
903
|
-
@media (hover:
|
|
903
|
+
@media not all and (hover: hover) and (pointer: fine) {
|
|
904
904
|
.seed-action-button--variant_neutralWeak:is(:active, [data-active]) {
|
|
905
905
|
background: var(--seed-color-bg-neutral-weak-pressed);
|
|
906
906
|
}
|
|
@@ -929,13 +929,13 @@
|
|
|
929
929
|
--range-color: var(--seed-color-palette-static-white);
|
|
930
930
|
}
|
|
931
931
|
|
|
932
|
-
@media (hover: hover) {
|
|
932
|
+
@media (hover: hover) and (pointer: fine) {
|
|
933
933
|
.seed-action-button--variant_criticalSolid:is(:hover, [data-hover]) {
|
|
934
934
|
background: var(--seed-color-bg-critical-solid-pressed);
|
|
935
935
|
}
|
|
936
936
|
}
|
|
937
937
|
|
|
938
|
-
@media (hover:
|
|
938
|
+
@media not all and (hover: hover) and (pointer: fine) {
|
|
939
939
|
.seed-action-button--variant_criticalSolid:is(:active, [data-active]) {
|
|
940
940
|
background: var(--seed-color-bg-critical-solid-pressed);
|
|
941
941
|
}
|
|
@@ -967,13 +967,13 @@
|
|
|
967
967
|
--range-color: var(--seed-color-bg-brand-solid);
|
|
968
968
|
}
|
|
969
969
|
|
|
970
|
-
@media (hover: hover) {
|
|
970
|
+
@media (hover: hover) and (pointer: fine) {
|
|
971
971
|
.seed-action-button--variant_brandOutline:is(:hover, [data-hover]) {
|
|
972
972
|
background: var(--seed-color-bg-transparent-pressed);
|
|
973
973
|
}
|
|
974
974
|
}
|
|
975
975
|
|
|
976
|
-
@media (hover:
|
|
976
|
+
@media not all and (hover: hover) and (pointer: fine) {
|
|
977
977
|
.seed-action-button--variant_brandOutline:is(:active, [data-active]) {
|
|
978
978
|
background: var(--seed-color-bg-transparent-pressed);
|
|
979
979
|
}
|
|
@@ -1006,13 +1006,13 @@
|
|
|
1006
1006
|
--range-color: var(--seed-color-fg-neutral);
|
|
1007
1007
|
}
|
|
1008
1008
|
|
|
1009
|
-
@media (hover: hover) {
|
|
1009
|
+
@media (hover: hover) and (pointer: fine) {
|
|
1010
1010
|
.seed-action-button--variant_neutralOutline:is(:hover, [data-hover]) {
|
|
1011
1011
|
background: var(--seed-color-bg-transparent-pressed);
|
|
1012
1012
|
}
|
|
1013
1013
|
}
|
|
1014
1014
|
|
|
1015
|
-
@media (hover:
|
|
1015
|
+
@media not all and (hover: hover) and (pointer: fine) {
|
|
1016
1016
|
.seed-action-button--variant_neutralOutline:is(:active, [data-active]) {
|
|
1017
1017
|
background: var(--seed-color-bg-transparent-pressed);
|
|
1018
1018
|
}
|
|
@@ -1044,13 +1044,13 @@
|
|
|
1044
1044
|
background: #fff0;
|
|
1045
1045
|
}
|
|
1046
1046
|
|
|
1047
|
-
@media (hover: hover) {
|
|
1047
|
+
@media (hover: hover) and (pointer: fine) {
|
|
1048
1048
|
.seed-action-button--variant_ghost:is(:hover, [data-hover]) {
|
|
1049
1049
|
background: var(--seed-color-bg-transparent-pressed);
|
|
1050
1050
|
}
|
|
1051
1051
|
}
|
|
1052
1052
|
|
|
1053
|
-
@media (hover:
|
|
1053
|
+
@media not all and (hover: hover) and (pointer: fine) {
|
|
1054
1054
|
.seed-action-button--variant_ghost:is(:active, [data-active]) {
|
|
1055
1055
|
background: var(--seed-color-bg-transparent-pressed);
|
|
1056
1056
|
}
|
|
@@ -1266,7 +1266,7 @@
|
|
|
1266
1266
|
.seed-action-sheet__positioner {
|
|
1267
1267
|
overscroll-behavior-y: none;
|
|
1268
1268
|
--sheet-z-index: 2;
|
|
1269
|
-
z-index: calc(var(--sheet-z-index)
|
|
1269
|
+
z-index: calc(var(--sheet-z-index) + var(--layer-index, 0));
|
|
1270
1270
|
justify-content: center;
|
|
1271
1271
|
align-items: flex-end;
|
|
1272
1272
|
display: flex;
|
|
@@ -1276,7 +1276,7 @@
|
|
|
1276
1276
|
|
|
1277
1277
|
.seed-action-sheet__backdrop {
|
|
1278
1278
|
background: var(--seed-color-bg-overlay);
|
|
1279
|
-
z-index: calc(var(--sheet-z-index)
|
|
1279
|
+
z-index: calc(var(--sheet-z-index) + var(--layer-index, 0));
|
|
1280
1280
|
position: fixed;
|
|
1281
1281
|
inset: 0;
|
|
1282
1282
|
}
|
|
@@ -1305,7 +1305,7 @@
|
|
|
1305
1305
|
.seed-action-sheet__content {
|
|
1306
1306
|
box-sizing: border-box;
|
|
1307
1307
|
word-break: break-all;
|
|
1308
|
-
z-index: calc(var(--sheet-z-index)
|
|
1308
|
+
z-index: calc(var(--sheet-z-index) + var(--layer-index, 0));
|
|
1309
1309
|
background: var(--seed-color-bg-layer-floating);
|
|
1310
1310
|
border-top-left-radius: var(--seed-radius-r5);
|
|
1311
1311
|
border-top-right-radius: var(--seed-radius-r5);
|
|
@@ -2014,7 +2014,7 @@
|
|
|
2014
2014
|
}
|
|
2015
2015
|
|
|
2016
2016
|
.seed-app-screen__root {
|
|
2017
|
-
--app-bar-offset: calc(var(--app-bar-height)
|
|
2017
|
+
--app-bar-offset: calc(var(--app-bar-height) + var(--seed-safe-area-top));
|
|
2018
2018
|
width: 100%;
|
|
2019
2019
|
height: 100%;
|
|
2020
2020
|
position: absolute;
|
|
@@ -2074,10 +2074,10 @@
|
|
|
2074
2074
|
}
|
|
2075
2075
|
|
|
2076
2076
|
.seed-app-screen__root--transitionStyle_slideFromRightIOS {
|
|
2077
|
-
--z-index-dim: calc(var(--z-index-base)
|
|
2078
|
-
--z-index-layer: calc(var(--z-index-base)
|
|
2079
|
-
--z-index-edge: calc(var(--z-index-base)
|
|
2080
|
-
--z-index-app-bar: calc(var(--z-index-base)
|
|
2077
|
+
--z-index-dim: calc(var(--z-index-base) + 0);
|
|
2078
|
+
--z-index-layer: calc(var(--z-index-base) + 2);
|
|
2079
|
+
--z-index-edge: calc(var(--z-index-base) + 4);
|
|
2080
|
+
--z-index-app-bar: calc(var(--z-index-base) + 7);
|
|
2081
2081
|
}
|
|
2082
2082
|
|
|
2083
2083
|
.seed-app-screen__layer--transitionStyle_slideFromRightIOS {
|
|
@@ -2222,10 +2222,10 @@
|
|
|
2222
2222
|
}
|
|
2223
2223
|
|
|
2224
2224
|
.seed-app-screen__root--transitionStyle_fadeFromBottomAndroid {
|
|
2225
|
-
--z-index-dim: calc(var(--z-index-base)
|
|
2226
|
-
--z-index-layer: calc(var(--z-index-base)
|
|
2227
|
-
--z-index-edge: calc(var(--z-index-base)
|
|
2228
|
-
--z-index-app-bar: calc(var(--z-index-base)
|
|
2225
|
+
--z-index-dim: calc(var(--z-index-base) + 0);
|
|
2226
|
+
--z-index-layer: calc(var(--z-index-base) + 3);
|
|
2227
|
+
--z-index-edge: calc(var(--z-index-base) + 4);
|
|
2228
|
+
--z-index-app-bar: calc(var(--z-index-base) + 4);
|
|
2229
2229
|
}
|
|
2230
2230
|
|
|
2231
2231
|
.seed-app-screen__dim--transitionStyle_fadeFromBottomAndroid {
|
|
@@ -2278,10 +2278,10 @@
|
|
|
2278
2278
|
}
|
|
2279
2279
|
|
|
2280
2280
|
.seed-app-screen__root--transitionStyle_fadeIn {
|
|
2281
|
-
--z-index-dim: calc(var(--z-index-base)
|
|
2282
|
-
--z-index-layer: calc(var(--z-index-base)
|
|
2283
|
-
--z-index-edge: calc(var(--z-index-base)
|
|
2284
|
-
--z-index-app-bar: calc(var(--z-index-base)
|
|
2281
|
+
--z-index-dim: calc(var(--z-index-base) + 0);
|
|
2282
|
+
--z-index-layer: calc(var(--z-index-base) + 3);
|
|
2283
|
+
--z-index-edge: calc(var(--z-index-base) + 4);
|
|
2284
|
+
--z-index-app-bar: calc(var(--z-index-base) + 4);
|
|
2285
2285
|
}
|
|
2286
2286
|
|
|
2287
2287
|
.seed-app-screen__dim--transitionStyle_fadeIn {
|
|
@@ -2832,7 +2832,7 @@
|
|
|
2832
2832
|
.seed-bottom-sheet__positioner {
|
|
2833
2833
|
overscroll-behavior-y: none;
|
|
2834
2834
|
--sheet-z-index: 2;
|
|
2835
|
-
z-index: calc(var(--sheet-z-index)
|
|
2835
|
+
z-index: calc(var(--sheet-z-index) + var(--layer-index, 0));
|
|
2836
2836
|
justify-content: center;
|
|
2837
2837
|
align-items: flex-end;
|
|
2838
2838
|
display: flex;
|
|
@@ -2842,7 +2842,7 @@
|
|
|
2842
2842
|
|
|
2843
2843
|
.seed-bottom-sheet__backdrop {
|
|
2844
2844
|
background: var(--seed-color-bg-overlay);
|
|
2845
|
-
z-index: calc(var(--sheet-z-index)
|
|
2845
|
+
z-index: calc(var(--sheet-z-index) + var(--layer-index, 0));
|
|
2846
2846
|
position: fixed;
|
|
2847
2847
|
inset: 0;
|
|
2848
2848
|
}
|
|
@@ -2858,7 +2858,7 @@
|
|
|
2858
2858
|
.seed-bottom-sheet__content {
|
|
2859
2859
|
box-sizing: border-box;
|
|
2860
2860
|
word-break: break-all;
|
|
2861
|
-
z-index: calc(var(--sheet-z-index)
|
|
2861
|
+
z-index: calc(var(--sheet-z-index) + var(--layer-index, 0));
|
|
2862
2862
|
background: var(--seed-color-bg-layer-floating);
|
|
2863
2863
|
border-top-left-radius: var(--seed-radius-r6);
|
|
2864
2864
|
border-top-right-radius: var(--seed-radius-r6);
|
|
@@ -3065,13 +3065,13 @@
|
|
|
3065
3065
|
transform: translateX(-50%);
|
|
3066
3066
|
}
|
|
3067
3067
|
|
|
3068
|
-
@media (hover: hover) {
|
|
3068
|
+
@media (hover: hover) and (pointer: fine) {
|
|
3069
3069
|
.seed-bottom-sheet-handle__root:is(:hover, [data-hover]) {
|
|
3070
3070
|
background-color: var(--seed-color-palette-gray-500);
|
|
3071
3071
|
}
|
|
3072
3072
|
}
|
|
3073
3073
|
|
|
3074
|
-
@media (hover:
|
|
3074
|
+
@media not all and (hover: hover) and (pointer: fine) {
|
|
3075
3075
|
.seed-bottom-sheet-handle__root:is(:active, [data-active]) {
|
|
3076
3076
|
background-color: var(--seed-color-palette-gray-500);
|
|
3077
3077
|
}
|
|
@@ -3176,7 +3176,7 @@
|
|
|
3176
3176
|
cursor: pointer;
|
|
3177
3177
|
width: var(--seed-dimension-x10);
|
|
3178
3178
|
height: var(--seed-dimension-x10);
|
|
3179
|
-
margin: calc((var(--seed-dimension-x10)
|
|
3179
|
+
margin: calc((var(--seed-dimension-x10) - var(--seed-dimension-x4)) * -.5);
|
|
3180
3180
|
border-radius: var(--seed-radius-r2_5);
|
|
3181
3181
|
transition: outline-color var(--seed-duration-d3) var(--seed-timing-function-easing);
|
|
3182
3182
|
outline: var(--seed-dimension-x0_5) solid transparent;
|
|
@@ -3202,13 +3202,13 @@
|
|
|
3202
3202
|
--seed-suffix-icon-color: var(--seed-color-fg-neutral);
|
|
3203
3203
|
}
|
|
3204
3204
|
|
|
3205
|
-
@media (hover: hover) {
|
|
3205
|
+
@media (hover: hover) and (pointer: fine) {
|
|
3206
3206
|
.seed-callout__root--tone_neutral:is(button, a):is(:hover, [data-hover]) {
|
|
3207
3207
|
background-color: var(--seed-color-bg-neutral-weak-pressed);
|
|
3208
3208
|
}
|
|
3209
3209
|
}
|
|
3210
3210
|
|
|
3211
|
-
@media (hover:
|
|
3211
|
+
@media not all and (hover: hover) and (pointer: fine) {
|
|
3212
3212
|
.seed-callout__root--tone_neutral:is(button, a):is(:active, [data-active]) {
|
|
3213
3213
|
background-color: var(--seed-color-bg-neutral-weak-pressed);
|
|
3214
3214
|
}
|
|
@@ -3224,13 +3224,13 @@
|
|
|
3224
3224
|
--seed-suffix-icon-color: var(--seed-color-fg-informative-contrast);
|
|
3225
3225
|
}
|
|
3226
3226
|
|
|
3227
|
-
@media (hover: hover) {
|
|
3227
|
+
@media (hover: hover) and (pointer: fine) {
|
|
3228
3228
|
.seed-callout__root--tone_informative:is(button, a):is(:hover, [data-hover]) {
|
|
3229
3229
|
background-color: var(--seed-color-bg-informative-weak-pressed);
|
|
3230
3230
|
}
|
|
3231
3231
|
}
|
|
3232
3232
|
|
|
3233
|
-
@media (hover:
|
|
3233
|
+
@media not all and (hover: hover) and (pointer: fine) {
|
|
3234
3234
|
.seed-callout__root--tone_informative:is(button, a):is(:active, [data-active]) {
|
|
3235
3235
|
background-color: var(--seed-color-bg-informative-weak-pressed);
|
|
3236
3236
|
}
|
|
@@ -3246,13 +3246,13 @@
|
|
|
3246
3246
|
--seed-suffix-icon-color: var(--seed-color-fg-positive-contrast);
|
|
3247
3247
|
}
|
|
3248
3248
|
|
|
3249
|
-
@media (hover: hover) {
|
|
3249
|
+
@media (hover: hover) and (pointer: fine) {
|
|
3250
3250
|
.seed-callout__root--tone_positive:is(button, a):is(:hover, [data-hover]) {
|
|
3251
3251
|
background-color: var(--seed-color-bg-positive-weak-pressed);
|
|
3252
3252
|
}
|
|
3253
3253
|
}
|
|
3254
3254
|
|
|
3255
|
-
@media (hover:
|
|
3255
|
+
@media not all and (hover: hover) and (pointer: fine) {
|
|
3256
3256
|
.seed-callout__root--tone_positive:is(button, a):is(:active, [data-active]) {
|
|
3257
3257
|
background-color: var(--seed-color-bg-positive-weak-pressed);
|
|
3258
3258
|
}
|
|
@@ -3268,13 +3268,13 @@
|
|
|
3268
3268
|
--seed-suffix-icon-color: var(--seed-color-fg-warning-contrast);
|
|
3269
3269
|
}
|
|
3270
3270
|
|
|
3271
|
-
@media (hover: hover) {
|
|
3271
|
+
@media (hover: hover) and (pointer: fine) {
|
|
3272
3272
|
.seed-callout__root--tone_warning:is(button, a):is(:hover, [data-hover]) {
|
|
3273
3273
|
background-color: var(--seed-color-bg-warning-weak-pressed);
|
|
3274
3274
|
}
|
|
3275
3275
|
}
|
|
3276
3276
|
|
|
3277
|
-
@media (hover:
|
|
3277
|
+
@media not all and (hover: hover) and (pointer: fine) {
|
|
3278
3278
|
.seed-callout__root--tone_warning:is(button, a):is(:active, [data-active]) {
|
|
3279
3279
|
background-color: var(--seed-color-bg-warning-weak-pressed);
|
|
3280
3280
|
}
|
|
@@ -3290,13 +3290,13 @@
|
|
|
3290
3290
|
--seed-suffix-icon-color: var(--seed-color-fg-critical-contrast);
|
|
3291
3291
|
}
|
|
3292
3292
|
|
|
3293
|
-
@media (hover: hover) {
|
|
3293
|
+
@media (hover: hover) and (pointer: fine) {
|
|
3294
3294
|
.seed-callout__root--tone_critical:is(button, a):is(:hover, [data-hover]) {
|
|
3295
3295
|
background-color: var(--seed-color-bg-critical-weak-pressed);
|
|
3296
3296
|
}
|
|
3297
3297
|
}
|
|
3298
3298
|
|
|
3299
|
-
@media (hover:
|
|
3299
|
+
@media not all and (hover: hover) and (pointer: fine) {
|
|
3300
3300
|
.seed-callout__root--tone_critical:is(button, a):is(:active, [data-active]) {
|
|
3301
3301
|
background-color: var(--seed-color-bg-critical-weak-pressed);
|
|
3302
3302
|
}
|
|
@@ -3312,13 +3312,13 @@
|
|
|
3312
3312
|
--seed-suffix-icon-color: var(--seed-color-fg-neutral);
|
|
3313
3313
|
}
|
|
3314
3314
|
|
|
3315
|
-
@media (hover: hover) {
|
|
3315
|
+
@media (hover: hover) and (pointer: fine) {
|
|
3316
3316
|
.seed-callout__root--tone_magic:is(button, a):is(:hover, [data-hover]) {
|
|
3317
3317
|
background-image: linear-gradient(88deg, var(--seed-gradient-glow-magic-pressed));
|
|
3318
3318
|
}
|
|
3319
3319
|
}
|
|
3320
3320
|
|
|
3321
|
-
@media (hover:
|
|
3321
|
+
@media not all and (hover: hover) and (pointer: fine) {
|
|
3322
3322
|
.seed-callout__root--tone_magic:is(button, a):is(:active, [data-active]) {
|
|
3323
3323
|
background-image: linear-gradient(88deg, var(--seed-gradient-glow-magic-pressed));
|
|
3324
3324
|
}
|
|
@@ -3361,7 +3361,7 @@
|
|
|
3361
3361
|
|
|
3362
3362
|
.seed-checkbox__root--size_large {
|
|
3363
3363
|
min-height: var(--seed-dimension-x9);
|
|
3364
|
-
--checkmark-margin-top: calc((var(--seed-dimension-x9)
|
|
3364
|
+
--checkmark-margin-top: calc((var(--seed-dimension-x9) - var(--seed-dimension-x6)) / 2);
|
|
3365
3365
|
}
|
|
3366
3366
|
|
|
3367
3367
|
.seed-checkbox__label--size_large {
|
|
@@ -3372,7 +3372,7 @@
|
|
|
3372
3372
|
|
|
3373
3373
|
.seed-checkbox__root--size_medium {
|
|
3374
3374
|
min-height: var(--seed-dimension-x8);
|
|
3375
|
-
--checkmark-margin-top: calc((var(--seed-dimension-x8)
|
|
3375
|
+
--checkmark-margin-top: calc((var(--seed-dimension-x8) - var(--seed-dimension-x5)) / 2);
|
|
3376
3376
|
}
|
|
3377
3377
|
|
|
3378
3378
|
.seed-checkbox__label--size_medium {
|
|
@@ -3422,13 +3422,13 @@
|
|
|
3422
3422
|
border-width: 0;
|
|
3423
3423
|
}
|
|
3424
3424
|
|
|
3425
|
-
@media (hover: hover) {
|
|
3425
|
+
@media (hover: hover) and (pointer: fine) {
|
|
3426
3426
|
.seed-checkmark__root--variant_square:not(:is(:disabled, [disabled], [data-disabled])):is(:hover, [data-hover]) {
|
|
3427
3427
|
background: var(--seed-color-bg-transparent-pressed);
|
|
3428
3428
|
}
|
|
3429
3429
|
}
|
|
3430
3430
|
|
|
3431
|
-
@media (hover:
|
|
3431
|
+
@media not all and (hover: hover) and (pointer: fine) {
|
|
3432
3432
|
.seed-checkmark__root--variant_square:not(:is(:disabled, [disabled], [data-disabled])):is(:active, [data-active]) {
|
|
3433
3433
|
background: var(--seed-color-bg-transparent-pressed);
|
|
3434
3434
|
}
|
|
@@ -3447,13 +3447,13 @@
|
|
|
3447
3447
|
color: var(--seed-color-fg-disabled);
|
|
3448
3448
|
}
|
|
3449
3449
|
|
|
3450
|
-
@media (hover: hover) {
|
|
3450
|
+
@media (hover: hover) and (pointer: fine) {
|
|
3451
3451
|
.seed-checkmark__root--variant_ghost:not(:is(:disabled, [disabled], [data-disabled])):is(:hover, [data-hover]) {
|
|
3452
3452
|
background: var(--seed-color-bg-transparent-pressed);
|
|
3453
3453
|
}
|
|
3454
3454
|
}
|
|
3455
3455
|
|
|
3456
|
-
@media (hover:
|
|
3456
|
+
@media not all and (hover: hover) and (pointer: fine) {
|
|
3457
3457
|
.seed-checkmark__root--variant_ghost:not(:is(:disabled, [disabled], [data-disabled])):is(:active, [data-active]) {
|
|
3458
3458
|
background: var(--seed-color-bg-transparent-pressed);
|
|
3459
3459
|
}
|
|
@@ -3485,13 +3485,13 @@
|
|
|
3485
3485
|
background: var(--seed-color-bg-neutral-inverted);
|
|
3486
3486
|
}
|
|
3487
3487
|
|
|
3488
|
-
@media (hover: hover) {
|
|
3488
|
+
@media (hover: hover) and (pointer: fine) {
|
|
3489
3489
|
.seed-checkmark__root--variant_square-tone_neutral:not(:is(:disabled, [disabled], [data-disabled])):is(:checked, :indeterminate, [data-checked], [data-indeterminate]):is(:hover, [data-hover]) {
|
|
3490
3490
|
background: var(--seed-color-bg-neutral-inverted-pressed);
|
|
3491
3491
|
}
|
|
3492
3492
|
}
|
|
3493
3493
|
|
|
3494
|
-
@media (hover:
|
|
3494
|
+
@media not all and (hover: hover) and (pointer: fine) {
|
|
3495
3495
|
.seed-checkmark__root--variant_square-tone_neutral:not(:is(:disabled, [disabled], [data-disabled])):is(:checked, :indeterminate, [data-checked], [data-indeterminate]):is(:active, [data-active]) {
|
|
3496
3496
|
background: var(--seed-color-bg-neutral-inverted-pressed);
|
|
3497
3497
|
}
|
|
@@ -3505,13 +3505,13 @@
|
|
|
3505
3505
|
background: var(--seed-color-bg-brand-solid);
|
|
3506
3506
|
}
|
|
3507
3507
|
|
|
3508
|
-
@media (hover: hover) {
|
|
3508
|
+
@media (hover: hover) and (pointer: fine) {
|
|
3509
3509
|
.seed-checkmark__root--variant_square-tone_brand:not(:is(:disabled, [disabled], [data-disabled])):is(:checked, :indeterminate, [data-checked], [data-indeterminate]):is(:hover, [data-hover]) {
|
|
3510
3510
|
background: var(--seed-color-bg-brand-solid-pressed);
|
|
3511
3511
|
}
|
|
3512
3512
|
}
|
|
3513
3513
|
|
|
3514
|
-
@media (hover:
|
|
3514
|
+
@media not all and (hover: hover) and (pointer: fine) {
|
|
3515
3515
|
.seed-checkmark__root--variant_square-tone_brand:not(:is(:disabled, [disabled], [data-disabled])):is(:checked, :indeterminate, [data-checked], [data-indeterminate]):is(:active, [data-active]) {
|
|
3516
3516
|
background: var(--seed-color-bg-brand-solid-pressed);
|
|
3517
3517
|
}
|
|
@@ -3521,13 +3521,13 @@
|
|
|
3521
3521
|
color: var(--seed-color-palette-static-white);
|
|
3522
3522
|
}
|
|
3523
3523
|
|
|
3524
|
-
@media (hover: hover) {
|
|
3524
|
+
@media (hover: hover) and (pointer: fine) {
|
|
3525
3525
|
.seed-checkmark__root--variant_ghost-tone_neutral:not(:is(:disabled, [disabled], [data-disabled])):is(:checked, :indeterminate, [data-checked], [data-indeterminate]):is(:hover, [data-hover]) {
|
|
3526
3526
|
background: var(--seed-color-palette-gray-200);
|
|
3527
3527
|
}
|
|
3528
3528
|
}
|
|
3529
3529
|
|
|
3530
|
-
@media (hover:
|
|
3530
|
+
@media not all and (hover: hover) and (pointer: fine) {
|
|
3531
3531
|
.seed-checkmark__root--variant_ghost-tone_neutral:not(:is(:disabled, [disabled], [data-disabled])):is(:checked, :indeterminate, [data-checked], [data-indeterminate]):is(:active, [data-active]) {
|
|
3532
3532
|
background: var(--seed-color-palette-gray-200);
|
|
3533
3533
|
}
|
|
@@ -3537,13 +3537,13 @@
|
|
|
3537
3537
|
color: var(--seed-color-fg-neutral);
|
|
3538
3538
|
}
|
|
3539
3539
|
|
|
3540
|
-
@media (hover: hover) {
|
|
3540
|
+
@media (hover: hover) and (pointer: fine) {
|
|
3541
3541
|
.seed-checkmark__root--variant_ghost-tone_brand:not(:is(:disabled, [disabled], [data-disabled])):is(:checked, :indeterminate, [data-checked], [data-indeterminate]):is(:hover, [data-hover]) {
|
|
3542
3542
|
background: var(--seed-color-palette-carrot-200);
|
|
3543
3543
|
}
|
|
3544
3544
|
}
|
|
3545
3545
|
|
|
3546
|
-
@media (hover:
|
|
3546
|
+
@media not all and (hover: hover) and (pointer: fine) {
|
|
3547
3547
|
.seed-checkmark__root--variant_ghost-tone_brand:not(:is(:disabled, [disabled], [data-disabled])):is(:checked, :indeterminate, [data-checked], [data-indeterminate]):is(:active, [data-active]) {
|
|
3548
3548
|
background: var(--seed-color-palette-carrot-200);
|
|
3549
3549
|
}
|
|
@@ -3646,25 +3646,25 @@
|
|
|
3646
3646
|
--seed-icon-color: var(--seed-color-fg-neutral-inverted);
|
|
3647
3647
|
}
|
|
3648
3648
|
|
|
3649
|
-
@media (hover: hover) {
|
|
3649
|
+
@media (hover: hover) and (pointer: fine) {
|
|
3650
3650
|
.seed-chip__root--variant_solid:is(:hover, [data-hover]):not(:is(:disabled, [disabled], [data-disabled])) {
|
|
3651
3651
|
background: var(--seed-color-bg-neutral-weak-alpha-pressed);
|
|
3652
3652
|
}
|
|
3653
3653
|
}
|
|
3654
3654
|
|
|
3655
|
-
@media (hover:
|
|
3655
|
+
@media not all and (hover: hover) and (pointer: fine) {
|
|
3656
3656
|
.seed-chip__root--variant_solid:is(:active, [data-active]):not(:is(:disabled, [disabled], [data-disabled])) {
|
|
3657
3657
|
background: var(--seed-color-bg-neutral-weak-alpha-pressed);
|
|
3658
3658
|
}
|
|
3659
3659
|
}
|
|
3660
3660
|
|
|
3661
|
-
@media (hover: hover) {
|
|
3661
|
+
@media (hover: hover) and (pointer: fine) {
|
|
3662
3662
|
.seed-chip__root--variant_solid:is(:checked, [data-checked]):is(:hover, [data-hover]):not(:is(:disabled, [disabled], [data-disabled])) {
|
|
3663
3663
|
background: var(--seed-color-bg-neutral-inverted-pressed);
|
|
3664
3664
|
}
|
|
3665
3665
|
}
|
|
3666
3666
|
|
|
3667
|
-
@media (hover:
|
|
3667
|
+
@media not all and (hover: hover) and (pointer: fine) {
|
|
3668
3668
|
.seed-chip__root--variant_solid:is(:checked, [data-checked]):is(:active, [data-active]):not(:is(:disabled, [disabled], [data-disabled])) {
|
|
3669
3669
|
background: var(--seed-color-bg-neutral-inverted-pressed);
|
|
3670
3670
|
}
|
|
@@ -3692,13 +3692,13 @@
|
|
|
3692
3692
|
--seed-icon-color: var(--seed-color-fg-neutral);
|
|
3693
3693
|
}
|
|
3694
3694
|
|
|
3695
|
-
@media (hover: hover) {
|
|
3695
|
+
@media (hover: hover) and (pointer: fine) {
|
|
3696
3696
|
.seed-chip__root--variant_outlineStrong:is(:hover, [data-hover]):not(:is(:disabled, [disabled], [data-disabled])) {
|
|
3697
3697
|
background: var(--seed-color-bg-transparent-pressed);
|
|
3698
3698
|
}
|
|
3699
3699
|
}
|
|
3700
3700
|
|
|
3701
|
-
@media (hover:
|
|
3701
|
+
@media not all and (hover: hover) and (pointer: fine) {
|
|
3702
3702
|
.seed-chip__root--variant_outlineStrong:is(:active, [data-active]):not(:is(:disabled, [disabled], [data-disabled])) {
|
|
3703
3703
|
background: var(--seed-color-bg-transparent-pressed);
|
|
3704
3704
|
}
|
|
@@ -3709,13 +3709,13 @@
|
|
|
3709
3709
|
--seed-icon-color: var(--seed-color-fg-neutral-inverted);
|
|
3710
3710
|
}
|
|
3711
3711
|
|
|
3712
|
-
@media (hover: hover) {
|
|
3712
|
+
@media (hover: hover) and (pointer: fine) {
|
|
3713
3713
|
.seed-chip__root--variant_outlineStrong:is(:checked, [data-checked]):is(:hover, [data-hover]):not(:is(:disabled, [disabled], [data-disabled])) {
|
|
3714
3714
|
background: var(--seed-color-bg-neutral-inverted-pressed);
|
|
3715
3715
|
}
|
|
3716
3716
|
}
|
|
3717
3717
|
|
|
3718
|
-
@media (hover:
|
|
3718
|
+
@media not all and (hover: hover) and (pointer: fine) {
|
|
3719
3719
|
.seed-chip__root--variant_outlineStrong:is(:checked, [data-checked]):is(:active, [data-active]):not(:is(:disabled, [disabled], [data-disabled])) {
|
|
3720
3720
|
background: var(--seed-color-bg-neutral-inverted-pressed);
|
|
3721
3721
|
}
|
|
@@ -3743,13 +3743,13 @@
|
|
|
3743
3743
|
--seed-icon-color: var(--seed-color-fg-neutral);
|
|
3744
3744
|
}
|
|
3745
3745
|
|
|
3746
|
-
@media (hover: hover) {
|
|
3746
|
+
@media (hover: hover) and (pointer: fine) {
|
|
3747
3747
|
.seed-chip__root--variant_outlineWeak:is(:hover, [data-hover]):not(:is(:disabled, [disabled], [data-disabled])) {
|
|
3748
3748
|
background: var(--seed-color-bg-transparent-pressed);
|
|
3749
3749
|
}
|
|
3750
3750
|
}
|
|
3751
3751
|
|
|
3752
|
-
@media (hover:
|
|
3752
|
+
@media not all and (hover: hover) and (pointer: fine) {
|
|
3753
3753
|
.seed-chip__root--variant_outlineWeak:is(:active, [data-active]):not(:is(:disabled, [disabled], [data-disabled])) {
|
|
3754
3754
|
background: var(--seed-color-bg-transparent-pressed);
|
|
3755
3755
|
}
|
|
@@ -3760,13 +3760,13 @@
|
|
|
3760
3760
|
box-shadow: inset 0 0 0 1px var(--seed-color-stroke-neutral-contrast);
|
|
3761
3761
|
}
|
|
3762
3762
|
|
|
3763
|
-
@media (hover: hover) {
|
|
3763
|
+
@media (hover: hover) and (pointer: fine) {
|
|
3764
3764
|
.seed-chip__root--variant_outlineWeak:is(:checked, [data-checked]):is(:hover, [data-hover]):not(:is(:disabled, [disabled], [data-disabled])) {
|
|
3765
3765
|
background: var(--seed-color-bg-neutral-weak-pressed);
|
|
3766
3766
|
}
|
|
3767
3767
|
}
|
|
3768
3768
|
|
|
3769
|
-
@media (hover:
|
|
3769
|
+
@media not all and (hover: hover) and (pointer: fine) {
|
|
3770
3770
|
.seed-chip__root--variant_outlineWeak:is(:checked, [data-checked]):is(:active, [data-active]):not(:is(:disabled, [disabled], [data-disabled])) {
|
|
3771
3771
|
background: var(--seed-color-bg-neutral-weak-pressed);
|
|
3772
3772
|
}
|
|
@@ -3944,25 +3944,25 @@
|
|
|
3944
3944
|
color: var(--seed-color-fg-neutral-inverted);
|
|
3945
3945
|
}
|
|
3946
3946
|
|
|
3947
|
-
@media (hover: hover) {
|
|
3947
|
+
@media (hover: hover) and (pointer: fine) {
|
|
3948
3948
|
.seed-chip-tabs__trigger--variant_neutralSolid:is(:hover, [data-hover]) {
|
|
3949
3949
|
background-color: var(--seed-color-bg-neutral-weak-alpha-pressed);
|
|
3950
3950
|
}
|
|
3951
3951
|
}
|
|
3952
3952
|
|
|
3953
|
-
@media (hover:
|
|
3953
|
+
@media not all and (hover: hover) and (pointer: fine) {
|
|
3954
3954
|
.seed-chip-tabs__trigger--variant_neutralSolid:is(:active, [data-active]) {
|
|
3955
3955
|
background-color: var(--seed-color-bg-neutral-weak-alpha-pressed);
|
|
3956
3956
|
}
|
|
3957
3957
|
}
|
|
3958
3958
|
|
|
3959
|
-
@media (hover: hover) {
|
|
3959
|
+
@media (hover: hover) and (pointer: fine) {
|
|
3960
3960
|
.seed-chip-tabs__trigger--variant_neutralSolid:is([aria-selected="true"], [data-selected]):is(:hover, [data-hover]) {
|
|
3961
3961
|
background-color: var(--seed-color-bg-neutral-inverted-pressed);
|
|
3962
3962
|
}
|
|
3963
3963
|
}
|
|
3964
3964
|
|
|
3965
|
-
@media (hover:
|
|
3965
|
+
@media not all and (hover: hover) and (pointer: fine) {
|
|
3966
3966
|
.seed-chip-tabs__trigger--variant_neutralSolid:is([aria-selected="true"], [data-selected]):is(:active, [data-active]) {
|
|
3967
3967
|
background-color: var(--seed-color-bg-neutral-inverted-pressed);
|
|
3968
3968
|
}
|
|
@@ -3990,25 +3990,25 @@
|
|
|
3990
3990
|
border-color: #0000;
|
|
3991
3991
|
}
|
|
3992
3992
|
|
|
3993
|
-
@media (hover: hover) {
|
|
3993
|
+
@media (hover: hover) and (pointer: fine) {
|
|
3994
3994
|
.seed-chip-tabs__trigger--variant_neutralOutline:is(:hover, [data-hover]) {
|
|
3995
3995
|
background-color: var(--seed-color-bg-transparent-pressed);
|
|
3996
3996
|
}
|
|
3997
3997
|
}
|
|
3998
3998
|
|
|
3999
|
-
@media (hover:
|
|
3999
|
+
@media not all and (hover: hover) and (pointer: fine) {
|
|
4000
4000
|
.seed-chip-tabs__trigger--variant_neutralOutline:is(:active, [data-active]) {
|
|
4001
4001
|
background-color: var(--seed-color-bg-transparent-pressed);
|
|
4002
4002
|
}
|
|
4003
4003
|
}
|
|
4004
4004
|
|
|
4005
|
-
@media (hover: hover) {
|
|
4005
|
+
@media (hover: hover) and (pointer: fine) {
|
|
4006
4006
|
.seed-chip-tabs__trigger--variant_neutralOutline:is([aria-selected="true"], [data-selected]):is(:hover, [data-hover]) {
|
|
4007
4007
|
background-color: var(--seed-color-bg-neutral-inverted-pressed);
|
|
4008
4008
|
}
|
|
4009
4009
|
}
|
|
4010
4010
|
|
|
4011
|
-
@media (hover:
|
|
4011
|
+
@media not all and (hover: hover) and (pointer: fine) {
|
|
4012
4012
|
.seed-chip-tabs__trigger--variant_neutralOutline:is([aria-selected="true"], [data-selected]):is(:active, [data-active]) {
|
|
4013
4013
|
background-color: var(--seed-color-bg-neutral-inverted-pressed);
|
|
4014
4014
|
}
|
|
@@ -4034,25 +4034,25 @@
|
|
|
4034
4034
|
color: var(--seed-color-palette-static-white);
|
|
4035
4035
|
}
|
|
4036
4036
|
|
|
4037
|
-
@media (hover: hover) {
|
|
4037
|
+
@media (hover: hover) and (pointer: fine) {
|
|
4038
4038
|
.seed-chip-tabs__trigger--variant_brandSolid:is(:hover, [data-hover]) {
|
|
4039
4039
|
background-color: var(--seed-color-bg-neutral-weak-pressed);
|
|
4040
4040
|
}
|
|
4041
4041
|
}
|
|
4042
4042
|
|
|
4043
|
-
@media (hover:
|
|
4043
|
+
@media not all and (hover: hover) and (pointer: fine) {
|
|
4044
4044
|
.seed-chip-tabs__trigger--variant_brandSolid:is(:active, [data-active]) {
|
|
4045
4045
|
background-color: var(--seed-color-bg-neutral-weak-pressed);
|
|
4046
4046
|
}
|
|
4047
4047
|
}
|
|
4048
4048
|
|
|
4049
|
-
@media (hover: hover) {
|
|
4049
|
+
@media (hover: hover) and (pointer: fine) {
|
|
4050
4050
|
.seed-chip-tabs__trigger--variant_brandSolid:is([aria-selected="true"], [data-selected]):is(:hover, [data-hover]) {
|
|
4051
4051
|
background-color: var(--seed-color-bg-brand-solid-pressed);
|
|
4052
4052
|
}
|
|
4053
4053
|
}
|
|
4054
4054
|
|
|
4055
|
-
@media (hover:
|
|
4055
|
+
@media not all and (hover: hover) and (pointer: fine) {
|
|
4056
4056
|
.seed-chip-tabs__trigger--variant_brandSolid:is([aria-selected="true"], [data-selected]):is(:active, [data-active]) {
|
|
4057
4057
|
background-color: var(--seed-color-bg-brand-solid-pressed);
|
|
4058
4058
|
}
|
|
@@ -4181,13 +4181,13 @@
|
|
|
4181
4181
|
--range-color: var(--seed-color-fg-neutral-inverted);
|
|
4182
4182
|
}
|
|
4183
4183
|
|
|
4184
|
-
@media (hover: hover) {
|
|
4184
|
+
@media (hover: hover) and (pointer: fine) {
|
|
4185
4185
|
.seed-contextual-floating-button--variant_solid:is(:hover, [data-hover]) {
|
|
4186
4186
|
background: var(--seed-color-bg-neutral-inverted-pressed);
|
|
4187
4187
|
}
|
|
4188
4188
|
}
|
|
4189
4189
|
|
|
4190
|
-
@media (hover:
|
|
4190
|
+
@media not all and (hover: hover) and (pointer: fine) {
|
|
4191
4191
|
.seed-contextual-floating-button--variant_solid:is(:active, [data-active]) {
|
|
4192
4192
|
background: var(--seed-color-bg-neutral-inverted-pressed);
|
|
4193
4193
|
}
|
|
@@ -4213,13 +4213,13 @@
|
|
|
4213
4213
|
--range-color: var(--seed-color-fg-neutral);
|
|
4214
4214
|
}
|
|
4215
4215
|
|
|
4216
|
-
@media (hover: hover) {
|
|
4216
|
+
@media (hover: hover) and (pointer: fine) {
|
|
4217
4217
|
.seed-contextual-floating-button--variant_layer:is(:hover, [data-hover]) {
|
|
4218
4218
|
background: var(--seed-color-bg-layer-floating-pressed);
|
|
4219
4219
|
}
|
|
4220
4220
|
}
|
|
4221
4221
|
|
|
4222
|
-
@media (hover:
|
|
4222
|
+
@media not all and (hover: hover) and (pointer: fine) {
|
|
4223
4223
|
.seed-contextual-floating-button--variant_layer:is(:active, [data-active]) {
|
|
4224
4224
|
background: var(--seed-color-bg-layer-floating-pressed);
|
|
4225
4225
|
}
|
|
@@ -4353,7 +4353,7 @@
|
|
|
4353
4353
|
.seed-dialog__positioner {
|
|
4354
4354
|
overscroll-behavior-y: none;
|
|
4355
4355
|
--dialog-z-index: 2;
|
|
4356
|
-
z-index: calc(var(--dialog-z-index)
|
|
4356
|
+
z-index: calc(var(--dialog-z-index) + var(--layer-index, 0));
|
|
4357
4357
|
justify-content: center;
|
|
4358
4358
|
align-items: center;
|
|
4359
4359
|
display: flex;
|
|
@@ -4363,7 +4363,7 @@
|
|
|
4363
4363
|
|
|
4364
4364
|
.seed-dialog__backdrop {
|
|
4365
4365
|
background: var(--seed-color-bg-overlay);
|
|
4366
|
-
z-index: calc(var(--dialog-z-index)
|
|
4366
|
+
z-index: calc(var(--dialog-z-index) + var(--layer-index, 0));
|
|
4367
4367
|
position: fixed;
|
|
4368
4368
|
inset: 0;
|
|
4369
4369
|
}
|
|
@@ -4371,7 +4371,7 @@
|
|
|
4371
4371
|
.seed-dialog__content {
|
|
4372
4372
|
box-sizing: border-box;
|
|
4373
4373
|
word-break: break-all;
|
|
4374
|
-
z-index: calc(var(--dialog-z-index)
|
|
4374
|
+
z-index: calc(var(--dialog-z-index) + var(--layer-index, 0));
|
|
4375
4375
|
background: var(--seed-color-bg-layer-floating);
|
|
4376
4376
|
max-width: 272px;
|
|
4377
4377
|
margin: auto var(--seed-dimension-x8);
|
|
@@ -4463,7 +4463,7 @@
|
|
|
4463
4463
|
.seed-extended-action-sheet__positioner {
|
|
4464
4464
|
overscroll-behavior-y: none;
|
|
4465
4465
|
--sheet-z-index: 2;
|
|
4466
|
-
z-index: calc(var(--sheet-z-index)
|
|
4466
|
+
z-index: calc(var(--sheet-z-index) + var(--layer-index, 0));
|
|
4467
4467
|
justify-content: center;
|
|
4468
4468
|
align-items: flex-end;
|
|
4469
4469
|
display: flex;
|
|
@@ -4473,7 +4473,7 @@
|
|
|
4473
4473
|
|
|
4474
4474
|
.seed-extended-action-sheet__backdrop {
|
|
4475
4475
|
background: var(--seed-color-bg-overlay);
|
|
4476
|
-
z-index: calc(var(--sheet-z-index)
|
|
4476
|
+
z-index: calc(var(--sheet-z-index) + var(--layer-index, 0));
|
|
4477
4477
|
position: fixed;
|
|
4478
4478
|
inset: 0;
|
|
4479
4479
|
}
|
|
@@ -4502,7 +4502,7 @@
|
|
|
4502
4502
|
.seed-extended-action-sheet__content {
|
|
4503
4503
|
box-sizing: border-box;
|
|
4504
4504
|
word-break: break-all;
|
|
4505
|
-
z-index: calc(var(--sheet-z-index)
|
|
4505
|
+
z-index: calc(var(--sheet-z-index) + var(--layer-index, 0));
|
|
4506
4506
|
background: var(--seed-color-bg-layer-floating);
|
|
4507
4507
|
padding-inline: var(--seed-dimension-spacing-x-global-gutter);
|
|
4508
4508
|
padding-block: var(--seed-dimension-x4);
|
|
@@ -4774,7 +4774,7 @@
|
|
|
4774
4774
|
--seed-prefix-icon-size: var(--seed-dimension-x4);
|
|
4775
4775
|
--seed-prefix-icon-color: var(--seed-color-fg-neutral-subtle);
|
|
4776
4776
|
--seed-prefix-icon-margin-right: var(--seed-dimension-x1_5);
|
|
4777
|
-
--seed-prefix-icon-margin-top: calc((var(--seed-line-height-t4)
|
|
4777
|
+
--seed-prefix-icon-margin-top: calc((var(--seed-line-height-t4) - var(--seed-dimension-x4)) / 2);
|
|
4778
4778
|
display: flex;
|
|
4779
4779
|
}
|
|
4780
4780
|
|
|
@@ -4786,7 +4786,7 @@
|
|
|
4786
4786
|
--seed-prefix-icon-size: var(--seed-dimension-x4);
|
|
4787
4787
|
--seed-prefix-icon-color: var(--seed-color-fg-critical);
|
|
4788
4788
|
--seed-prefix-icon-margin-right: var(--seed-dimension-x1_5);
|
|
4789
|
-
--seed-prefix-icon-margin-top: calc((var(--seed-line-height-t4)
|
|
4789
|
+
--seed-prefix-icon-margin-top: calc((var(--seed-line-height-t4) - var(--seed-dimension-x4)) / 2);
|
|
4790
4790
|
display: flex;
|
|
4791
4791
|
}
|
|
4792
4792
|
|
|
@@ -4894,13 +4894,13 @@
|
|
|
4894
4894
|
overflow: hidden;
|
|
4895
4895
|
}
|
|
4896
4896
|
|
|
4897
|
-
@media (hover: hover) {
|
|
4897
|
+
@media (hover: hover) and (pointer: fine) {
|
|
4898
4898
|
.seed-floating-action-button__root:is(:hover, [data-hover]) {
|
|
4899
4899
|
background: var(--seed-color-bg-brand-solid-pressed);
|
|
4900
4900
|
}
|
|
4901
4901
|
}
|
|
4902
4902
|
|
|
4903
|
-
@media (hover:
|
|
4903
|
+
@media not all and (hover: hover) and (pointer: fine) {
|
|
4904
4904
|
.seed-floating-action-button__root:is(:active, [data-active]) {
|
|
4905
4905
|
background: var(--seed-color-bg-brand-solid-pressed);
|
|
4906
4906
|
}
|
|
@@ -4958,7 +4958,7 @@
|
|
|
4958
4958
|
|
|
4959
4959
|
.seed-help-bubble__positioner {
|
|
4960
4960
|
--popover-z-index: 99;
|
|
4961
|
-
z-index: calc(var(--popover-z-index)
|
|
4961
|
+
z-index: calc(var(--popover-z-index) + var(--z-index-offset, 0));
|
|
4962
4962
|
}
|
|
4963
4963
|
|
|
4964
4964
|
.seed-help-bubble__content {
|
|
@@ -5037,10 +5037,10 @@
|
|
|
5037
5037
|
.seed-help-bubble__closeButton {
|
|
5038
5038
|
cursor: pointer;
|
|
5039
5039
|
padding: calc((38px - var(--seed-dimension-x3_5)) / 2);
|
|
5040
|
-
margin-left: calc(var(--seed-dimension-x1)
|
|
5040
|
+
margin-left: calc(var(--seed-dimension-x1) - ((38px - var(--seed-dimension-x3_5)) / 2));
|
|
5041
5041
|
margin-right: calc(-1 * ((38px - var(--seed-dimension-x3_5)) / 2));
|
|
5042
|
-
margin-top: calc(-1 * ((38px - var(--seed-dimension-x3_5)) / 2)
|
|
5043
|
-
margin-bottom: calc(-1 * ((38px - var(--seed-dimension-x3_5)) / 2)
|
|
5042
|
+
margin-top: calc(-1 * ((38px - var(--seed-dimension-x3_5)) / 2) + var(--seed-dimension-x0_5));
|
|
5043
|
+
margin-bottom: calc(-1 * ((38px - var(--seed-dimension-x3_5)) / 2) + var(--seed-dimension-x0_5));
|
|
5044
5044
|
color: var(--seed-color-fg-neutral-inverted);
|
|
5045
5045
|
--seed-icon-size: var(--seed-dimension-x3_5);
|
|
5046
5046
|
--seed-icon-color: var(--seed-color-fg-neutral-inverted);
|
|
@@ -5095,11 +5095,19 @@
|
|
|
5095
5095
|
display: block;
|
|
5096
5096
|
}
|
|
5097
5097
|
|
|
5098
|
+
.seed-image-frame__content:not([data-loading-state="loaded"]) {
|
|
5099
|
+
display: none;
|
|
5100
|
+
}
|
|
5101
|
+
|
|
5098
5102
|
.seed-image-frame__fallback {
|
|
5099
5103
|
width: 100%;
|
|
5100
5104
|
height: 100%;
|
|
5101
5105
|
}
|
|
5102
5106
|
|
|
5107
|
+
.seed-image-frame__fallback[data-loading-state="loaded"] {
|
|
5108
|
+
display: none;
|
|
5109
|
+
}
|
|
5110
|
+
|
|
5103
5111
|
.seed-image-frame__root--stroke_true:after {
|
|
5104
5112
|
content: "";
|
|
5105
5113
|
pointer-events: none;
|
|
@@ -5153,10 +5161,10 @@
|
|
|
5153
5161
|
|
|
5154
5162
|
.seed-image-frame-reaction-button__root:before {
|
|
5155
5163
|
content: "";
|
|
5156
|
-
top: calc((var(--seed-dimension-x10)
|
|
5157
|
-
right: calc((var(--seed-dimension-x10)
|
|
5158
|
-
bottom: calc((var(--seed-dimension-x10)
|
|
5159
|
-
left: calc((var(--seed-dimension-x10)
|
|
5164
|
+
top: calc((var(--seed-dimension-x10) - var(--seed-dimension-x6)) / 2 * -1);
|
|
5165
|
+
right: calc((var(--seed-dimension-x10) - var(--seed-dimension-x6)) / 2 * -1);
|
|
5166
|
+
bottom: calc((var(--seed-dimension-x10) - var(--seed-dimension-x6)) / 2 * -1);
|
|
5167
|
+
left: calc((var(--seed-dimension-x10) - var(--seed-dimension-x6)) / 2 * -1);
|
|
5160
5168
|
outline: var(--seed-dimension-x0_5) solid transparent;
|
|
5161
5169
|
outline-offset: calc(var(--seed-dimension-x0_5) * -1);
|
|
5162
5170
|
transition: outline-color var(--seed-duration-d3) var(--seed-timing-function-easing);
|
|
@@ -5207,7 +5215,7 @@
|
|
|
5207
5215
|
padding-block: var(--seed-dimension-x2_5);
|
|
5208
5216
|
--seed-prefix-icon-size: var(--seed-dimension-x4);
|
|
5209
5217
|
--seed-prefix-icon-margin-right: var(--seed-dimension-x2);
|
|
5210
|
-
--seed-prefix-icon-margin-top: calc((var(--seed-dimension-x10)
|
|
5218
|
+
--seed-prefix-icon-margin-top: calc((var(--seed-dimension-x10) - var(--seed-dimension-x4)) * .5 - var(--seed-dimension-x2_5));
|
|
5211
5219
|
--seed-suffix-icon-size: var(--seed-dimension-x4);
|
|
5212
5220
|
--seed-suffix-icon-margin-left: var(--seed-dimension-x4);
|
|
5213
5221
|
--seed-suffix-icon-align-self: center;
|
|
@@ -5264,8 +5272,8 @@
|
|
|
5264
5272
|
.seed-inline-banner__closeButton {
|
|
5265
5273
|
width: var(--seed-dimension-x10);
|
|
5266
5274
|
height: var(--seed-dimension-x10);
|
|
5267
|
-
margin: calc((var(--seed-dimension-x10)
|
|
5268
|
-
margin-left: calc((var(--seed-dimension-x10)
|
|
5275
|
+
margin: calc((var(--seed-dimension-x10) - var(--seed-dimension-x4)) * -.5);
|
|
5276
|
+
margin-left: calc((var(--seed-dimension-x10) - var(--seed-dimension-x4)) * -.5 + var(--seed-dimension-x4));
|
|
5269
5277
|
--seed-suffix-icon-margin-left: initial;
|
|
5270
5278
|
cursor: pointer;
|
|
5271
5279
|
background-color: #0000;
|
|
@@ -5397,13 +5405,13 @@
|
|
|
5397
5405
|
background-color: var(--seed-color-bg-disabled);
|
|
5398
5406
|
}
|
|
5399
5407
|
|
|
5400
|
-
@media (hover: hover) {
|
|
5408
|
+
@media (hover: hover) and (pointer: fine) {
|
|
5401
5409
|
.seed-input-button__button:not([data-disabled]):not([data-readonly]):is(:hover, [data-hover]) {
|
|
5402
5410
|
background-color: var(--seed-color-bg-transparent-pressed);
|
|
5403
5411
|
}
|
|
5404
5412
|
}
|
|
5405
5413
|
|
|
5406
|
-
@media (hover:
|
|
5414
|
+
@media not all and (hover: hover) and (pointer: fine) {
|
|
5407
5415
|
.seed-input-button__button:not([data-disabled]):not([data-readonly]):is(:active, [data-active]) {
|
|
5408
5416
|
background-color: var(--seed-color-bg-transparent-pressed);
|
|
5409
5417
|
}
|
|
@@ -5693,7 +5701,7 @@
|
|
|
5693
5701
|
inset: 0;
|
|
5694
5702
|
}
|
|
5695
5703
|
|
|
5696
|
-
@media (hover: hover) {
|
|
5704
|
+
@media (hover: hover) and (pointer: fine) {
|
|
5697
5705
|
.seed-list-item__content:is(button, a):not(:is(:disabled, [disabled], [data-disabled])):is(:hover, [data-hover]):before {
|
|
5698
5706
|
background-color: var(--seed-color-bg-transparent-pressed);
|
|
5699
5707
|
left: var(--seed-dimension-x1_5);
|
|
@@ -5702,7 +5710,7 @@
|
|
|
5702
5710
|
}
|
|
5703
5711
|
}
|
|
5704
5712
|
|
|
5705
|
-
@media (hover:
|
|
5713
|
+
@media not all and (hover: hover) and (pointer: fine) {
|
|
5706
5714
|
.seed-list-item__content:is(button, a):not(:is(:disabled, [disabled], [data-disabled])):is(:active, [data-active]):before {
|
|
5707
5715
|
background-color: var(--seed-color-bg-transparent-pressed);
|
|
5708
5716
|
left: var(--seed-dimension-x1_5);
|
|
@@ -5711,7 +5719,7 @@
|
|
|
5711
5719
|
}
|
|
5712
5720
|
}
|
|
5713
5721
|
|
|
5714
|
-
@media (hover: hover) {
|
|
5722
|
+
@media (hover: hover) and (pointer: fine) {
|
|
5715
5723
|
.seed-list-item__content:not(:is(:disabled, [disabled], [data-disabled]))[data-hover]:before {
|
|
5716
5724
|
background-color: var(--seed-color-bg-transparent-pressed);
|
|
5717
5725
|
left: var(--seed-dimension-x1_5);
|
|
@@ -5720,7 +5728,7 @@
|
|
|
5720
5728
|
}
|
|
5721
5729
|
}
|
|
5722
5730
|
|
|
5723
|
-
@media (hover:
|
|
5731
|
+
@media not all and (hover: hover) and (pointer: fine) {
|
|
5724
5732
|
.seed-list-item__content:not(:is(:disabled, [disabled], [data-disabled]))[data-active]:before {
|
|
5725
5733
|
background-color: var(--seed-color-bg-transparent-pressed);
|
|
5726
5734
|
left: var(--seed-dimension-x1_5);
|
|
@@ -5756,25 +5764,25 @@
|
|
|
5756
5764
|
background-color: var(--seed-color-bg-brand-weak);
|
|
5757
5765
|
}
|
|
5758
5766
|
|
|
5759
|
-
@media (hover: hover) {
|
|
5767
|
+
@media (hover: hover) and (pointer: fine) {
|
|
5760
5768
|
.seed-list-item__content--highlighted_true:is(button, a):not(:is(:disabled, [disabled], [data-disabled])):is(:hover, [data-hover]):before {
|
|
5761
5769
|
background-color: var(--seed-color-bg-brand-weak-pressed);
|
|
5762
5770
|
}
|
|
5763
5771
|
}
|
|
5764
5772
|
|
|
5765
|
-
@media (hover:
|
|
5773
|
+
@media not all and (hover: hover) and (pointer: fine) {
|
|
5766
5774
|
.seed-list-item__content--highlighted_true:is(button, a):not(:is(:disabled, [disabled], [data-disabled])):is(:active, [data-active]):before {
|
|
5767
5775
|
background-color: var(--seed-color-bg-brand-weak-pressed);
|
|
5768
5776
|
}
|
|
5769
5777
|
}
|
|
5770
5778
|
|
|
5771
|
-
@media (hover: hover) {
|
|
5779
|
+
@media (hover: hover) and (pointer: fine) {
|
|
5772
5780
|
.seed-list-item__content--highlighted_true:not(:is(:disabled, [disabled], [data-disabled]))[data-hover]:before {
|
|
5773
5781
|
background-color: var(--seed-color-bg-brand-weak-pressed);
|
|
5774
5782
|
}
|
|
5775
5783
|
}
|
|
5776
5784
|
|
|
5777
|
-
@media (hover:
|
|
5785
|
+
@media not all and (hover: hover) and (pointer: fine) {
|
|
5778
5786
|
.seed-list-item__content--highlighted_true:not(:is(:disabled, [disabled], [data-disabled]))[data-active]:before {
|
|
5779
5787
|
background-color: var(--seed-color-bg-brand-weak-pressed);
|
|
5780
5788
|
}
|
|
@@ -5910,7 +5918,7 @@
|
|
|
5910
5918
|
.seed-menu-sheet__positioner {
|
|
5911
5919
|
overscroll-behavior-y: none;
|
|
5912
5920
|
--sheet-z-index: 2;
|
|
5913
|
-
z-index: calc(var(--sheet-z-index)
|
|
5921
|
+
z-index: calc(var(--sheet-z-index) + var(--layer-index, 0));
|
|
5914
5922
|
justify-content: center;
|
|
5915
5923
|
align-items: flex-end;
|
|
5916
5924
|
display: flex;
|
|
@@ -5920,7 +5928,7 @@
|
|
|
5920
5928
|
|
|
5921
5929
|
.seed-menu-sheet__backdrop {
|
|
5922
5930
|
background: var(--seed-color-bg-overlay);
|
|
5923
|
-
z-index: calc(var(--sheet-z-index)
|
|
5931
|
+
z-index: calc(var(--sheet-z-index) + var(--layer-index, 0));
|
|
5924
5932
|
position: fixed;
|
|
5925
5933
|
inset: 0;
|
|
5926
5934
|
}
|
|
@@ -5928,12 +5936,12 @@
|
|
|
5928
5936
|
.seed-menu-sheet__content {
|
|
5929
5937
|
box-sizing: border-box;
|
|
5930
5938
|
word-break: break-all;
|
|
5931
|
-
z-index: calc(var(--sheet-z-index)
|
|
5939
|
+
z-index: calc(var(--sheet-z-index) + var(--layer-index, 0));
|
|
5932
5940
|
background: var(--seed-color-bg-layer-floating);
|
|
5933
5941
|
padding-left: var(--seed-dimension-spacing-x-global-gutter);
|
|
5934
5942
|
padding-right: var(--seed-dimension-spacing-x-global-gutter);
|
|
5935
5943
|
padding-top: var(--seed-dimension-x4);
|
|
5936
|
-
padding-bottom: calc(var(--seed-dimension-x4)
|
|
5944
|
+
padding-bottom: calc(var(--seed-dimension-x4) + var(--seed-safe-area-bottom));
|
|
5937
5945
|
border-top-left-radius: var(--seed-radius-r5);
|
|
5938
5946
|
border-top-right-radius: var(--seed-radius-r5);
|
|
5939
5947
|
flex-direction: column;
|
|
@@ -6009,13 +6017,13 @@
|
|
|
6009
6017
|
display: flex;
|
|
6010
6018
|
}
|
|
6011
6019
|
|
|
6012
|
-
@media (hover: hover) {
|
|
6020
|
+
@media (hover: hover) and (pointer: fine) {
|
|
6013
6021
|
.seed-menu-sheet__closeButton:is(:hover, [data-hover]) {
|
|
6014
6022
|
background-color: var(--seed-color-bg-neutral-weak-pressed);
|
|
6015
6023
|
}
|
|
6016
6024
|
}
|
|
6017
6025
|
|
|
6018
|
-
@media (hover:
|
|
6026
|
+
@media not all and (hover: hover) and (pointer: fine) {
|
|
6019
6027
|
.seed-menu-sheet__closeButton:is(:active, [data-active]) {
|
|
6020
6028
|
background-color: var(--seed-color-bg-neutral-weak-pressed);
|
|
6021
6029
|
}
|
|
@@ -6089,13 +6097,13 @@
|
|
|
6089
6097
|
display: flex;
|
|
6090
6098
|
}
|
|
6091
6099
|
|
|
6092
|
-
@media (hover: hover) {
|
|
6100
|
+
@media (hover: hover) and (pointer: fine) {
|
|
6093
6101
|
.seed-menu-sheet-item__root:is(:hover, [data-hover]) {
|
|
6094
6102
|
background-color: var(--seed-color-bg-neutral-weak-pressed);
|
|
6095
6103
|
}
|
|
6096
6104
|
}
|
|
6097
6105
|
|
|
6098
|
-
@media (hover:
|
|
6106
|
+
@media not all and (hover: hover) and (pointer: fine) {
|
|
6099
6107
|
.seed-menu-sheet-item__root:is(:active, [data-active]) {
|
|
6100
6108
|
background-color: var(--seed-color-bg-neutral-weak-pressed);
|
|
6101
6109
|
}
|
|
@@ -6255,7 +6263,7 @@
|
|
|
6255
6263
|
padding-bottom: var(--seed-dimension-x2_5);
|
|
6256
6264
|
--seed-prefix-icon-size: var(--seed-dimension-x4);
|
|
6257
6265
|
--seed-prefix-icon-margin-right: var(--seed-dimension-x2);
|
|
6258
|
-
--seed-prefix-icon-margin-top: calc((var(--seed-dimension-x10)
|
|
6266
|
+
--seed-prefix-icon-margin-top: calc((var(--seed-dimension-x10) - var(--seed-dimension-x4)) * .5 - var(--seed-dimension-x2_5));
|
|
6259
6267
|
--seed-suffix-icon-size: var(--seed-dimension-x4);
|
|
6260
6268
|
--seed-suffix-icon-margin-left: var(--seed-dimension-x2);
|
|
6261
6269
|
--seed-suffix-icon-align-self: center;
|
|
@@ -6310,8 +6318,8 @@
|
|
|
6310
6318
|
|
|
6311
6319
|
.seed-page-banner__button {
|
|
6312
6320
|
cursor: pointer;
|
|
6313
|
-
margin: calc((var(--seed-dimension-x10)
|
|
6314
|
-
padding: calc((var(--seed-dimension-x10)
|
|
6321
|
+
margin: calc((var(--seed-dimension-x10) - var(--seed-line-height-t3)) * .5 * -1);
|
|
6322
|
+
padding: calc((var(--seed-dimension-x10) - var(--seed-line-height-t3)) * .5);
|
|
6315
6323
|
font-family: inherit;
|
|
6316
6324
|
font-size: var(--seed-font-size-t3);
|
|
6317
6325
|
line-height: var(--seed-line-height-t3);
|
|
@@ -6334,8 +6342,8 @@
|
|
|
6334
6342
|
.seed-page-banner__closeButton {
|
|
6335
6343
|
width: var(--seed-dimension-x10);
|
|
6336
6344
|
height: var(--seed-dimension-x10);
|
|
6337
|
-
margin: calc((var(--seed-dimension-x10)
|
|
6338
|
-
margin-left: calc((var(--seed-dimension-x10)
|
|
6345
|
+
margin: calc((var(--seed-dimension-x10) - var(--seed-dimension-x4)) * -.5);
|
|
6346
|
+
margin-left: calc((var(--seed-dimension-x10) - var(--seed-dimension-x4)) * -.5 + var(--seed-dimension-x2));
|
|
6339
6347
|
--seed-suffix-icon-margin-left: initial;
|
|
6340
6348
|
cursor: pointer;
|
|
6341
6349
|
border-radius: var(--seed-radius-r1);
|
|
@@ -6364,13 +6372,13 @@
|
|
|
6364
6372
|
--seed-suffix-icon-color: var(--seed-color-fg-neutral);
|
|
6365
6373
|
}
|
|
6366
6374
|
|
|
6367
|
-
@media (hover: hover) {
|
|
6375
|
+
@media (hover: hover) and (pointer: fine) {
|
|
6368
6376
|
.seed-page-banner__root--tone_neutral-variant_weak:is(button):is(:hover, [data-hover]) {
|
|
6369
6377
|
background-color: var(--seed-color-bg-neutral-weak-pressed);
|
|
6370
6378
|
}
|
|
6371
6379
|
}
|
|
6372
6380
|
|
|
6373
|
-
@media (hover:
|
|
6381
|
+
@media not all and (hover: hover) and (pointer: fine) {
|
|
6374
6382
|
.seed-page-banner__root--tone_neutral-variant_weak:is(button):is(:active, [data-active]) {
|
|
6375
6383
|
background-color: var(--seed-color-bg-neutral-weak-pressed);
|
|
6376
6384
|
}
|
|
@@ -6386,13 +6394,13 @@
|
|
|
6386
6394
|
--seed-suffix-icon-color: var(--seed-color-fg-neutral-inverted);
|
|
6387
6395
|
}
|
|
6388
6396
|
|
|
6389
|
-
@media (hover: hover) {
|
|
6397
|
+
@media (hover: hover) and (pointer: fine) {
|
|
6390
6398
|
.seed-page-banner__root--tone_neutral-variant_solid:is(button):is(:hover, [data-hover]) {
|
|
6391
6399
|
background-color: var(--seed-color-bg-neutral-inverted-pressed);
|
|
6392
6400
|
}
|
|
6393
6401
|
}
|
|
6394
6402
|
|
|
6395
|
-
@media (hover:
|
|
6403
|
+
@media not all and (hover: hover) and (pointer: fine) {
|
|
6396
6404
|
.seed-page-banner__root--tone_neutral-variant_solid:is(button):is(:active, [data-active]) {
|
|
6397
6405
|
background-color: var(--seed-color-bg-neutral-inverted-pressed);
|
|
6398
6406
|
}
|
|
@@ -6408,13 +6416,13 @@
|
|
|
6408
6416
|
--seed-suffix-icon-color: var(--seed-color-fg-informative-contrast);
|
|
6409
6417
|
}
|
|
6410
6418
|
|
|
6411
|
-
@media (hover: hover) {
|
|
6419
|
+
@media (hover: hover) and (pointer: fine) {
|
|
6412
6420
|
.seed-page-banner__root--tone_informative-variant_weak:is(button):is(:hover, [data-hover]) {
|
|
6413
6421
|
background-color: var(--seed-color-bg-informative-weak-pressed);
|
|
6414
6422
|
}
|
|
6415
6423
|
}
|
|
6416
6424
|
|
|
6417
|
-
@media (hover:
|
|
6425
|
+
@media not all and (hover: hover) and (pointer: fine) {
|
|
6418
6426
|
.seed-page-banner__root--tone_informative-variant_weak:is(button):is(:active, [data-active]) {
|
|
6419
6427
|
background-color: var(--seed-color-bg-informative-weak-pressed);
|
|
6420
6428
|
}
|
|
@@ -6430,13 +6438,13 @@
|
|
|
6430
6438
|
--seed-suffix-icon-color: var(--seed-color-palette-static-white);
|
|
6431
6439
|
}
|
|
6432
6440
|
|
|
6433
|
-
@media (hover: hover) {
|
|
6441
|
+
@media (hover: hover) and (pointer: fine) {
|
|
6434
6442
|
.seed-page-banner__root--tone_informative-variant_solid:is(button):is(:hover, [data-hover]) {
|
|
6435
6443
|
background-color: var(--seed-color-bg-informative-solid-pressed);
|
|
6436
6444
|
}
|
|
6437
6445
|
}
|
|
6438
6446
|
|
|
6439
|
-
@media (hover:
|
|
6447
|
+
@media not all and (hover: hover) and (pointer: fine) {
|
|
6440
6448
|
.seed-page-banner__root--tone_informative-variant_solid:is(button):is(:active, [data-active]) {
|
|
6441
6449
|
background-color: var(--seed-color-bg-informative-solid-pressed);
|
|
6442
6450
|
}
|
|
@@ -6452,13 +6460,13 @@
|
|
|
6452
6460
|
--seed-suffix-icon-color: var(--seed-color-fg-positive-contrast);
|
|
6453
6461
|
}
|
|
6454
6462
|
|
|
6455
|
-
@media (hover: hover) {
|
|
6463
|
+
@media (hover: hover) and (pointer: fine) {
|
|
6456
6464
|
.seed-page-banner__root--tone_positive-variant_weak:is(button):is(:hover, [data-hover]) {
|
|
6457
6465
|
background-color: var(--seed-color-bg-positive-weak-pressed);
|
|
6458
6466
|
}
|
|
6459
6467
|
}
|
|
6460
6468
|
|
|
6461
|
-
@media (hover:
|
|
6469
|
+
@media not all and (hover: hover) and (pointer: fine) {
|
|
6462
6470
|
.seed-page-banner__root--tone_positive-variant_weak:is(button):is(:active, [data-active]) {
|
|
6463
6471
|
background-color: var(--seed-color-bg-positive-weak-pressed);
|
|
6464
6472
|
}
|
|
@@ -6474,13 +6482,13 @@
|
|
|
6474
6482
|
--seed-suffix-icon-color: var(--seed-color-palette-static-white);
|
|
6475
6483
|
}
|
|
6476
6484
|
|
|
6477
|
-
@media (hover: hover) {
|
|
6485
|
+
@media (hover: hover) and (pointer: fine) {
|
|
6478
6486
|
.seed-page-banner__root--tone_positive-variant_solid:is(button):is(:hover, [data-hover]) {
|
|
6479
6487
|
background-color: var(--seed-color-bg-positive-solid-pressed);
|
|
6480
6488
|
}
|
|
6481
6489
|
}
|
|
6482
6490
|
|
|
6483
|
-
@media (hover:
|
|
6491
|
+
@media not all and (hover: hover) and (pointer: fine) {
|
|
6484
6492
|
.seed-page-banner__root--tone_positive-variant_solid:is(button):is(:active, [data-active]) {
|
|
6485
6493
|
background-color: var(--seed-color-bg-positive-solid-pressed);
|
|
6486
6494
|
}
|
|
@@ -6496,13 +6504,13 @@
|
|
|
6496
6504
|
--seed-suffix-icon-color: var(--seed-color-fg-warning-contrast);
|
|
6497
6505
|
}
|
|
6498
6506
|
|
|
6499
|
-
@media (hover: hover) {
|
|
6507
|
+
@media (hover: hover) and (pointer: fine) {
|
|
6500
6508
|
.seed-page-banner__root--tone_warning-variant_weak:is(button):is(:hover, [data-hover]) {
|
|
6501
6509
|
background-color: var(--seed-color-bg-warning-weak-pressed);
|
|
6502
6510
|
}
|
|
6503
6511
|
}
|
|
6504
6512
|
|
|
6505
|
-
@media (hover:
|
|
6513
|
+
@media not all and (hover: hover) and (pointer: fine) {
|
|
6506
6514
|
.seed-page-banner__root--tone_warning-variant_weak:is(button):is(:active, [data-active]) {
|
|
6507
6515
|
background-color: var(--seed-color-bg-warning-weak-pressed);
|
|
6508
6516
|
}
|
|
@@ -6518,13 +6526,13 @@
|
|
|
6518
6526
|
--seed-suffix-icon-color: var(--seed-color-palette-static-black-alpha-900);
|
|
6519
6527
|
}
|
|
6520
6528
|
|
|
6521
|
-
@media (hover: hover) {
|
|
6529
|
+
@media (hover: hover) and (pointer: fine) {
|
|
6522
6530
|
.seed-page-banner__root--tone_warning-variant_solid:is(button):is(:hover, [data-hover]) {
|
|
6523
6531
|
background-color: var(--seed-color-bg-warning-solid-pressed);
|
|
6524
6532
|
}
|
|
6525
6533
|
}
|
|
6526
6534
|
|
|
6527
|
-
@media (hover:
|
|
6535
|
+
@media not all and (hover: hover) and (pointer: fine) {
|
|
6528
6536
|
.seed-page-banner__root--tone_warning-variant_solid:is(button):is(:active, [data-active]) {
|
|
6529
6537
|
background-color: var(--seed-color-bg-warning-solid-pressed);
|
|
6530
6538
|
}
|
|
@@ -6540,13 +6548,13 @@
|
|
|
6540
6548
|
--seed-suffix-icon-color: var(--seed-color-fg-critical-contrast);
|
|
6541
6549
|
}
|
|
6542
6550
|
|
|
6543
|
-
@media (hover: hover) {
|
|
6551
|
+
@media (hover: hover) and (pointer: fine) {
|
|
6544
6552
|
.seed-page-banner__root--tone_critical-variant_weak:is(button):is(:hover, [data-hover]) {
|
|
6545
6553
|
background-color: var(--seed-color-bg-critical-weak-pressed);
|
|
6546
6554
|
}
|
|
6547
6555
|
}
|
|
6548
6556
|
|
|
6549
|
-
@media (hover:
|
|
6557
|
+
@media not all and (hover: hover) and (pointer: fine) {
|
|
6550
6558
|
.seed-page-banner__root--tone_critical-variant_weak:is(button):is(:active, [data-active]) {
|
|
6551
6559
|
background-color: var(--seed-color-bg-critical-weak-pressed);
|
|
6552
6560
|
}
|
|
@@ -6562,13 +6570,13 @@
|
|
|
6562
6570
|
--seed-suffix-icon-color: var(--seed-color-palette-static-white);
|
|
6563
6571
|
}
|
|
6564
6572
|
|
|
6565
|
-
@media (hover: hover) {
|
|
6573
|
+
@media (hover: hover) and (pointer: fine) {
|
|
6566
6574
|
.seed-page-banner__root--tone_critical-variant_solid:is(button):is(:hover, [data-hover]) {
|
|
6567
6575
|
background-color: var(--seed-color-bg-critical-solid-pressed);
|
|
6568
6576
|
}
|
|
6569
6577
|
}
|
|
6570
6578
|
|
|
6571
|
-
@media (hover:
|
|
6579
|
+
@media not all and (hover: hover) and (pointer: fine) {
|
|
6572
6580
|
.seed-page-banner__root--tone_critical-variant_solid:is(button):is(:active, [data-active]) {
|
|
6573
6581
|
background-color: var(--seed-color-bg-critical-solid-pressed);
|
|
6574
6582
|
}
|
|
@@ -6584,13 +6592,13 @@
|
|
|
6584
6592
|
--seed-suffix-icon-color: var(--seed-color-fg-neutral);
|
|
6585
6593
|
}
|
|
6586
6594
|
|
|
6587
|
-
@media (hover: hover) {
|
|
6595
|
+
@media (hover: hover) and (pointer: fine) {
|
|
6588
6596
|
.seed-page-banner__root--tone_magic-variant_weak:is(button):is(:hover, [data-hover]) {
|
|
6589
6597
|
background-image: linear-gradient(88deg, var(--seed-gradient-glow-magic-pressed));
|
|
6590
6598
|
}
|
|
6591
6599
|
}
|
|
6592
6600
|
|
|
6593
|
-
@media (hover:
|
|
6601
|
+
@media not all and (hover: hover) and (pointer: fine) {
|
|
6594
6602
|
.seed-page-banner__root--tone_magic-variant_weak:is(button):is(:active, [data-active]) {
|
|
6595
6603
|
background-image: linear-gradient(88deg, var(--seed-gradient-glow-magic-pressed));
|
|
6596
6604
|
}
|
|
@@ -6658,7 +6666,7 @@
|
|
|
6658
6666
|
}
|
|
6659
6667
|
|
|
6660
6668
|
.seed-pull-to-refresh__indicator {
|
|
6661
|
-
transform: translateY(min(calc(var(--ptr-displacement, 0)
|
|
6669
|
+
transform: translateY(min(calc(var(--ptr-displacement, 0) - var(--ptr-size)), 0px));
|
|
6662
6670
|
transition: transform var(--seed-duration-d6);
|
|
6663
6671
|
justify-content: center;
|
|
6664
6672
|
align-items: center;
|
|
@@ -6702,7 +6710,7 @@
|
|
|
6702
6710
|
|
|
6703
6711
|
.seed-radio__root--size_large {
|
|
6704
6712
|
min-height: var(--seed-dimension-x9);
|
|
6705
|
-
--radiomark-margin-top: calc((var(--seed-dimension-x9)
|
|
6713
|
+
--radiomark-margin-top: calc((var(--seed-dimension-x9) - var(--seed-dimension-x6)) / 2);
|
|
6706
6714
|
}
|
|
6707
6715
|
|
|
6708
6716
|
.seed-radio__label--size_large {
|
|
@@ -6713,7 +6721,7 @@
|
|
|
6713
6721
|
|
|
6714
6722
|
.seed-radio__root--size_medium {
|
|
6715
6723
|
min-height: var(--seed-dimension-x8);
|
|
6716
|
-
--radiomark-margin-top: calc((var(--seed-dimension-x8)
|
|
6724
|
+
--radiomark-margin-top: calc((var(--seed-dimension-x8) - var(--seed-dimension-x5)) / 2);
|
|
6717
6725
|
}
|
|
6718
6726
|
|
|
6719
6727
|
.seed-radio__label--size_medium {
|
|
@@ -6745,13 +6753,13 @@
|
|
|
6745
6753
|
position: relative;
|
|
6746
6754
|
}
|
|
6747
6755
|
|
|
6748
|
-
@media (hover: hover) {
|
|
6756
|
+
@media (hover: hover) and (pointer: fine) {
|
|
6749
6757
|
.seed-radiomark__root:not(:is(:disabled, [disabled], [data-disabled])):is(:hover, [data-hover]) {
|
|
6750
6758
|
background-color: var(--seed-color-bg-transparent-pressed);
|
|
6751
6759
|
}
|
|
6752
6760
|
}
|
|
6753
6761
|
|
|
6754
|
-
@media (hover:
|
|
6762
|
+
@media not all and (hover: hover) and (pointer: fine) {
|
|
6755
6763
|
.seed-radiomark__root:not(:is(:disabled, [disabled], [data-disabled])):is(:active, [data-active]) {
|
|
6756
6764
|
background-color: var(--seed-color-bg-transparent-pressed);
|
|
6757
6765
|
}
|
|
@@ -6793,13 +6801,13 @@
|
|
|
6793
6801
|
background-color: var(--seed-color-bg-neutral-inverted);
|
|
6794
6802
|
}
|
|
6795
6803
|
|
|
6796
|
-
@media (hover: hover) {
|
|
6804
|
+
@media (hover: hover) and (pointer: fine) {
|
|
6797
6805
|
.seed-radiomark__root--tone_neutral:not(:is(:disabled, [disabled], [data-disabled])):is(:checked, [data-checked]):is(:hover, [data-hover]) {
|
|
6798
6806
|
background-color: var(--seed-color-bg-neutral-inverted-pressed);
|
|
6799
6807
|
}
|
|
6800
6808
|
}
|
|
6801
6809
|
|
|
6802
|
-
@media (hover:
|
|
6810
|
+
@media not all and (hover: hover) and (pointer: fine) {
|
|
6803
6811
|
.seed-radiomark__root--tone_neutral:not(:is(:disabled, [disabled], [data-disabled])):is(:checked, [data-checked]):is(:active, [data-active]) {
|
|
6804
6812
|
background-color: var(--seed-color-bg-neutral-inverted-pressed);
|
|
6805
6813
|
}
|
|
@@ -6813,13 +6821,13 @@
|
|
|
6813
6821
|
background-color: var(--seed-color-bg-brand-solid);
|
|
6814
6822
|
}
|
|
6815
6823
|
|
|
6816
|
-
@media (hover: hover) {
|
|
6824
|
+
@media (hover: hover) and (pointer: fine) {
|
|
6817
6825
|
.seed-radiomark__root--tone_brand:not(:is(:disabled, [disabled], [data-disabled])):is(:checked, [data-checked]):is(:hover, [data-hover]) {
|
|
6818
6826
|
background-color: var(--seed-color-bg-brand-solid-pressed);
|
|
6819
6827
|
}
|
|
6820
6828
|
}
|
|
6821
6829
|
|
|
6822
|
-
@media (hover:
|
|
6830
|
+
@media not all and (hover: hover) and (pointer: fine) {
|
|
6823
6831
|
.seed-radiomark__root--tone_brand:not(:is(:disabled, [disabled], [data-disabled])):is(:checked, [data-checked]):is(:active, [data-active]) {
|
|
6824
6832
|
background-color: var(--seed-color-bg-brand-solid-pressed);
|
|
6825
6833
|
}
|
|
@@ -6896,13 +6904,13 @@
|
|
|
6896
6904
|
--seed-count-color: var(--seed-color-fg-neutral);
|
|
6897
6905
|
}
|
|
6898
6906
|
|
|
6899
|
-
@media (hover: hover) {
|
|
6907
|
+
@media (hover: hover) and (pointer: fine) {
|
|
6900
6908
|
.seed-reaction-button:is(:hover, [data-hover]) {
|
|
6901
6909
|
background: var(--seed-color-bg-transparent-pressed);
|
|
6902
6910
|
}
|
|
6903
6911
|
}
|
|
6904
6912
|
|
|
6905
|
-
@media (hover:
|
|
6913
|
+
@media not all and (hover: hover) and (pointer: fine) {
|
|
6906
6914
|
.seed-reaction-button:is(:active, [data-active]) {
|
|
6907
6915
|
background: var(--seed-color-bg-transparent-pressed);
|
|
6908
6916
|
}
|
|
@@ -6916,13 +6924,13 @@
|
|
|
6916
6924
|
--seed-count-color: var(--seed-color-fg-brand);
|
|
6917
6925
|
}
|
|
6918
6926
|
|
|
6919
|
-
@media (hover: hover) {
|
|
6927
|
+
@media (hover: hover) and (pointer: fine) {
|
|
6920
6928
|
.seed-reaction-button:is([aria-pressed="true"], [data-pressed]):is(:hover, [data-hover]) {
|
|
6921
6929
|
background: var(--seed-color-bg-transparent-pressed);
|
|
6922
6930
|
}
|
|
6923
6931
|
}
|
|
6924
6932
|
|
|
6925
|
-
@media (hover:
|
|
6933
|
+
@media not all and (hover: hover) and (pointer: fine) {
|
|
6926
6934
|
.seed-reaction-button:is([aria-pressed="true"], [data-pressed]):is(:active, [data-active]) {
|
|
6927
6935
|
background: var(--seed-color-bg-transparent-pressed);
|
|
6928
6936
|
}
|
|
@@ -7087,28 +7095,28 @@
|
|
|
7087
7095
|
box-shadow: inset 0 0 0 1px var(--seed-color-stroke-neutral-muted);
|
|
7088
7096
|
}
|
|
7089
7097
|
|
|
7090
|
-
@media (hover: hover) {
|
|
7098
|
+
@media (hover: hover) and (pointer: fine) {
|
|
7091
7099
|
.seed-segmented-control__item:not(:is(:disabled, [disabled], [data-disabled])):is(:checked, [data-checked]):is(:hover, [data-hover]) {
|
|
7092
7100
|
background-color: var(--seed-color-palette-gray-100);
|
|
7093
7101
|
box-shadow: inset 0 0 0 1px var(--seed-color-stroke-neutral-muted);
|
|
7094
7102
|
}
|
|
7095
7103
|
}
|
|
7096
7104
|
|
|
7097
|
-
@media (hover:
|
|
7105
|
+
@media not all and (hover: hover) and (pointer: fine) {
|
|
7098
7106
|
.seed-segmented-control__item:not(:is(:disabled, [disabled], [data-disabled])):is(:checked, [data-checked]):is(:active, [data-active]) {
|
|
7099
7107
|
background-color: var(--seed-color-palette-gray-100);
|
|
7100
7108
|
box-shadow: inset 0 0 0 1px var(--seed-color-stroke-neutral-muted);
|
|
7101
7109
|
}
|
|
7102
7110
|
}
|
|
7103
7111
|
|
|
7104
|
-
@media (hover: hover) {
|
|
7112
|
+
@media (hover: hover) and (pointer: fine) {
|
|
7105
7113
|
.seed-segmented-control__item:not(:is(:disabled, [disabled], [data-disabled])):not(:is(:checked, [data-checked])):is(:hover, [data-hover]) {
|
|
7106
7114
|
background-color: var(--seed-color-bg-neutral-weak-pressed);
|
|
7107
7115
|
box-shadow: inset 0 0 0 1px var(--seed-color-stroke-neutral-muted);
|
|
7108
7116
|
}
|
|
7109
7117
|
}
|
|
7110
7118
|
|
|
7111
|
-
@media (hover:
|
|
7119
|
+
@media not all and (hover: hover) and (pointer: fine) {
|
|
7112
7120
|
.seed-segmented-control__item:not(:is(:disabled, [disabled], [data-disabled])):not(:is(:checked, [data-checked])):is(:active, [data-active]) {
|
|
7113
7121
|
background-color: var(--seed-color-bg-neutral-weak-pressed);
|
|
7114
7122
|
box-shadow: inset 0 0 0 1px var(--seed-color-stroke-neutral-muted);
|
|
@@ -7137,13 +7145,13 @@
|
|
|
7137
7145
|
inset: 0;
|
|
7138
7146
|
}
|
|
7139
7147
|
|
|
7140
|
-
@media (hover: hover) {
|
|
7148
|
+
@media (hover: hover) and (pointer: fine) {
|
|
7141
7149
|
.seed-select-box__root:not(:is(:disabled, [disabled], [data-disabled])):is(:hover, [data-hover]) {
|
|
7142
7150
|
background-color: var(--seed-color-bg-transparent-pressed);
|
|
7143
7151
|
}
|
|
7144
7152
|
}
|
|
7145
7153
|
|
|
7146
|
-
@media (hover:
|
|
7154
|
+
@media not all and (hover: hover) and (pointer: fine) {
|
|
7147
7155
|
.seed-select-box__root:not(:is(:disabled, [disabled], [data-disabled])):is(:active, [data-active]) {
|
|
7148
7156
|
background-color: var(--seed-color-bg-transparent-pressed);
|
|
7149
7157
|
}
|
|
@@ -7283,13 +7291,13 @@
|
|
|
7283
7291
|
inset: 0;
|
|
7284
7292
|
}
|
|
7285
7293
|
|
|
7286
|
-
@media (hover: hover) {
|
|
7294
|
+
@media (hover: hover) and (pointer: fine) {
|
|
7287
7295
|
.seed-selectBoxCheckmark__icon:not(:is(:disabled, [disabled], [data-disabled])):is(:hover, [data-hover]) {
|
|
7288
7296
|
color: var(--seed-color-fg-neutral-subtle);
|
|
7289
7297
|
}
|
|
7290
7298
|
}
|
|
7291
7299
|
|
|
7292
|
-
@media (hover:
|
|
7300
|
+
@media not all and (hover: hover) and (pointer: fine) {
|
|
7293
7301
|
.seed-selectBoxCheckmark__icon:not(:is(:disabled, [disabled], [data-disabled])):is(:active, [data-active]) {
|
|
7294
7302
|
color: var(--seed-color-fg-neutral-subtle);
|
|
7295
7303
|
}
|
|
@@ -7587,12 +7595,12 @@
|
|
|
7587
7595
|
}
|
|
7588
7596
|
|
|
7589
7597
|
.seed-slider__valueIndicatorArrow[data-dir="ltr"] {
|
|
7590
|
-
left: calc(50% + (var(--thumb-offset)
|
|
7598
|
+
left: calc(50% + (var(--thumb-offset) - var(--indicator-label-offset)));
|
|
7591
7599
|
transform: translateX(-50%);
|
|
7592
7600
|
}
|
|
7593
7601
|
|
|
7594
7602
|
.seed-slider__valueIndicatorArrow[data-dir="rtl"] {
|
|
7595
|
-
right: calc(50% + (var(--thumb-offset)
|
|
7603
|
+
right: calc(50% + (var(--thumb-offset) - var(--indicator-label-offset)));
|
|
7596
7604
|
transform: translateX(50%);
|
|
7597
7605
|
}
|
|
7598
7606
|
|
|
@@ -7813,7 +7821,7 @@
|
|
|
7813
7821
|
z-index: 2147483647;
|
|
7814
7822
|
left: calc(env(safe-area-inset-left, 0px));
|
|
7815
7823
|
right: calc(env(safe-area-inset-right, 0px));
|
|
7816
|
-
bottom: calc(env(safe-area-inset-bottom, 0px)
|
|
7824
|
+
bottom: calc(env(safe-area-inset-bottom, 0px) + var(--snackbar-region-offset, 0px));
|
|
7817
7825
|
padding-left: var(--seed-dimension-x2);
|
|
7818
7826
|
padding-right: var(--seed-dimension-x2);
|
|
7819
7827
|
padding-top: var(--seed-dimension-x2);
|
|
@@ -7854,7 +7862,7 @@
|
|
|
7854
7862
|
.seed-switch__root--size_16 {
|
|
7855
7863
|
min-height: var(--seed-dimension-x6);
|
|
7856
7864
|
gap: var(--seed-dimension-x1_5);
|
|
7857
|
-
--switchmark-margin-top: calc((var(--seed-dimension-x6)
|
|
7865
|
+
--switchmark-margin-top: calc((var(--seed-dimension-x6) - 16px) / 2);
|
|
7858
7866
|
}
|
|
7859
7867
|
|
|
7860
7868
|
.seed-switch__label--size_16 {
|
|
@@ -7866,7 +7874,7 @@
|
|
|
7866
7874
|
.seed-switch__root--size_24 {
|
|
7867
7875
|
min-height: var(--seed-dimension-x6);
|
|
7868
7876
|
gap: var(--seed-dimension-x2);
|
|
7869
|
-
--switchmark-margin-top: calc((var(--seed-dimension-x6)
|
|
7877
|
+
--switchmark-margin-top: calc((var(--seed-dimension-x6) - 24px) / 2);
|
|
7870
7878
|
}
|
|
7871
7879
|
|
|
7872
7880
|
.seed-switch__label--size_24 {
|
|
@@ -7878,7 +7886,7 @@
|
|
|
7878
7886
|
.seed-switch__root--size_32 {
|
|
7879
7887
|
min-height: var(--seed-dimension-x8);
|
|
7880
7888
|
gap: var(--seed-dimension-x2_5);
|
|
7881
|
-
--switchmark-margin-top: calc((var(--seed-dimension-x8)
|
|
7889
|
+
--switchmark-margin-top: calc((var(--seed-dimension-x8) - 32px) / 2);
|
|
7882
7890
|
}
|
|
7883
7891
|
|
|
7884
7892
|
.seed-switch__label--size_32 {
|
|
@@ -7953,7 +7961,7 @@
|
|
|
7953
7961
|
}
|
|
7954
7962
|
|
|
7955
7963
|
.seed-switchmark__thumb--size_16:is(:checked, [data-checked]) {
|
|
7956
|
-
transform: scale(1)translateX(10px);
|
|
7964
|
+
transform: scale(1) translateX(10px);
|
|
7957
7965
|
}
|
|
7958
7966
|
|
|
7959
7967
|
.seed-switchmark__root--size_24 {
|
|
@@ -7968,7 +7976,7 @@
|
|
|
7968
7976
|
}
|
|
7969
7977
|
|
|
7970
7978
|
.seed-switchmark__thumb--size_24:is(:checked, [data-checked]) {
|
|
7971
|
-
transform: scale(1)translateX(14px);
|
|
7979
|
+
transform: scale(1) translateX(14px);
|
|
7972
7980
|
}
|
|
7973
7981
|
|
|
7974
7982
|
.seed-switchmark__root--size_32 {
|
|
@@ -7983,7 +7991,7 @@
|
|
|
7983
7991
|
}
|
|
7984
7992
|
|
|
7985
7993
|
.seed-switchmark__thumb--size_32:is(:checked, [data-checked]) {
|
|
7986
|
-
transform: scale(1)translateX(20px);
|
|
7994
|
+
transform: scale(1) translateX(20px);
|
|
7987
7995
|
}
|
|
7988
7996
|
|
|
7989
7997
|
.seed-tabs__root {
|
|
@@ -8100,8 +8108,8 @@
|
|
|
8100
8108
|
}
|
|
8101
8109
|
|
|
8102
8110
|
.seed-tabs__indicator--triggerLayout_fill {
|
|
8103
|
-
left: calc(var(--indicator-left, 0px)
|
|
8104
|
-
width: calc(var(--indicator-width, 0px)
|
|
8111
|
+
left: calc(var(--indicator-left, 0px) + var(--seed-dimension-spacing-x-global-gutter));
|
|
8112
|
+
width: calc(var(--indicator-width, 0px) - 2 * var(--seed-dimension-spacing-x-global-gutter));
|
|
8105
8113
|
}
|
|
8106
8114
|
|
|
8107
8115
|
.seed-tabs__trigger--triggerLayout_fill {
|
|
@@ -8120,8 +8128,8 @@
|
|
|
8120
8128
|
}
|
|
8121
8129
|
|
|
8122
8130
|
.seed-tabs__indicator--triggerLayout_hug {
|
|
8123
|
-
left: calc(var(--indicator-left, 0px)
|
|
8124
|
-
width: calc(var(--indicator-width, 0px)
|
|
8131
|
+
left: calc(var(--indicator-left, 0px) + 0px);
|
|
8132
|
+
width: calc(var(--indicator-width, 0px) - 2 * 0px);
|
|
8125
8133
|
}
|
|
8126
8134
|
|
|
8127
8135
|
.seed-tabs__trigger--triggerLayout_hug:is([aria-selected="true"], [data-selected])[data-ssr]:after {
|
|
@@ -8989,13 +8997,13 @@
|
|
|
8989
8997
|
--range-color: var(--seed-color-palette-static-white);
|
|
8990
8998
|
}
|
|
8991
8999
|
|
|
8992
|
-
@media (hover: hover) {
|
|
9000
|
+
@media (hover: hover) and (pointer: fine) {
|
|
8993
9001
|
.seed-toggle-button--variant_brandSolid:is(:hover, [data-hover]) {
|
|
8994
9002
|
background: var(--seed-color-bg-brand-solid-pressed);
|
|
8995
9003
|
}
|
|
8996
9004
|
}
|
|
8997
9005
|
|
|
8998
|
-
@media (hover:
|
|
9006
|
+
@media not all and (hover: hover) and (pointer: fine) {
|
|
8999
9007
|
.seed-toggle-button--variant_brandSolid:is(:active, [data-active]) {
|
|
9000
9008
|
background: var(--seed-color-bg-brand-solid-pressed);
|
|
9001
9009
|
}
|
|
@@ -9010,13 +9018,13 @@
|
|
|
9010
9018
|
--seed-suffix-icon-color: var(--seed-color-fg-neutral);
|
|
9011
9019
|
}
|
|
9012
9020
|
|
|
9013
|
-
@media (hover: hover) {
|
|
9021
|
+
@media (hover: hover) and (pointer: fine) {
|
|
9014
9022
|
.seed-toggle-button--variant_brandSolid:is([aria-pressed="true"], [data-pressed]):is(:hover, [data-hover]) {
|
|
9015
9023
|
background: var(--seed-color-bg-neutral-weak-pressed);
|
|
9016
9024
|
}
|
|
9017
9025
|
}
|
|
9018
9026
|
|
|
9019
|
-
@media (hover:
|
|
9027
|
+
@media not all and (hover: hover) and (pointer: fine) {
|
|
9020
9028
|
.seed-toggle-button--variant_brandSolid:is([aria-pressed="true"], [data-pressed]):is(:active, [data-active]) {
|
|
9021
9029
|
background: var(--seed-color-bg-neutral-weak-pressed);
|
|
9022
9030
|
}
|
|
@@ -9049,13 +9057,13 @@
|
|
|
9049
9057
|
--range-color: var(--seed-color-fg-neutral);
|
|
9050
9058
|
}
|
|
9051
9059
|
|
|
9052
|
-
@media (hover: hover) {
|
|
9060
|
+
@media (hover: hover) and (pointer: fine) {
|
|
9053
9061
|
.seed-toggle-button--variant_neutralWeak:is(:hover, [data-hover]) {
|
|
9054
9062
|
background: var(--seed-color-bg-neutral-weak-pressed);
|
|
9055
9063
|
}
|
|
9056
9064
|
}
|
|
9057
9065
|
|
|
9058
|
-
@media (hover:
|
|
9066
|
+
@media not all and (hover: hover) and (pointer: fine) {
|
|
9059
9067
|
.seed-toggle-button--variant_neutralWeak:is(:active, [data-active]) {
|
|
9060
9068
|
background: var(--seed-color-bg-neutral-weak-pressed);
|
|
9061
9069
|
}
|
|
@@ -9070,13 +9078,13 @@
|
|
|
9070
9078
|
--seed-suffix-icon-color: var(--seed-color-fg-neutral);
|
|
9071
9079
|
}
|
|
9072
9080
|
|
|
9073
|
-
@media (hover: hover) {
|
|
9081
|
+
@media (hover: hover) and (pointer: fine) {
|
|
9074
9082
|
.seed-toggle-button--variant_neutralWeak:is([aria-pressed="true"], [data-pressed]):is(:hover, [data-hover]) {
|
|
9075
9083
|
background: var(--seed-color-bg-neutral-weak-pressed);
|
|
9076
9084
|
}
|
|
9077
9085
|
}
|
|
9078
9086
|
|
|
9079
|
-
@media (hover:
|
|
9087
|
+
@media not all and (hover: hover) and (pointer: fine) {
|
|
9080
9088
|
.seed-toggle-button--variant_neutralWeak:is([aria-pressed="true"], [data-pressed]):is(:active, [data-active]) {
|
|
9081
9089
|
background: var(--seed-color-bg-neutral-weak-pressed);
|
|
9082
9090
|
}
|
|
@@ -9133,14 +9141,18 @@
|
|
|
9133
9141
|
@keyframes seed-enter {
|
|
9134
9142
|
from {
|
|
9135
9143
|
opacity: var(--seed-enter-opacity, 1);
|
|
9136
|
-
transform: translate3d(var(--seed-enter-translate-x, 0), var(--seed-enter-translate-y, 0), 0)
|
|
9144
|
+
transform: translate3d(var(--seed-enter-translate-x, 0), var(--seed-enter-translate-y, 0), 0)
|
|
9145
|
+
scale3d(var(--seed-enter-scale, 1), var(--seed-enter-scale, 1), var(--seed-enter-scale, 1))
|
|
9146
|
+
rotate(var(--seed-enter-rotate, 0));
|
|
9137
9147
|
}
|
|
9138
9148
|
}
|
|
9139
9149
|
|
|
9140
9150
|
@keyframes seed-exit {
|
|
9141
9151
|
to {
|
|
9142
9152
|
opacity: var(--seed-exit-opacity, 1);
|
|
9143
|
-
transform: translate3d(var(--seed-exit-translate-x, 0), var(--seed-exit-translate-y, 0), 0)
|
|
9153
|
+
transform: translate3d(var(--seed-exit-translate-x, 0), var(--seed-exit-translate-y, 0), 0)
|
|
9154
|
+
scale3d(var(--seed-exit-scale, 1), var(--seed-exit-scale, 1), var(--seed-exit-scale, 1))
|
|
9155
|
+
rotate(var(--seed-exit-rotate, 0));
|
|
9144
9156
|
}
|
|
9145
9157
|
}
|
|
9146
9158
|
|