@seed-design/css 2.5.0 → 2.6.1
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 +747 -96
- package/all.layered.css +747 -96
- package/all.layered.min.css +1 -1
- package/all.min.css +1 -1
- package/base.css +15 -0
- package/base.layered.css +15 -0
- package/base.layered.min.css +1 -1
- package/base.min.css +1 -1
- package/breakpoints/index.mjs +5 -0
- package/package.json +6 -1
- package/recipes/accordion.css +1 -1
- package/recipes/accordion.layered.css +1 -1
- package/recipes/action-button.css +3 -13
- package/recipes/action-button.layered.css +4 -17
- package/recipes/attachment-input-item.css +15 -3
- package/recipes/attachment-input-item.layered.css +24 -8
- package/recipes/attachment-input-trigger.css +6 -1
- package/recipes/attachment-input-trigger.layered.css +10 -3
- package/recipes/bottom-sheet.css +7 -0
- package/recipes/bottom-sheet.layered.css +11 -2
- package/recipes/callout.css +43 -4
- package/recipes/callout.layered.css +57 -6
- package/recipes/checkmark.css +6 -1
- package/recipes/checkmark.layered.css +10 -3
- package/recipes/chip-tabs.css +6 -1
- package/recipes/chip-tabs.layered.css +10 -3
- package/recipes/chip.css +6 -3
- package/recipes/chip.layered.css +10 -5
- package/recipes/content-dialog.css +4 -1
- package/recipes/content-dialog.layered.css +5 -1
- package/recipes/contextual-floating-button.css +6 -1
- package/recipes/contextual-floating-button.layered.css +8 -1
- package/recipes/date-picker.css +49 -4
- package/recipes/date-picker.layered.css +53 -5
- package/recipes/floating-action-button.css +6 -1
- package/recipes/floating-action-button.layered.css +8 -1
- package/recipes/help-bubble.css +8 -2
- package/recipes/help-bubble.layered.css +12 -4
- package/recipes/image-frame-reaction-button.css +6 -0
- package/recipes/image-frame-reaction-button.layered.css +8 -0
- package/recipes/input-button.css +6 -1
- package/recipes/input-button.layered.css +10 -3
- package/recipes/list-item.css +6 -0
- package/recipes/list-item.layered.css +6 -0
- package/recipes/menu-sheet.css +7 -1
- package/recipes/menu-sheet.layered.css +9 -1
- package/recipes/menu.css +1 -1
- package/recipes/menu.layered.css +1 -1
- package/recipes/page-banner.css +58 -4
- package/recipes/page-banner.layered.css +79 -8
- package/recipes/pagination-button.css +68 -0
- package/recipes/pagination-button.d.ts +19 -0
- package/recipes/pagination-button.layered.css +80 -0
- package/recipes/pagination-button.layered.mjs +22 -0
- package/recipes/pagination-button.mjs +22 -0
- package/recipes/pagination-page-item.css +99 -0
- package/recipes/pagination-page-item.d.ts +19 -0
- package/recipes/pagination-page-item.layered.css +118 -0
- package/recipes/pagination-page-item.layered.mjs +22 -0
- package/recipes/pagination-page-item.mjs +22 -0
- package/recipes/pull-to-refresh.css +1 -1
- package/recipes/pull-to-refresh.layered.css +1 -1
- package/recipes/quantity-picker.css +8 -2
- package/recipes/quantity-picker.layered.css +10 -2
- package/recipes/radiomark.css +6 -1
- package/recipes/radiomark.layered.css +10 -3
- package/recipes/reaction-button.css +4 -1
- package/recipes/reaction-button.layered.css +5 -1
- package/recipes/select-box.css +3 -3
- package/recipes/select-box.layered.css +3 -3
- package/recipes/select.css +1 -1
- package/recipes/select.layered.css +1 -1
- package/recipes/side-panel.css +6 -1
- package/recipes/side-panel.layered.css +12 -5
- package/recipes/snackbar.css +7 -1
- package/recipes/snackbar.layered.css +9 -1
- package/recipes/switchmark.css +4 -1
- package/recipes/switchmark.layered.css +5 -1
- package/recipes/tabs.css +4 -1
- package/recipes/tabs.layered.css +5 -1
- package/recipes/toggle-button.css +4 -1
- package/recipes/toggle-button.layered.css +5 -1
- package/recipes/wheel-picker-public.css +121 -0
- package/recipes/wheel-picker-public.d.ts +24 -0
- package/recipes/wheel-picker-public.layered.css +140 -0
- package/recipes/wheel-picker-public.layered.mjs +63 -0
- package/recipes/wheel-picker-public.mjs +63 -0
- package/recipes/wheel-picker.css +1 -1
- package/recipes/wheel-picker.layered.css +1 -1
- package/scale-feedback/index.d.ts +3 -0
- package/scale-feedback/index.mjs +33 -0
- package/vars/color/stroke.d.ts +3 -3
- package/vars/component/accordion-item.d.ts +1 -1
- package/vars/component/accordion-item.mjs +1 -1
- package/vars/component/action-button.d.ts +1 -23
- package/vars/component/action-button.mjs +1 -23
- package/vars/component/bottom-sheet.d.ts +1 -1
- package/vars/component/bottom-sheet.mjs +1 -1
- package/vars/component/callout-close-button.d.ts +81 -0
- package/vars/component/callout-close-button.mjs +63 -0
- package/vars/component/callout.d.ts +1 -2
- package/vars/component/callout.mjs +1 -2
- package/vars/component/checkbox.d.ts +3 -0
- package/vars/component/help-bubble.d.ts +4 -1
- package/vars/component/help-bubble.mjs +3 -1
- package/vars/component/index.d.ts +6 -1
- package/vars/component/index.mjs +6 -1
- package/vars/component/list-item.d.ts +2 -6
- package/vars/component/list-item.mjs +2 -5
- package/vars/component/page-banner-close-button.d.ts +133 -0
- package/vars/component/page-banner-close-button.mjs +99 -0
- package/vars/component/page-banner.d.ts +0 -1
- package/vars/component/page-banner.mjs +0 -1
- package/vars/component/pagination-button.d.ts +33 -0
- package/vars/component/pagination-button.mjs +33 -0
- package/vars/component/pagination-page-item.d.ts +54 -0
- package/vars/component/pagination-page-item.mjs +54 -0
- package/vars/component/radio.d.ts +3 -0
- package/vars/component/select-box.d.ts +2 -2
- package/vars/component/select-box.mjs +2 -2
- package/vars/component/snackbar.d.ts +1 -1
- package/vars/component/snackbar.mjs +1 -1
- package/vars/component/switch.d.ts +3 -0
- package/vars/component/switchmark.d.ts +2 -0
- package/vars/component/wheel-picker.d.ts +72 -0
- package/vars/component/wheel-picker.mjs +72 -0
package/all.css
CHANGED
|
@@ -23,6 +23,8 @@
|
|
|
23
23
|
--seed-font-size-limit-max: 1.5;
|
|
24
24
|
--seed-line-height-limit-min: .8;
|
|
25
25
|
--seed-line-height-limit-max: 1.5;
|
|
26
|
+
--seed-feedback-scale: 1;
|
|
27
|
+
--seed-feedback-scale-transition: scale var(--seed-duration-pressed-scale) var(--seed-timing-function-pressed-scale);
|
|
26
28
|
}
|
|
27
29
|
|
|
28
30
|
[data-seed-platform="ios"] {
|
|
@@ -380,6 +382,19 @@
|
|
|
380
382
|
display: block;
|
|
381
383
|
}
|
|
382
384
|
|
|
385
|
+
.seed-scale-feedback {
|
|
386
|
+
--seed-dynamic-scale-basis: max(var(--seed-element-height), var(--seed-element-width) / 4, 24);
|
|
387
|
+
--seed-dynamic-scale: calc((var(--seed-dynamic-scale-basis) - 2) / var(--seed-dynamic-scale-basis));
|
|
388
|
+
--seed-feedback-scale: var(--seed-dynamic-scale, 1);
|
|
389
|
+
scale: 1;
|
|
390
|
+
}
|
|
391
|
+
|
|
392
|
+
@media (prefers-reduced-motion: reduce) {
|
|
393
|
+
.seed-scale-feedback {
|
|
394
|
+
--seed-feedback-scale: 1;
|
|
395
|
+
}
|
|
396
|
+
}
|
|
397
|
+
|
|
383
398
|
:root, [data-seed-color-mode="system"] {
|
|
384
399
|
--lightningcss-light: initial;
|
|
385
400
|
--lightningcss-dark: ;
|
|
@@ -1108,7 +1123,7 @@
|
|
|
1108
1123
|
}
|
|
1109
1124
|
|
|
1110
1125
|
.seed-accordion__item--variant_separated {
|
|
1111
|
-
box-shadow: inset 0 0 0 1px var(--seed-color-stroke-neutral-
|
|
1126
|
+
box-shadow: inset 0 0 0 1px var(--seed-color-stroke-neutral-weak);
|
|
1112
1127
|
border-radius: var(--seed-radius-r3);
|
|
1113
1128
|
overflow: hidden;
|
|
1114
1129
|
}
|
|
@@ -1328,9 +1343,12 @@
|
|
|
1328
1343
|
cursor: not-allowed;
|
|
1329
1344
|
}
|
|
1330
1345
|
|
|
1346
|
+
.seed-action-button:not(:is(:disabled, [disabled], [data-disabled])):is(:active, [data-active]) {
|
|
1347
|
+
scale: var(--seed-feedback-scale);
|
|
1348
|
+
}
|
|
1349
|
+
|
|
1331
1350
|
.seed-action-button {
|
|
1332
1351
|
transition: background-color var(--seed-duration-color-transition) var(--seed-timing-function-easing), scale var(--seed-duration-pressed-scale) var(--seed-timing-function-pressed-scale), outline-color var(--seed-duration-d3) var(--seed-timing-function-easing);
|
|
1333
|
-
scale: 1;
|
|
1334
1352
|
}
|
|
1335
1353
|
|
|
1336
1354
|
.seed-action-button--variant_brandSolid {
|
|
@@ -1598,10 +1616,6 @@
|
|
|
1598
1616
|
--seed-icon-size: var(--seed-dimension-x3_5);
|
|
1599
1617
|
}
|
|
1600
1618
|
|
|
1601
|
-
.seed-action-button--size_xsmall:not(:is(:disabled, [disabled], [data-disabled])):is(:active, [data-active]) {
|
|
1602
|
-
scale: var(--seed-scale-s95);
|
|
1603
|
-
}
|
|
1604
|
-
|
|
1605
1619
|
.seed-action-button--size_small {
|
|
1606
1620
|
height: var(--seed-dimension-x9);
|
|
1607
1621
|
border-radius: var(--seed-radius-r2);
|
|
@@ -1612,10 +1626,6 @@
|
|
|
1612
1626
|
--seed-icon-size: var(--seed-dimension-x4);
|
|
1613
1627
|
}
|
|
1614
1628
|
|
|
1615
|
-
.seed-action-button--size_small:not(:is(:disabled, [disabled], [data-disabled])):is(:active, [data-active]) {
|
|
1616
|
-
scale: var(--seed-scale-s97);
|
|
1617
|
-
}
|
|
1618
|
-
|
|
1619
1629
|
.seed-action-button--size_medium {
|
|
1620
1630
|
height: var(--seed-dimension-x10);
|
|
1621
1631
|
border-radius: var(--seed-radius-r2);
|
|
@@ -1626,10 +1636,6 @@
|
|
|
1626
1636
|
--seed-icon-size: 18px;
|
|
1627
1637
|
}
|
|
1628
1638
|
|
|
1629
|
-
.seed-action-button--size_medium:not(:is(:disabled, [disabled], [data-disabled])):is(:active, [data-active]) {
|
|
1630
|
-
scale: var(--seed-scale-s97);
|
|
1631
|
-
}
|
|
1632
|
-
|
|
1633
1639
|
.seed-action-button--size_large {
|
|
1634
1640
|
height: var(--seed-dimension-x13);
|
|
1635
1641
|
border-radius: var(--seed-radius-r3);
|
|
@@ -1640,10 +1646,6 @@
|
|
|
1640
1646
|
--seed-icon-size: 22px;
|
|
1641
1647
|
}
|
|
1642
1648
|
|
|
1643
|
-
.seed-action-button--size_large:not(:is(:disabled, [disabled], [data-disabled])):is(:active, [data-active]) {
|
|
1644
|
-
scale: var(--seed-scale-s98);
|
|
1645
|
-
}
|
|
1646
|
-
|
|
1647
1649
|
.seed-action-button--size_xsmall-layout_withText {
|
|
1648
1650
|
gap: var(--seed-dimension-x1);
|
|
1649
1651
|
--seed-box-padding-left: var(--seed-dimension-x3_5);
|
|
@@ -2856,6 +2858,7 @@
|
|
|
2856
2858
|
background: var(--seed-color-bg-layer-floating);
|
|
2857
2859
|
border-top-left-radius: var(--seed-radius-r6);
|
|
2858
2860
|
border-top-right-radius: var(--seed-radius-r6);
|
|
2861
|
+
max-width: 480px;
|
|
2859
2862
|
padding-bottom: var(--seed-safe-area-bottom);
|
|
2860
2863
|
touch-action: none;
|
|
2861
2864
|
will-change: transform;
|
|
@@ -2966,8 +2969,6 @@
|
|
|
2966
2969
|
border-radius: var(--seed-radius-full);
|
|
2967
2970
|
background: var(--seed-color-bg-neutral-weak);
|
|
2968
2971
|
cursor: pointer;
|
|
2969
|
-
--seed-icon-size: 14px;
|
|
2970
|
-
--seed-icon-color: var(--seed-color-fg-neutral);
|
|
2971
2972
|
border: none;
|
|
2972
2973
|
justify-content: center;
|
|
2973
2974
|
align-items: center;
|
|
@@ -2977,6 +2978,16 @@
|
|
|
2977
2978
|
position: absolute;
|
|
2978
2979
|
}
|
|
2979
2980
|
|
|
2981
|
+
.seed-bottom-sheet__closeButton:is(:active, [data-active]) {
|
|
2982
|
+
scale: var(--seed-feedback-scale);
|
|
2983
|
+
}
|
|
2984
|
+
|
|
2985
|
+
.seed-bottom-sheet__closeButton {
|
|
2986
|
+
transition: scale var(--seed-duration-pressed-scale) var(--seed-timing-function-pressed-scale);
|
|
2987
|
+
--seed-icon-size: 14px;
|
|
2988
|
+
--seed-icon-color: var(--seed-color-fg-neutral);
|
|
2989
|
+
}
|
|
2990
|
+
|
|
2980
2991
|
.seed-bottom-sheet__closeButton:after {
|
|
2981
2992
|
content: "";
|
|
2982
2993
|
border-radius: var(--seed-radius-r1);
|
|
@@ -3126,7 +3137,14 @@
|
|
|
3126
3137
|
|
|
3127
3138
|
.seed-callout__root:is(button, a) {
|
|
3128
3139
|
cursor: pointer;
|
|
3129
|
-
transition: outline-color var(--seed-duration-d3) var(--seed-timing-function-easing);
|
|
3140
|
+
transition: scale var(--seed-duration-pressed-scale) var(--seed-timing-function-pressed-scale), outline-color var(--seed-duration-d3) var(--seed-timing-function-easing);
|
|
3141
|
+
}
|
|
3142
|
+
|
|
3143
|
+
.seed-callout__root:is(button, a):is(:active, [data-active]) {
|
|
3144
|
+
scale: var(--seed-feedback-scale);
|
|
3145
|
+
}
|
|
3146
|
+
|
|
3147
|
+
.seed-callout__root:is(button, a) {
|
|
3130
3148
|
outline: var(--seed-dimension-x0_5) solid transparent;
|
|
3131
3149
|
outline-offset: var(--seed-dimension-x0_5);
|
|
3132
3150
|
}
|
|
@@ -3187,15 +3205,13 @@
|
|
|
3187
3205
|
}
|
|
3188
3206
|
|
|
3189
3207
|
.seed-callout__closeButton {
|
|
3208
|
+
background-color: var(--seed-color-bg-transparent);
|
|
3190
3209
|
cursor: pointer;
|
|
3191
3210
|
width: var(--seed-dimension-x10);
|
|
3192
3211
|
height: var(--seed-dimension-x10);
|
|
3193
3212
|
margin: calc((var(--seed-dimension-x10) - var(--seed-dimension-x4)) * -.5);
|
|
3194
|
-
border-radius: var(--seed-radius-
|
|
3195
|
-
|
|
3196
|
-
outline: var(--seed-dimension-x0_5) solid transparent;
|
|
3197
|
-
outline-offset: var(--seed-dimension-x0_5);
|
|
3198
|
-
background-color: #0000;
|
|
3213
|
+
border-radius: var(--seed-radius-r2);
|
|
3214
|
+
--seed-suffix-icon-size: var(--seed-dimension-x4);
|
|
3199
3215
|
border: none;
|
|
3200
3216
|
flex-grow: 0;
|
|
3201
3217
|
flex-shrink: 0;
|
|
@@ -3205,11 +3221,33 @@
|
|
|
3205
3221
|
display: flex;
|
|
3206
3222
|
}
|
|
3207
3223
|
|
|
3224
|
+
.seed-callout__closeButton:is(:active, [data-active]) {
|
|
3225
|
+
scale: var(--seed-feedback-scale);
|
|
3226
|
+
}
|
|
3227
|
+
|
|
3228
|
+
.seed-callout__closeButton {
|
|
3229
|
+
transition: background-color var(--seed-duration-color-transition) var(--seed-timing-function-easing), scale var(--seed-duration-pressed-scale) var(--seed-timing-function-pressed-scale), outline-color var(--seed-duration-d3) var(--seed-timing-function-easing);
|
|
3230
|
+
outline: var(--seed-dimension-x0_5) solid transparent;
|
|
3231
|
+
outline-offset: var(--seed-dimension-x0_5);
|
|
3232
|
+
}
|
|
3233
|
+
|
|
3208
3234
|
.seed-callout__closeButton:is(:focus-visible, [data-focus-visible]) {
|
|
3209
3235
|
outline: var(--seed-dimension-x0_5) solid var(--seed-color-stroke-focus-ring);
|
|
3210
3236
|
outline-offset: var(--seed-dimension-x0_5);
|
|
3211
3237
|
}
|
|
3212
3238
|
|
|
3239
|
+
@media (hover: hover) and (pointer: fine) {
|
|
3240
|
+
.seed-callout__closeButton:is(:hover, [data-hover]) {
|
|
3241
|
+
background-color: var(--seed-color-bg-transparent-pressed);
|
|
3242
|
+
}
|
|
3243
|
+
}
|
|
3244
|
+
|
|
3245
|
+
@media not all and (hover: hover) and (pointer: fine) {
|
|
3246
|
+
.seed-callout__closeButton:is(:active, [data-active]) {
|
|
3247
|
+
background-color: var(--seed-color-bg-transparent-pressed);
|
|
3248
|
+
}
|
|
3249
|
+
}
|
|
3250
|
+
|
|
3213
3251
|
.seed-callout__root--tone_neutral {
|
|
3214
3252
|
background-color: var(--seed-color-bg-neutral-weak);
|
|
3215
3253
|
--seed-prefix-icon-color: var(--seed-color-fg-neutral);
|
|
@@ -3232,6 +3270,10 @@
|
|
|
3232
3270
|
color: var(--seed-color-fg-neutral);
|
|
3233
3271
|
}
|
|
3234
3272
|
|
|
3273
|
+
.seed-callout__closeButton--tone_neutral {
|
|
3274
|
+
--seed-suffix-icon-color: var(--seed-color-fg-neutral);
|
|
3275
|
+
}
|
|
3276
|
+
|
|
3235
3277
|
.seed-callout__root--tone_informative {
|
|
3236
3278
|
background-color: var(--seed-color-bg-informative-weak);
|
|
3237
3279
|
--seed-prefix-icon-color: var(--seed-color-fg-informative-contrast);
|
|
@@ -3254,6 +3296,10 @@
|
|
|
3254
3296
|
color: var(--seed-color-fg-informative-contrast);
|
|
3255
3297
|
}
|
|
3256
3298
|
|
|
3299
|
+
.seed-callout__closeButton--tone_informative {
|
|
3300
|
+
--seed-suffix-icon-color: var(--seed-color-fg-informative-contrast);
|
|
3301
|
+
}
|
|
3302
|
+
|
|
3257
3303
|
.seed-callout__root--tone_positive {
|
|
3258
3304
|
background-color: var(--seed-color-bg-positive-weak);
|
|
3259
3305
|
--seed-prefix-icon-color: var(--seed-color-fg-positive-contrast);
|
|
@@ -3276,6 +3322,10 @@
|
|
|
3276
3322
|
color: var(--seed-color-fg-positive-contrast);
|
|
3277
3323
|
}
|
|
3278
3324
|
|
|
3325
|
+
.seed-callout__closeButton--tone_positive {
|
|
3326
|
+
--seed-suffix-icon-color: var(--seed-color-fg-positive-contrast);
|
|
3327
|
+
}
|
|
3328
|
+
|
|
3279
3329
|
.seed-callout__root--tone_warning {
|
|
3280
3330
|
background-color: var(--seed-color-bg-warning-weak);
|
|
3281
3331
|
--seed-prefix-icon-color: var(--seed-color-fg-warning-contrast);
|
|
@@ -3298,6 +3348,10 @@
|
|
|
3298
3348
|
color: var(--seed-color-fg-warning-contrast);
|
|
3299
3349
|
}
|
|
3300
3350
|
|
|
3351
|
+
.seed-callout__closeButton--tone_warning {
|
|
3352
|
+
--seed-suffix-icon-color: var(--seed-color-fg-warning-contrast);
|
|
3353
|
+
}
|
|
3354
|
+
|
|
3301
3355
|
.seed-callout__root--tone_critical {
|
|
3302
3356
|
background-color: var(--seed-color-bg-critical-weak);
|
|
3303
3357
|
--seed-prefix-icon-color: var(--seed-color-fg-critical-contrast);
|
|
@@ -3320,6 +3374,10 @@
|
|
|
3320
3374
|
color: var(--seed-color-fg-critical-contrast);
|
|
3321
3375
|
}
|
|
3322
3376
|
|
|
3377
|
+
.seed-callout__closeButton--tone_critical {
|
|
3378
|
+
--seed-suffix-icon-color: var(--seed-color-fg-critical-contrast);
|
|
3379
|
+
}
|
|
3380
|
+
|
|
3323
3381
|
.seed-callout__root--tone_magic {
|
|
3324
3382
|
background-image: linear-gradient(88deg, var(--seed-gradient-glow-magic));
|
|
3325
3383
|
--seed-prefix-icon-color: var(--seed-color-fg-neutral);
|
|
@@ -3342,6 +3400,10 @@
|
|
|
3342
3400
|
color: var(--seed-color-fg-neutral);
|
|
3343
3401
|
}
|
|
3344
3402
|
|
|
3403
|
+
.seed-callout__closeButton--tone_magic {
|
|
3404
|
+
--seed-suffix-icon-color: var(--seed-color-fg-neutral);
|
|
3405
|
+
}
|
|
3406
|
+
|
|
3345
3407
|
.seed-checkbox__root {
|
|
3346
3408
|
vertical-align: top;
|
|
3347
3409
|
isolation: isolate;
|
|
@@ -3404,13 +3466,20 @@
|
|
|
3404
3466
|
.seed-checkmark__root {
|
|
3405
3467
|
box-sizing: border-box;
|
|
3406
3468
|
margin-top: var(--checkmark-margin-top, 0);
|
|
3407
|
-
transition: background-color var(--seed-duration-color-transition) var(--seed-timing-function-easing), outline-color var(--seed-duration-d3) var(--seed-timing-function-easing);
|
|
3408
|
-
outline: var(--seed-focus-ring, var(--seed-dimension-x0_5) solid transparent);
|
|
3409
|
-
outline-offset: var(--seed-dimension-x0_5);
|
|
3410
3469
|
flex: none;
|
|
3411
3470
|
position: relative;
|
|
3412
3471
|
}
|
|
3413
3472
|
|
|
3473
|
+
.seed-checkmark__root:not(:is(:disabled, [disabled], [data-disabled])):is(:active, [data-active]) {
|
|
3474
|
+
scale: var(--seed-checkmark-feedback-scale, var(--seed-feedback-scale));
|
|
3475
|
+
}
|
|
3476
|
+
|
|
3477
|
+
.seed-checkmark__root {
|
|
3478
|
+
transition: background-color var(--seed-duration-color-transition) var(--seed-timing-function-easing), scale var(--seed-duration-pressed-scale) var(--seed-timing-function-pressed-scale), outline-color var(--seed-duration-d3) var(--seed-timing-function-easing);
|
|
3479
|
+
outline: var(--seed-focus-ring, var(--seed-dimension-x0_5) solid transparent);
|
|
3480
|
+
outline-offset: var(--seed-dimension-x0_5);
|
|
3481
|
+
}
|
|
3482
|
+
|
|
3414
3483
|
.seed-checkmark__root:is(:focus-visible, [data-focus-visible]) {
|
|
3415
3484
|
outline: var(--seed-focus-ring, var(--seed-dimension-x0_5) solid var(--seed-color-stroke-focus-ring));
|
|
3416
3485
|
outline-offset: var(--seed-dimension-x0_5);
|
|
@@ -3596,21 +3665,26 @@
|
|
|
3596
3665
|
-webkit-font-smoothing: antialiased;
|
|
3597
3666
|
-moz-osx-font-smoothing: grayscale;
|
|
3598
3667
|
border-radius: var(--seed-radius-full);
|
|
3599
|
-
transition-duration: var(--seed-duration-color-transition);
|
|
3600
|
-
transition-timing-function: var(--seed-timing-function-easing);
|
|
3601
|
-
outline: var(--seed-dimension-x0_5) solid transparent;
|
|
3602
|
-
outline-offset: var(--seed-dimension-x0_5);
|
|
3603
3668
|
border: none;
|
|
3604
3669
|
flex-shrink: 0;
|
|
3605
3670
|
justify-content: center;
|
|
3606
3671
|
align-items: center;
|
|
3607
3672
|
font-family: inherit;
|
|
3608
3673
|
line-height: 1;
|
|
3609
|
-
transition-property: background-color, color, border-color, box-shadow, outline-color;
|
|
3610
3674
|
display: inline-flex;
|
|
3611
3675
|
position: relative;
|
|
3612
3676
|
}
|
|
3613
3677
|
|
|
3678
|
+
.seed-chip__root:not(:is(:disabled, [disabled], [data-disabled])):is(:active, [data-active]) {
|
|
3679
|
+
scale: var(--seed-feedback-scale);
|
|
3680
|
+
}
|
|
3681
|
+
|
|
3682
|
+
.seed-chip__root {
|
|
3683
|
+
transition: background-color var(--seed-duration-color-transition) var(--seed-timing-function-easing), color var(--seed-duration-color-transition) var(--seed-timing-function-easing), border-color var(--seed-duration-color-transition) var(--seed-timing-function-easing), box-shadow var(--seed-duration-color-transition) var(--seed-timing-function-easing), outline-color var(--seed-duration-color-transition) var(--seed-timing-function-easing), scale var(--seed-duration-pressed-scale) var(--seed-timing-function-pressed-scale);
|
|
3684
|
+
outline: var(--seed-dimension-x0_5) solid transparent;
|
|
3685
|
+
outline-offset: var(--seed-dimension-x0_5);
|
|
3686
|
+
}
|
|
3687
|
+
|
|
3614
3688
|
.seed-chip__root:is(:focus-visible, [data-focus-visible]) {
|
|
3615
3689
|
outline: var(--seed-dimension-x0_5) solid var(--seed-color-stroke-focus-ring);
|
|
3616
3690
|
outline-offset: var(--seed-dimension-x0_5);
|
|
@@ -3918,9 +3992,6 @@
|
|
|
3918
3992
|
border-radius: var(--seed-radius-full);
|
|
3919
3993
|
font-family: inherit;
|
|
3920
3994
|
font-weight: var(--seed-font-weight-medium);
|
|
3921
|
-
transition: background-color var(--seed-duration-color-transition) var(--seed-timing-function-easing), outline-color var(--seed-duration-d3) var(--seed-timing-function-easing);
|
|
3922
|
-
outline: var(--seed-dimension-x0_5) solid transparent;
|
|
3923
|
-
outline-offset: var(--seed-dimension-x0_5);
|
|
3924
3995
|
border: none;
|
|
3925
3996
|
flex-shrink: 0;
|
|
3926
3997
|
justify-content: center;
|
|
@@ -3928,6 +3999,16 @@
|
|
|
3928
3999
|
display: flex;
|
|
3929
4000
|
}
|
|
3930
4001
|
|
|
4002
|
+
.seed-chip-tabs__trigger:not(:is(:disabled, [disabled], [data-disabled])):is(:active, [data-active]) {
|
|
4003
|
+
scale: var(--seed-feedback-scale);
|
|
4004
|
+
}
|
|
4005
|
+
|
|
4006
|
+
.seed-chip-tabs__trigger {
|
|
4007
|
+
transition: background-color var(--seed-duration-color-transition) var(--seed-timing-function-easing), scale var(--seed-duration-pressed-scale) var(--seed-timing-function-pressed-scale), outline-color var(--seed-duration-d3) var(--seed-timing-function-easing);
|
|
4008
|
+
outline: var(--seed-dimension-x0_5) solid transparent;
|
|
4009
|
+
outline-offset: var(--seed-dimension-x0_5);
|
|
4010
|
+
}
|
|
4011
|
+
|
|
3931
4012
|
.seed-chip-tabs__trigger:is(:focus-visible, [data-focus-visible]) {
|
|
3932
4013
|
outline: var(--seed-dimension-x0_5) solid var(--seed-color-stroke-focus-ring);
|
|
3933
4014
|
outline-offset: var(--seed-dimension-x0_5);
|
|
@@ -4264,7 +4345,7 @@
|
|
|
4264
4345
|
background: var(--seed-color-bg-transparent);
|
|
4265
4346
|
border-radius: var(--seed-radius-r3);
|
|
4266
4347
|
cursor: pointer;
|
|
4267
|
-
transition: background var(--seed-duration-color-transition) var(--seed-timing-function-easing), outline-color var(--seed-duration-d3) var(--seed-timing-function-easing);
|
|
4348
|
+
transition: background var(--seed-duration-color-transition) var(--seed-timing-function-easing), scale var(--seed-duration-pressed-scale) var(--seed-timing-function-pressed-scale), outline-color var(--seed-duration-d3) var(--seed-timing-function-easing);
|
|
4268
4349
|
--seed-icon-size: 22px;
|
|
4269
4350
|
--seed-icon-color: var(--seed-color-fg-neutral-subtle);
|
|
4270
4351
|
outline: var(--seed-dimension-x0_5) solid transparent;
|
|
@@ -4283,6 +4364,10 @@
|
|
|
4283
4364
|
outline-offset: var(--seed-dimension-x0_5);
|
|
4284
4365
|
}
|
|
4285
4366
|
|
|
4367
|
+
.seed-content-dialog__closeButton:is(:active, [data-active]) {
|
|
4368
|
+
scale: var(--seed-feedback-scale);
|
|
4369
|
+
}
|
|
4370
|
+
|
|
4286
4371
|
@media (hover: hover) and (pointer: fine) {
|
|
4287
4372
|
.seed-content-dialog__closeButton:is(:hover, [data-hover]) {
|
|
4288
4373
|
background: var(--seed-color-bg-transparent-pressed);
|
|
@@ -4375,7 +4460,14 @@
|
|
|
4375
4460
|
--seed-icon-size: 22px;
|
|
4376
4461
|
--size: 16px;
|
|
4377
4462
|
--thickness: 2px;
|
|
4378
|
-
|
|
4463
|
+
}
|
|
4464
|
+
|
|
4465
|
+
.seed-contextual-floating-button:not(:is(:disabled, [disabled], [data-disabled])):is(:active, [data-active]) {
|
|
4466
|
+
scale: var(--seed-feedback-scale);
|
|
4467
|
+
}
|
|
4468
|
+
|
|
4469
|
+
.seed-contextual-floating-button {
|
|
4470
|
+
transition: background-color var(--seed-duration-color-transition) var(--seed-timing-function-easing), scale var(--seed-duration-pressed-scale) var(--seed-timing-function-pressed-scale), outline-color var(--seed-duration-d3) var(--seed-timing-function-easing);
|
|
4379
4471
|
}
|
|
4380
4472
|
|
|
4381
4473
|
.seed-contextual-floating-button--variant_solid {
|
|
@@ -4556,8 +4648,29 @@
|
|
|
4556
4648
|
|
|
4557
4649
|
.seed-date-picker__root {
|
|
4558
4650
|
box-sizing: border-box;
|
|
4651
|
+
--seed-box-height-base: auto;
|
|
4652
|
+
--seed-box-height-sm: var(--seed-box-height-base, initial);
|
|
4653
|
+
--seed-box-height-md: var(--seed-box-height-sm, initial);
|
|
4654
|
+
--seed-box-height-lg: var(--seed-box-height-md, initial);
|
|
4655
|
+
--seed-box-height-xl: var(--seed-box-height-lg, initial);
|
|
4656
|
+
--seed-box-height: var(--seed-box-height-base, initial);
|
|
4657
|
+
--seed-box-min-height-base: auto;
|
|
4658
|
+
--seed-box-min-height-sm: var(--seed-box-min-height-base, initial);
|
|
4659
|
+
--seed-box-min-height-md: var(--seed-box-min-height-sm, initial);
|
|
4660
|
+
--seed-box-min-height-lg: var(--seed-box-min-height-md, initial);
|
|
4661
|
+
--seed-box-min-height-xl: var(--seed-box-min-height-lg, initial);
|
|
4662
|
+
--seed-box-min-height: var(--seed-box-min-height-base, initial);
|
|
4663
|
+
--seed-box-max-height-base: none;
|
|
4664
|
+
--seed-box-max-height-sm: var(--seed-box-max-height-base, initial);
|
|
4665
|
+
--seed-box-max-height-md: var(--seed-box-max-height-sm, initial);
|
|
4666
|
+
--seed-box-max-height-lg: var(--seed-box-max-height-md, initial);
|
|
4667
|
+
--seed-box-max-height-xl: var(--seed-box-max-height-lg, initial);
|
|
4668
|
+
--seed-box-max-height: var(--seed-box-max-height-base, initial);
|
|
4559
4669
|
width: 100%;
|
|
4560
4670
|
min-width: 0;
|
|
4671
|
+
height: var(--seed-box-height);
|
|
4672
|
+
min-height: var(--seed-box-min-height);
|
|
4673
|
+
max-height: var(--seed-box-max-height);
|
|
4561
4674
|
color: var(--seed-color-fg-neutral-muted);
|
|
4562
4675
|
background-color: var(--seed-color-bg-layer-floating);
|
|
4563
4676
|
position: relative;
|
|
@@ -5004,11 +5117,6 @@
|
|
|
5004
5117
|
grid-template-columns: repeat(2, minmax(0, 1fr));
|
|
5005
5118
|
}
|
|
5006
5119
|
|
|
5007
|
-
.seed-date-picker__root--visibleRange_continuous {
|
|
5008
|
-
height: 100%;
|
|
5009
|
-
min-height: 0;
|
|
5010
|
-
}
|
|
5011
|
-
|
|
5012
5120
|
.seed-date-picker__weekdayRow--visibleRange_continuous {
|
|
5013
5121
|
position: sticky;
|
|
5014
5122
|
top: 0;
|
|
@@ -5594,11 +5702,12 @@
|
|
|
5594
5702
|
align-items: center;
|
|
5595
5703
|
gap: var(--seed-dimension-x2_5);
|
|
5596
5704
|
border-radius: var(--seed-radius-r3);
|
|
5705
|
+
height: 80px;
|
|
5706
|
+
transition: scale var(--seed-duration-pressed-scale) var(--seed-timing-function-pressed-scale);
|
|
5597
5707
|
--remove-button-mask-size: var(--seed-dimension-x6);
|
|
5598
5708
|
--remove-button-mask-offset: var(--seed-dimension-x1_5);
|
|
5599
5709
|
outline: var(--seed-dimension-x0_5) solid transparent;
|
|
5600
5710
|
outline-offset: var(--seed-dimension-x0_5);
|
|
5601
|
-
height: 80px;
|
|
5602
5711
|
display: flex;
|
|
5603
5712
|
position: relative;
|
|
5604
5713
|
}
|
|
@@ -5636,6 +5745,7 @@
|
|
|
5636
5745
|
}
|
|
5637
5746
|
|
|
5638
5747
|
.seed-attachment-input-item__root[aria-grabbed="true"] {
|
|
5748
|
+
scale: var(--seed-feedback-scale);
|
|
5639
5749
|
--remove-button-mask-size: 0px;
|
|
5640
5750
|
--remove-button-mask-offset: 0px;
|
|
5641
5751
|
}
|
|
@@ -5730,9 +5840,6 @@
|
|
|
5730
5840
|
font: inherit;
|
|
5731
5841
|
cursor: pointer;
|
|
5732
5842
|
border-radius: inherit;
|
|
5733
|
-
transition: outline-color var(--seed-duration-d3) var(--seed-timing-function-easing);
|
|
5734
|
-
outline: var(--seed-dimension-x0_5) solid transparent;
|
|
5735
|
-
outline-offset: calc(var(--seed-dimension-x0_5) * -1);
|
|
5736
5843
|
background: none;
|
|
5737
5844
|
border: none;
|
|
5738
5845
|
flex-direction: column;
|
|
@@ -5742,6 +5849,16 @@
|
|
|
5742
5849
|
display: flex;
|
|
5743
5850
|
}
|
|
5744
5851
|
|
|
5852
|
+
.seed-attachment-input-item__actionButton:not(:is(:disabled, [disabled], [data-disabled])):is(:active, [data-active]) {
|
|
5853
|
+
scale: var(--seed-feedback-scale);
|
|
5854
|
+
}
|
|
5855
|
+
|
|
5856
|
+
.seed-attachment-input-item__actionButton {
|
|
5857
|
+
transition: scale var(--seed-duration-pressed-scale) var(--seed-timing-function-pressed-scale), outline-color var(--seed-duration-d3) var(--seed-timing-function-easing);
|
|
5858
|
+
outline: var(--seed-dimension-x0_5) solid transparent;
|
|
5859
|
+
outline-offset: calc(var(--seed-dimension-x0_5) * -1);
|
|
5860
|
+
}
|
|
5861
|
+
|
|
5745
5862
|
.seed-attachment-input-item__actionButton:is(:focus-visible, [data-focus-visible]) {
|
|
5746
5863
|
outline: var(--seed-dimension-x0_5) solid var(--seed-color-stroke-focus-ring);
|
|
5747
5864
|
outline-offset: calc(var(--seed-dimension-x0_5) * -1);
|
|
@@ -5763,9 +5880,6 @@
|
|
|
5763
5880
|
background-color: var(--seed-color-bg-layer-default);
|
|
5764
5881
|
border-radius: var(--seed-radius-full);
|
|
5765
5882
|
cursor: pointer;
|
|
5766
|
-
transition: background-color .2s, outline-color var(--seed-duration-d3) var(--seed-timing-function-easing);
|
|
5767
|
-
outline: var(--seed-dimension-x0_5) solid transparent;
|
|
5768
|
-
outline-offset: calc(var(--seed-dimension-x0_5) * -1);
|
|
5769
5883
|
border: none;
|
|
5770
5884
|
justify-content: center;
|
|
5771
5885
|
align-items: center;
|
|
@@ -5774,6 +5888,16 @@
|
|
|
5774
5888
|
position: absolute;
|
|
5775
5889
|
}
|
|
5776
5890
|
|
|
5891
|
+
.seed-attachment-input-item__removeButton:not(:is(:disabled, [disabled], [data-disabled])):is(:active, [data-active]) {
|
|
5892
|
+
scale: var(--seed-feedback-scale);
|
|
5893
|
+
}
|
|
5894
|
+
|
|
5895
|
+
.seed-attachment-input-item__removeButton {
|
|
5896
|
+
transition: background-color .2s, scale var(--seed-duration-pressed-scale) var(--seed-timing-function-pressed-scale), outline-color var(--seed-duration-d3) var(--seed-timing-function-easing);
|
|
5897
|
+
outline: var(--seed-dimension-x0_5) solid transparent;
|
|
5898
|
+
outline-offset: calc(var(--seed-dimension-x0_5) * -1);
|
|
5899
|
+
}
|
|
5900
|
+
|
|
5777
5901
|
.seed-attachment-input-item__removeButton:is(:focus-visible, [data-focus-visible]) {
|
|
5778
5902
|
outline: var(--seed-dimension-x0_5) solid var(--seed-color-stroke-focus-ring);
|
|
5779
5903
|
outline-offset: calc(var(--seed-dimension-x0_5) * -1);
|
|
@@ -5838,7 +5962,7 @@
|
|
|
5838
5962
|
|
|
5839
5963
|
.seed-attachment-input-item__root--type_image {
|
|
5840
5964
|
width: 80px;
|
|
5841
|
-
transition: opacity .2s;
|
|
5965
|
+
transition: opacity .2s, scale var(--seed-duration-pressed-scale) var(--seed-timing-function-pressed-scale);
|
|
5842
5966
|
}
|
|
5843
5967
|
|
|
5844
5968
|
.seed-attachment-input-item__root--type_image:before {
|
|
@@ -5896,9 +6020,6 @@
|
|
|
5896
6020
|
box-shadow: inset 0 0 0 1px var(--seed-color-stroke-neutral-weak);
|
|
5897
6021
|
cursor: pointer;
|
|
5898
6022
|
border-radius: var(--seed-radius-r3);
|
|
5899
|
-
transition: background-color .2s, outline-color var(--seed-duration-d3) var(--seed-timing-function-easing);
|
|
5900
|
-
outline: var(--seed-dimension-x0_5) solid transparent;
|
|
5901
|
-
outline-offset: calc(var(--seed-dimension-x0_5) * -1);
|
|
5902
6023
|
background-color: #0000;
|
|
5903
6024
|
border: none;
|
|
5904
6025
|
flex-direction: column;
|
|
@@ -5907,6 +6028,16 @@
|
|
|
5907
6028
|
display: flex;
|
|
5908
6029
|
}
|
|
5909
6030
|
|
|
6031
|
+
.seed-attachment-input-trigger__root:not(:is(:disabled, [disabled], [data-disabled])):is(:active, [data-active]) {
|
|
6032
|
+
scale: var(--seed-feedback-scale);
|
|
6033
|
+
}
|
|
6034
|
+
|
|
6035
|
+
.seed-attachment-input-trigger__root {
|
|
6036
|
+
transition: background-color .2s, scale var(--seed-duration-pressed-scale) var(--seed-timing-function-pressed-scale), outline-color var(--seed-duration-d3) var(--seed-timing-function-easing);
|
|
6037
|
+
outline: var(--seed-dimension-x0_5) solid transparent;
|
|
6038
|
+
outline-offset: calc(var(--seed-dimension-x0_5) * -1);
|
|
6039
|
+
}
|
|
6040
|
+
|
|
5910
6041
|
.seed-attachment-input-trigger__root:is(:focus-visible, [data-focus-visible]) {
|
|
5911
6042
|
outline: var(--seed-dimension-x0_5) solid var(--seed-color-stroke-focus-ring);
|
|
5912
6043
|
outline-offset: calc(var(--seed-dimension-x0_5) * -1);
|
|
@@ -6003,11 +6134,18 @@
|
|
|
6003
6134
|
font-size: var(--seed-font-size-t5);
|
|
6004
6135
|
line-height: var(--seed-line-height-t5);
|
|
6005
6136
|
font-weight: var(--seed-font-weight-bold);
|
|
6006
|
-
transition: background-color var(--seed-duration-color-transition) var(--seed-timing-function-easing), max-width var(--seed-duration-d4) var(--seed-timing-function-easing), height var(--seed-duration-d4) var(--seed-timing-function-easing), padding var(--seed-duration-d4) var(--seed-timing-function-easing), outline-color var(--seed-duration-d3) var(--seed-timing-function-easing);
|
|
6007
6137
|
position: relative;
|
|
6008
6138
|
overflow: hidden;
|
|
6009
6139
|
}
|
|
6010
6140
|
|
|
6141
|
+
.seed-floating-action-button__root:not(:is(:disabled, [disabled], [data-disabled])):is(:active, [data-active]) {
|
|
6142
|
+
scale: var(--seed-feedback-scale);
|
|
6143
|
+
}
|
|
6144
|
+
|
|
6145
|
+
.seed-floating-action-button__root {
|
|
6146
|
+
transition: background-color var(--seed-duration-color-transition) var(--seed-timing-function-easing), max-width var(--seed-duration-d4) var(--seed-timing-function-easing), height var(--seed-duration-d4) var(--seed-timing-function-easing), padding var(--seed-duration-d4) var(--seed-timing-function-easing), scale var(--seed-duration-pressed-scale) var(--seed-timing-function-pressed-scale), outline-color var(--seed-duration-d3) var(--seed-timing-function-easing);
|
|
6147
|
+
}
|
|
6148
|
+
|
|
6011
6149
|
@media (hover: hover) and (pointer: fine) {
|
|
6012
6150
|
.seed-floating-action-button__root:is(:hover, [data-hover]) {
|
|
6013
6151
|
background: var(--seed-color-bg-brand-solid-pressed);
|
|
@@ -6127,11 +6265,12 @@
|
|
|
6127
6265
|
}
|
|
6128
6266
|
|
|
6129
6267
|
.seed-help-bubble__content {
|
|
6268
|
+
box-sizing: border-box;
|
|
6130
6269
|
background: var(--seed-color-bg-neutral-inverted);
|
|
6131
6270
|
padding-inline: var(--seed-dimension-x3);
|
|
6132
6271
|
padding-block: var(--seed-dimension-x2_5);
|
|
6133
6272
|
border-radius: var(--seed-radius-r3);
|
|
6134
|
-
--seed-box-max-width-base:
|
|
6273
|
+
--seed-box-max-width-base: 280px;
|
|
6135
6274
|
--seed-box-max-width-sm: var(--seed-box-max-width-base, initial);
|
|
6136
6275
|
--seed-box-max-width-md: var(--seed-box-max-width-sm, initial);
|
|
6137
6276
|
--seed-box-max-width-lg: var(--seed-box-max-width-md, initial);
|
|
@@ -6218,9 +6357,6 @@
|
|
|
6218
6357
|
--seed-icon-size: var(--seed-dimension-x3_5);
|
|
6219
6358
|
--seed-icon-color: var(--seed-color-fg-neutral-inverted);
|
|
6220
6359
|
border-radius: var(--seed-radius-r3);
|
|
6221
|
-
transition: outline-color var(--seed-duration-d3) var(--seed-timing-function-easing);
|
|
6222
|
-
outline: var(--seed-dimension-x0_5) solid transparent;
|
|
6223
|
-
outline-offset: calc(var(--seed-dimension-x0_5) * -1);
|
|
6224
6360
|
background: none;
|
|
6225
6361
|
border: none;
|
|
6226
6362
|
justify-content: center;
|
|
@@ -6228,6 +6364,16 @@
|
|
|
6228
6364
|
display: flex;
|
|
6229
6365
|
}
|
|
6230
6366
|
|
|
6367
|
+
.seed-help-bubble__closeButton:is(:active, [data-active]) {
|
|
6368
|
+
scale: var(--seed-feedback-scale);
|
|
6369
|
+
}
|
|
6370
|
+
|
|
6371
|
+
.seed-help-bubble__closeButton {
|
|
6372
|
+
transition: scale var(--seed-duration-pressed-scale) var(--seed-timing-function-pressed-scale), outline-color var(--seed-duration-d3) var(--seed-timing-function-easing);
|
|
6373
|
+
outline: var(--seed-dimension-x0_5) solid transparent;
|
|
6374
|
+
outline-offset: calc(var(--seed-dimension-x0_5) * -1);
|
|
6375
|
+
}
|
|
6376
|
+
|
|
6231
6377
|
.seed-help-bubble__closeButton:is(:focus-visible, [data-focus-visible]) {
|
|
6232
6378
|
outline: var(--seed-dimension-x0_5) solid var(--seed-color-stroke-focus-ring);
|
|
6233
6379
|
outline-offset: calc(var(--seed-dimension-x0_5) * -1);
|
|
@@ -6334,6 +6480,14 @@
|
|
|
6334
6480
|
position: relative;
|
|
6335
6481
|
}
|
|
6336
6482
|
|
|
6483
|
+
.seed-image-frame-reaction-button__root:is(:active, [data-active]) {
|
|
6484
|
+
scale: var(--seed-feedback-scale);
|
|
6485
|
+
}
|
|
6486
|
+
|
|
6487
|
+
.seed-image-frame-reaction-button__root {
|
|
6488
|
+
transition: scale var(--seed-duration-pressed-scale) var(--seed-timing-function-pressed-scale);
|
|
6489
|
+
}
|
|
6490
|
+
|
|
6337
6491
|
.seed-image-frame-reaction-button__root:before {
|
|
6338
6492
|
content: "";
|
|
6339
6493
|
inset: calc((var(--seed-dimension-x10) - var(--seed-dimension-x6)) / 2 * -1);
|
|
@@ -6680,14 +6834,21 @@
|
|
|
6680
6834
|
.seed-input-button__clearButton {
|
|
6681
6835
|
cursor: pointer;
|
|
6682
6836
|
border-radius: var(--seed-radius-full);
|
|
6683
|
-
transition: outline-color var(--seed-duration-d3) var(--seed-timing-function-easing);
|
|
6684
|
-
outline: var(--seed-dimension-x0_5) solid transparent;
|
|
6685
|
-
outline-offset: var(--seed-dimension-x0_5);
|
|
6686
6837
|
background-color: #0000;
|
|
6687
6838
|
border: none;
|
|
6688
6839
|
padding: 0;
|
|
6689
6840
|
}
|
|
6690
6841
|
|
|
6842
|
+
.seed-input-button__clearButton:is(:active, [data-active]) {
|
|
6843
|
+
scale: var(--seed-feedback-scale);
|
|
6844
|
+
}
|
|
6845
|
+
|
|
6846
|
+
.seed-input-button__clearButton {
|
|
6847
|
+
transition: scale var(--seed-duration-pressed-scale) var(--seed-timing-function-pressed-scale), outline-color var(--seed-duration-d3) var(--seed-timing-function-easing);
|
|
6848
|
+
outline: var(--seed-dimension-x0_5) solid transparent;
|
|
6849
|
+
outline-offset: var(--seed-dimension-x0_5);
|
|
6850
|
+
}
|
|
6851
|
+
|
|
6691
6852
|
.seed-input-button__clearButton:is(:focus-visible, [data-focus-visible]) {
|
|
6692
6853
|
outline: var(--seed-dimension-x0_5) solid var(--seed-color-stroke-focus-ring);
|
|
6693
6854
|
outline-offset: var(--seed-dimension-x0_5);
|
|
@@ -6989,6 +7150,9 @@
|
|
|
6989
7150
|
--seed-box-padding-right: var(--seed-box-padding-right-base, initial);
|
|
6990
7151
|
padding-right: var(--seed-box-padding-right);
|
|
6991
7152
|
--seed-focus-ring: none;
|
|
7153
|
+
--seed-checkmark-feedback-scale: 1;
|
|
7154
|
+
--seed-radiomark-feedback-scale: 1;
|
|
7155
|
+
--seed-switchmark-feedback-scale: 1;
|
|
6992
7156
|
--seed-icon-size: 22px;
|
|
6993
7157
|
--seed-icon-color: var(--seed-color-fg-neutral);
|
|
6994
7158
|
flex-shrink: 0;
|
|
@@ -7012,6 +7176,9 @@
|
|
|
7012
7176
|
align-items: center;
|
|
7013
7177
|
gap: var(--seed-box-gap);
|
|
7014
7178
|
--seed-focus-ring: none;
|
|
7179
|
+
--seed-checkmark-feedback-scale: 1;
|
|
7180
|
+
--seed-radiomark-feedback-scale: 1;
|
|
7181
|
+
--seed-switchmark-feedback-scale: 1;
|
|
7015
7182
|
font-size: var(--seed-font-size-t5);
|
|
7016
7183
|
line-height: var(--seed-line-height-t5);
|
|
7017
7184
|
font-weight: var(--seed-font-weight-regular);
|
|
@@ -7337,7 +7504,7 @@
|
|
|
7337
7504
|
}
|
|
7338
7505
|
|
|
7339
7506
|
.seed-menu__scrollArea {
|
|
7340
|
-
max-height: min(480px, var(--seed-menu-available-height, 480px));
|
|
7507
|
+
max-height: min(var(--seed-menu-max-height, 480px), var(--seed-menu-available-height, var(--seed-menu-max-height, 480px)));
|
|
7341
7508
|
box-sizing: border-box;
|
|
7342
7509
|
padding-block: var(--seed-dimension-x2);
|
|
7343
7510
|
gap: var(--seed-dimension-x2);
|
|
@@ -7628,6 +7795,7 @@
|
|
|
7628
7795
|
word-break: break-all;
|
|
7629
7796
|
z-index: calc(var(--sheet-z-index) + var(--layer-index, 0));
|
|
7630
7797
|
background: var(--seed-color-bg-layer-floating);
|
|
7798
|
+
max-width: 480px;
|
|
7631
7799
|
padding-inline: var(--seed-dimension-spacing-x-global-gutter);
|
|
7632
7800
|
padding-top: var(--menu-sheet-header-padding-top, var(--seed-dimension-x4));
|
|
7633
7801
|
padding-bottom: calc(var(--seed-dimension-x4) + var(--seed-safe-area-bottom));
|
|
@@ -7718,13 +7886,20 @@
|
|
|
7718
7886
|
font-size: var(--seed-font-size-t5);
|
|
7719
7887
|
line-height: var(--seed-line-height-t5);
|
|
7720
7888
|
font-weight: var(--seed-font-weight-medium);
|
|
7721
|
-
transition: outline-color var(--seed-duration-d3) var(--seed-timing-function-easing);
|
|
7722
7889
|
border: none;
|
|
7723
7890
|
justify-content: center;
|
|
7724
7891
|
align-items: center;
|
|
7725
7892
|
display: flex;
|
|
7726
7893
|
}
|
|
7727
7894
|
|
|
7895
|
+
.seed-menu-sheet__closeButton:is(:active, [data-active]) {
|
|
7896
|
+
scale: var(--seed-feedback-scale);
|
|
7897
|
+
}
|
|
7898
|
+
|
|
7899
|
+
.seed-menu-sheet__closeButton {
|
|
7900
|
+
transition: scale var(--seed-duration-pressed-scale) var(--seed-timing-function-pressed-scale), outline-color var(--seed-duration-d3) var(--seed-timing-function-easing);
|
|
7901
|
+
}
|
|
7902
|
+
|
|
7728
7903
|
@media (hover: hover) and (pointer: fine) {
|
|
7729
7904
|
.seed-menu-sheet__closeButton:is(:hover, [data-hover]) {
|
|
7730
7905
|
background-color: var(--seed-color-bg-neutral-weak-pressed);
|
|
@@ -8028,15 +8203,22 @@
|
|
|
8028
8203
|
line-height: var(--seed-line-height-t3);
|
|
8029
8204
|
font-weight: var(--seed-font-weight-bold);
|
|
8030
8205
|
border-radius: var(--seed-radius-r1);
|
|
8031
|
-
transition: outline-color var(--seed-duration-d3) var(--seed-timing-function-easing);
|
|
8032
|
-
outline: var(--seed-dimension-x0_5) solid transparent;
|
|
8033
|
-
outline-offset: calc(var(--seed-dimension-x0_5) * -1);
|
|
8034
8206
|
background-color: #0000;
|
|
8035
8207
|
border: none;
|
|
8036
8208
|
align-items: center;
|
|
8037
8209
|
display: flex;
|
|
8038
8210
|
}
|
|
8039
8211
|
|
|
8212
|
+
.seed-page-banner__button:is(:active, [data-active]) {
|
|
8213
|
+
scale: var(--seed-feedback-scale);
|
|
8214
|
+
}
|
|
8215
|
+
|
|
8216
|
+
.seed-page-banner__button {
|
|
8217
|
+
transition: scale var(--seed-duration-pressed-scale) var(--seed-timing-function-pressed-scale), outline-color var(--seed-duration-d3) var(--seed-timing-function-easing);
|
|
8218
|
+
outline: var(--seed-dimension-x0_5) solid transparent;
|
|
8219
|
+
outline-offset: calc(var(--seed-dimension-x0_5) * -1);
|
|
8220
|
+
}
|
|
8221
|
+
|
|
8040
8222
|
.seed-page-banner__button:is(:focus-visible, [data-focus-visible]) {
|
|
8041
8223
|
outline: var(--seed-dimension-x0_5) solid var(--seed-color-stroke-focus-ring);
|
|
8042
8224
|
outline-offset: calc(var(--seed-dimension-x0_5) * -1);
|
|
@@ -8048,12 +8230,10 @@
|
|
|
8048
8230
|
margin: calc((var(--seed-dimension-x10) - var(--seed-dimension-x4)) * -.5);
|
|
8049
8231
|
margin-left: calc((var(--seed-dimension-x10) - var(--seed-dimension-x4)) * -.5 + var(--seed-dimension-x2));
|
|
8050
8232
|
--seed-suffix-icon-margin-left: initial;
|
|
8233
|
+
background-color: var(--seed-color-bg-transparent);
|
|
8051
8234
|
cursor: pointer;
|
|
8052
|
-
border-radius: var(--seed-radius-
|
|
8053
|
-
|
|
8054
|
-
outline: var(--seed-dimension-x0_5) solid transparent;
|
|
8055
|
-
outline-offset: calc(var(--seed-dimension-x0_5) * -1);
|
|
8056
|
-
background-color: #0000;
|
|
8235
|
+
border-radius: var(--seed-radius-r2);
|
|
8236
|
+
--seed-suffix-icon-size: var(--seed-dimension-x4);
|
|
8057
8237
|
border: none;
|
|
8058
8238
|
flex-grow: 0;
|
|
8059
8239
|
flex-shrink: 0;
|
|
@@ -8064,11 +8244,33 @@
|
|
|
8064
8244
|
display: flex;
|
|
8065
8245
|
}
|
|
8066
8246
|
|
|
8247
|
+
.seed-page-banner__closeButton:is(:active, [data-active]) {
|
|
8248
|
+
scale: var(--seed-feedback-scale);
|
|
8249
|
+
}
|
|
8250
|
+
|
|
8251
|
+
.seed-page-banner__closeButton {
|
|
8252
|
+
transition: background-color var(--seed-duration-color-transition) var(--seed-timing-function-easing), scale var(--seed-duration-pressed-scale) var(--seed-timing-function-pressed-scale), outline-color var(--seed-duration-d3) var(--seed-timing-function-easing);
|
|
8253
|
+
outline: var(--seed-dimension-x0_5) solid transparent;
|
|
8254
|
+
outline-offset: calc(var(--seed-dimension-x0_5) * -1);
|
|
8255
|
+
}
|
|
8256
|
+
|
|
8067
8257
|
.seed-page-banner__closeButton:is(:focus-visible, [data-focus-visible]) {
|
|
8068
8258
|
outline: var(--seed-dimension-x0_5) solid var(--seed-color-stroke-focus-ring);
|
|
8069
8259
|
outline-offset: calc(var(--seed-dimension-x0_5) * -1);
|
|
8070
8260
|
}
|
|
8071
8261
|
|
|
8262
|
+
@media (hover: hover) and (pointer: fine) {
|
|
8263
|
+
.seed-page-banner__closeButton:is(:hover, [data-hover]) {
|
|
8264
|
+
background-color: var(--seed-color-bg-transparent-pressed);
|
|
8265
|
+
}
|
|
8266
|
+
}
|
|
8267
|
+
|
|
8268
|
+
@media not all and (hover: hover) and (pointer: fine) {
|
|
8269
|
+
.seed-page-banner__closeButton:is(:active, [data-active]) {
|
|
8270
|
+
background-color: var(--seed-color-bg-transparent-pressed);
|
|
8271
|
+
}
|
|
8272
|
+
}
|
|
8273
|
+
|
|
8072
8274
|
.seed-page-banner__root--tone_neutral-variant_weak {
|
|
8073
8275
|
background-color: var(--seed-color-bg-neutral-weak);
|
|
8074
8276
|
--seed-prefix-icon-color: var(--seed-color-fg-neutral);
|
|
@@ -8091,8 +8293,12 @@
|
|
|
8091
8293
|
color: var(--seed-color-fg-neutral);
|
|
8092
8294
|
}
|
|
8093
8295
|
|
|
8094
|
-
.seed-page-
|
|
8095
|
-
|
|
8296
|
+
.seed-page-banner__closeButton--tone_neutral-variant_weak {
|
|
8297
|
+
--seed-suffix-icon-color: var(--seed-color-fg-neutral);
|
|
8298
|
+
}
|
|
8299
|
+
|
|
8300
|
+
.seed-page-banner__root--tone_neutral-variant_solid {
|
|
8301
|
+
background-color: var(--seed-color-bg-neutral-inverted);
|
|
8096
8302
|
--seed-prefix-icon-color: var(--seed-color-fg-neutral-inverted);
|
|
8097
8303
|
--seed-suffix-icon-color: var(--seed-color-fg-neutral-inverted);
|
|
8098
8304
|
}
|
|
@@ -8113,6 +8319,10 @@
|
|
|
8113
8319
|
color: var(--seed-color-fg-neutral-inverted);
|
|
8114
8320
|
}
|
|
8115
8321
|
|
|
8322
|
+
.seed-page-banner__closeButton--tone_neutral-variant_solid {
|
|
8323
|
+
--seed-suffix-icon-color: var(--seed-color-fg-neutral-inverted);
|
|
8324
|
+
}
|
|
8325
|
+
|
|
8116
8326
|
.seed-page-banner__root--tone_informative-variant_weak {
|
|
8117
8327
|
background-color: var(--seed-color-bg-informative-weak);
|
|
8118
8328
|
--seed-prefix-icon-color: var(--seed-color-fg-informative-contrast);
|
|
@@ -8135,6 +8345,10 @@
|
|
|
8135
8345
|
color: var(--seed-color-fg-informative-contrast);
|
|
8136
8346
|
}
|
|
8137
8347
|
|
|
8348
|
+
.seed-page-banner__closeButton--tone_informative-variant_weak {
|
|
8349
|
+
--seed-suffix-icon-color: var(--seed-color-fg-informative-contrast);
|
|
8350
|
+
}
|
|
8351
|
+
|
|
8138
8352
|
.seed-page-banner__root--tone_informative-variant_solid {
|
|
8139
8353
|
background-color: var(--seed-color-bg-informative-solid);
|
|
8140
8354
|
--seed-prefix-icon-color: var(--seed-color-palette-static-white);
|
|
@@ -8157,6 +8371,10 @@
|
|
|
8157
8371
|
color: var(--seed-color-palette-static-white);
|
|
8158
8372
|
}
|
|
8159
8373
|
|
|
8374
|
+
.seed-page-banner__closeButton--tone_informative-variant_solid {
|
|
8375
|
+
--seed-suffix-icon-color: var(--seed-color-palette-static-white);
|
|
8376
|
+
}
|
|
8377
|
+
|
|
8160
8378
|
.seed-page-banner__root--tone_positive-variant_weak {
|
|
8161
8379
|
background-color: var(--seed-color-bg-positive-weak);
|
|
8162
8380
|
--seed-prefix-icon-color: var(--seed-color-fg-positive-contrast);
|
|
@@ -8179,6 +8397,10 @@
|
|
|
8179
8397
|
color: var(--seed-color-fg-positive-contrast);
|
|
8180
8398
|
}
|
|
8181
8399
|
|
|
8400
|
+
.seed-page-banner__closeButton--tone_positive-variant_weak {
|
|
8401
|
+
--seed-suffix-icon-color: var(--seed-color-fg-positive-contrast);
|
|
8402
|
+
}
|
|
8403
|
+
|
|
8182
8404
|
.seed-page-banner__root--tone_positive-variant_solid {
|
|
8183
8405
|
background-color: var(--seed-color-bg-positive-solid);
|
|
8184
8406
|
--seed-prefix-icon-color: var(--seed-color-palette-static-white);
|
|
@@ -8201,6 +8423,10 @@
|
|
|
8201
8423
|
color: var(--seed-color-palette-static-white);
|
|
8202
8424
|
}
|
|
8203
8425
|
|
|
8426
|
+
.seed-page-banner__closeButton--tone_positive-variant_solid {
|
|
8427
|
+
--seed-suffix-icon-color: var(--seed-color-palette-static-white);
|
|
8428
|
+
}
|
|
8429
|
+
|
|
8204
8430
|
.seed-page-banner__root--tone_warning-variant_weak {
|
|
8205
8431
|
background-color: var(--seed-color-bg-warning-weak);
|
|
8206
8432
|
--seed-prefix-icon-color: var(--seed-color-fg-warning-contrast);
|
|
@@ -8223,6 +8449,10 @@
|
|
|
8223
8449
|
color: var(--seed-color-fg-warning-contrast);
|
|
8224
8450
|
}
|
|
8225
8451
|
|
|
8452
|
+
.seed-page-banner__closeButton--tone_warning-variant_weak {
|
|
8453
|
+
--seed-suffix-icon-color: var(--seed-color-fg-warning-contrast);
|
|
8454
|
+
}
|
|
8455
|
+
|
|
8226
8456
|
.seed-page-banner__root--tone_warning-variant_solid {
|
|
8227
8457
|
background-color: var(--seed-color-bg-warning-solid);
|
|
8228
8458
|
--seed-prefix-icon-color: var(--seed-color-palette-static-black-alpha-900);
|
|
@@ -8245,6 +8475,10 @@
|
|
|
8245
8475
|
color: var(--seed-color-palette-static-black-alpha-900);
|
|
8246
8476
|
}
|
|
8247
8477
|
|
|
8478
|
+
.seed-page-banner__closeButton--tone_warning-variant_solid {
|
|
8479
|
+
--seed-suffix-icon-color: var(--seed-color-palette-static-black-alpha-900);
|
|
8480
|
+
}
|
|
8481
|
+
|
|
8248
8482
|
.seed-page-banner__root--tone_critical-variant_weak {
|
|
8249
8483
|
background-color: var(--seed-color-bg-critical-weak);
|
|
8250
8484
|
--seed-prefix-icon-color: var(--seed-color-fg-critical-contrast);
|
|
@@ -8267,6 +8501,10 @@
|
|
|
8267
8501
|
color: var(--seed-color-fg-critical-contrast);
|
|
8268
8502
|
}
|
|
8269
8503
|
|
|
8504
|
+
.seed-page-banner__closeButton--tone_critical-variant_weak {
|
|
8505
|
+
--seed-suffix-icon-color: var(--seed-color-fg-critical-contrast);
|
|
8506
|
+
}
|
|
8507
|
+
|
|
8270
8508
|
.seed-page-banner__root--tone_critical-variant_solid {
|
|
8271
8509
|
background-color: var(--seed-color-bg-critical-solid);
|
|
8272
8510
|
--seed-prefix-icon-color: var(--seed-color-palette-static-white);
|
|
@@ -8289,6 +8527,10 @@
|
|
|
8289
8527
|
color: var(--seed-color-palette-static-white);
|
|
8290
8528
|
}
|
|
8291
8529
|
|
|
8530
|
+
.seed-page-banner__closeButton--tone_critical-variant_solid {
|
|
8531
|
+
--seed-suffix-icon-color: var(--seed-color-palette-static-white);
|
|
8532
|
+
}
|
|
8533
|
+
|
|
8292
8534
|
.seed-page-banner__root--tone_magic-variant_weak {
|
|
8293
8535
|
background-image: linear-gradient(88deg, var(--seed-gradient-glow-magic));
|
|
8294
8536
|
--seed-prefix-icon-color: var(--seed-color-fg-neutral);
|
|
@@ -8311,6 +8553,206 @@
|
|
|
8311
8553
|
color: var(--seed-color-fg-neutral);
|
|
8312
8554
|
}
|
|
8313
8555
|
|
|
8556
|
+
.seed-page-banner__closeButton--tone_magic-variant_weak {
|
|
8557
|
+
--seed-suffix-icon-color: var(--seed-color-fg-neutral);
|
|
8558
|
+
}
|
|
8559
|
+
|
|
8560
|
+
.seed-pagination-button {
|
|
8561
|
+
box-sizing: border-box;
|
|
8562
|
+
cursor: pointer;
|
|
8563
|
+
text-transform: none;
|
|
8564
|
+
white-space: nowrap;
|
|
8565
|
+
vertical-align: middle;
|
|
8566
|
+
-webkit-font-smoothing: antialiased;
|
|
8567
|
+
-moz-osx-font-smoothing: grayscale;
|
|
8568
|
+
width: var(--seed-dimension-x10);
|
|
8569
|
+
height: var(--seed-dimension-x10);
|
|
8570
|
+
border-radius: var(--seed-radius-r2);
|
|
8571
|
+
isolation: isolate;
|
|
8572
|
+
background: none;
|
|
8573
|
+
border: none;
|
|
8574
|
+
flex-shrink: 0;
|
|
8575
|
+
justify-content: center;
|
|
8576
|
+
align-items: center;
|
|
8577
|
+
padding: 0;
|
|
8578
|
+
font-family: inherit;
|
|
8579
|
+
text-decoration: none;
|
|
8580
|
+
display: inline-flex;
|
|
8581
|
+
position: relative;
|
|
8582
|
+
}
|
|
8583
|
+
|
|
8584
|
+
.seed-pagination-button:before {
|
|
8585
|
+
content: "";
|
|
8586
|
+
z-index: -1;
|
|
8587
|
+
border-radius: inherit;
|
|
8588
|
+
background-color: var(--seed-color-bg-transparent);
|
|
8589
|
+
transition: background-color var(--seed-duration-color-transition) var(--seed-timing-function-easing);
|
|
8590
|
+
position: absolute;
|
|
8591
|
+
inset: 0;
|
|
8592
|
+
}
|
|
8593
|
+
|
|
8594
|
+
.seed-pagination-button {
|
|
8595
|
+
--seed-icon-size: var(--seed-dimension-x4);
|
|
8596
|
+
--seed-icon-color: var(--seed-color-fg-neutral);
|
|
8597
|
+
outline: var(--seed-dimension-x0_5) solid transparent;
|
|
8598
|
+
outline-offset: var(--seed-dimension-x0_5);
|
|
8599
|
+
}
|
|
8600
|
+
|
|
8601
|
+
.seed-pagination-button:is(:focus-visible, [data-focus-visible]) {
|
|
8602
|
+
outline: var(--seed-dimension-x0_5) solid var(--seed-color-stroke-focus-ring);
|
|
8603
|
+
outline-offset: var(--seed-dimension-x0_5);
|
|
8604
|
+
}
|
|
8605
|
+
|
|
8606
|
+
.seed-pagination-button {
|
|
8607
|
+
scale: 1;
|
|
8608
|
+
}
|
|
8609
|
+
|
|
8610
|
+
@media (hover: hover) and (pointer: fine) {
|
|
8611
|
+
.seed-pagination-button:is(:hover, [data-hover]):not(:is(:disabled, [disabled], [data-disabled])):before {
|
|
8612
|
+
background-color: var(--seed-color-bg-transparent-pressed);
|
|
8613
|
+
}
|
|
8614
|
+
}
|
|
8615
|
+
|
|
8616
|
+
@media not all and (hover: hover) and (pointer: fine) {
|
|
8617
|
+
.seed-pagination-button:is(:active, [data-active]):not(:is(:disabled, [disabled], [data-disabled])):before {
|
|
8618
|
+
background-color: var(--seed-color-bg-transparent-pressed);
|
|
8619
|
+
}
|
|
8620
|
+
}
|
|
8621
|
+
|
|
8622
|
+
.seed-pagination-button:not(:is(:disabled, [disabled], [data-disabled])):is(:active, [data-active]) {
|
|
8623
|
+
scale: var(--seed-scale-s97);
|
|
8624
|
+
}
|
|
8625
|
+
|
|
8626
|
+
.seed-pagination-button:is(:disabled, [disabled], [data-disabled]) {
|
|
8627
|
+
cursor: not-allowed;
|
|
8628
|
+
--seed-icon-color: var(--seed-color-fg-disabled);
|
|
8629
|
+
}
|
|
8630
|
+
|
|
8631
|
+
.seed-pagination-button:is(:disabled, [disabled], [data-disabled]):before {
|
|
8632
|
+
background-color: var(--seed-color-bg-transparent);
|
|
8633
|
+
}
|
|
8634
|
+
|
|
8635
|
+
.seed-pagination-button {
|
|
8636
|
+
transition: scale var(--seed-duration-pressed-scale) var(--seed-timing-function-pressed-scale), outline-color var(--seed-duration-d3) var(--seed-timing-function-easing);
|
|
8637
|
+
}
|
|
8638
|
+
|
|
8639
|
+
.seed-pagination-page-item {
|
|
8640
|
+
box-sizing: border-box;
|
|
8641
|
+
cursor: pointer;
|
|
8642
|
+
text-transform: none;
|
|
8643
|
+
white-space: nowrap;
|
|
8644
|
+
vertical-align: middle;
|
|
8645
|
+
-webkit-font-smoothing: antialiased;
|
|
8646
|
+
-moz-osx-font-smoothing: grayscale;
|
|
8647
|
+
width: var(--seed-dimension-x10);
|
|
8648
|
+
height: var(--seed-dimension-x10);
|
|
8649
|
+
border-radius: var(--seed-radius-r2);
|
|
8650
|
+
isolation: isolate;
|
|
8651
|
+
color: var(--seed-color-fg-neutral);
|
|
8652
|
+
font-family: inherit;
|
|
8653
|
+
font-size: var(--seed-font-size-t4);
|
|
8654
|
+
line-height: var(--seed-line-height-t4);
|
|
8655
|
+
font-weight: var(--seed-font-weight-bold);
|
|
8656
|
+
background: none;
|
|
8657
|
+
border: none;
|
|
8658
|
+
flex-shrink: 0;
|
|
8659
|
+
justify-content: center;
|
|
8660
|
+
align-items: center;
|
|
8661
|
+
padding: 0;
|
|
8662
|
+
text-decoration: none;
|
|
8663
|
+
display: inline-flex;
|
|
8664
|
+
position: relative;
|
|
8665
|
+
}
|
|
8666
|
+
|
|
8667
|
+
.seed-pagination-page-item:before {
|
|
8668
|
+
content: "";
|
|
8669
|
+
z-index: -1;
|
|
8670
|
+
border-radius: inherit;
|
|
8671
|
+
background-color: var(--seed-color-bg-transparent);
|
|
8672
|
+
position: absolute;
|
|
8673
|
+
inset: 0;
|
|
8674
|
+
}
|
|
8675
|
+
|
|
8676
|
+
.seed-pagination-page-item > [data-pagination-page-item-label] {
|
|
8677
|
+
text-overflow: ellipsis;
|
|
8678
|
+
white-space: nowrap;
|
|
8679
|
+
min-width: 0;
|
|
8680
|
+
max-width: 100%;
|
|
8681
|
+
display: block;
|
|
8682
|
+
overflow: hidden;
|
|
8683
|
+
}
|
|
8684
|
+
|
|
8685
|
+
.seed-pagination-page-item {
|
|
8686
|
+
outline: var(--seed-dimension-x0_5) solid transparent;
|
|
8687
|
+
outline-offset: var(--seed-dimension-x0_5);
|
|
8688
|
+
}
|
|
8689
|
+
|
|
8690
|
+
.seed-pagination-page-item:is(:focus-visible, [data-focus-visible]) {
|
|
8691
|
+
outline: var(--seed-dimension-x0_5) solid var(--seed-color-stroke-focus-ring);
|
|
8692
|
+
outline-offset: var(--seed-dimension-x0_5);
|
|
8693
|
+
}
|
|
8694
|
+
|
|
8695
|
+
.seed-pagination-page-item {
|
|
8696
|
+
scale: 1;
|
|
8697
|
+
}
|
|
8698
|
+
|
|
8699
|
+
@media (hover: hover) and (pointer: fine) {
|
|
8700
|
+
.seed-pagination-page-item:is(:hover, [data-hover]):not(:is(:disabled, [disabled], [data-disabled])):before {
|
|
8701
|
+
background-color: var(--seed-color-bg-transparent-pressed);
|
|
8702
|
+
}
|
|
8703
|
+
}
|
|
8704
|
+
|
|
8705
|
+
@media not all and (hover: hover) and (pointer: fine) {
|
|
8706
|
+
.seed-pagination-page-item:is(:active, [data-active]):not(:is(:disabled, [disabled], [data-disabled])):before {
|
|
8707
|
+
background-color: var(--seed-color-bg-transparent-pressed);
|
|
8708
|
+
}
|
|
8709
|
+
}
|
|
8710
|
+
|
|
8711
|
+
.seed-pagination-page-item:not(:is(:disabled, [disabled], [data-disabled])):is(:active, [data-active]) {
|
|
8712
|
+
scale: var(--seed-scale-s97);
|
|
8713
|
+
}
|
|
8714
|
+
|
|
8715
|
+
.seed-pagination-page-item:is([aria-selected="true"], [data-selected]) {
|
|
8716
|
+
color: var(--seed-color-fg-neutral-inverted);
|
|
8717
|
+
}
|
|
8718
|
+
|
|
8719
|
+
.seed-pagination-page-item:is([aria-selected="true"], [data-selected]):before {
|
|
8720
|
+
background-color: var(--seed-color-bg-neutral-inverted);
|
|
8721
|
+
}
|
|
8722
|
+
|
|
8723
|
+
@media (hover: hover) and (pointer: fine) {
|
|
8724
|
+
.seed-pagination-page-item:is([aria-selected="true"], [data-selected]):is(:hover, [data-hover]):not(:is(:disabled, [disabled], [data-disabled])):before {
|
|
8725
|
+
background-color: var(--seed-color-bg-neutral-inverted-pressed);
|
|
8726
|
+
}
|
|
8727
|
+
}
|
|
8728
|
+
|
|
8729
|
+
@media not all and (hover: hover) and (pointer: fine) {
|
|
8730
|
+
.seed-pagination-page-item:is([aria-selected="true"], [data-selected]):is(:active, [data-active]):not(:is(:disabled, [disabled], [data-disabled])):before {
|
|
8731
|
+
background-color: var(--seed-color-bg-neutral-inverted-pressed);
|
|
8732
|
+
}
|
|
8733
|
+
}
|
|
8734
|
+
|
|
8735
|
+
.seed-pagination-page-item:is(:disabled, [disabled], [data-disabled]) {
|
|
8736
|
+
cursor: not-allowed;
|
|
8737
|
+
color: var(--seed-color-fg-disabled);
|
|
8738
|
+
}
|
|
8739
|
+
|
|
8740
|
+
.seed-pagination-page-item:is(:disabled, [disabled], [data-disabled]):before {
|
|
8741
|
+
background-color: var(--seed-color-bg-transparent);
|
|
8742
|
+
}
|
|
8743
|
+
|
|
8744
|
+
.seed-pagination-page-item:is([aria-selected="true"], [data-selected]):is(:disabled, [disabled], [data-disabled]) {
|
|
8745
|
+
color: var(--seed-color-fg-disabled);
|
|
8746
|
+
}
|
|
8747
|
+
|
|
8748
|
+
.seed-pagination-page-item:is([aria-selected="true"], [data-selected]):is(:disabled, [disabled], [data-disabled]):before {
|
|
8749
|
+
background-color: var(--seed-color-bg-disabled);
|
|
8750
|
+
}
|
|
8751
|
+
|
|
8752
|
+
.seed-pagination-page-item {
|
|
8753
|
+
transition: scale var(--seed-duration-pressed-scale) var(--seed-timing-function-pressed-scale), outline-color var(--seed-duration-d3) var(--seed-timing-function-easing);
|
|
8754
|
+
}
|
|
8755
|
+
|
|
8314
8756
|
.seed-progress-circle__root {
|
|
8315
8757
|
box-sizing: border-box;
|
|
8316
8758
|
display: inline-flex;
|
|
@@ -8363,7 +8805,7 @@
|
|
|
8363
8805
|
}
|
|
8364
8806
|
|
|
8365
8807
|
.seed-pull-to-refresh__root {
|
|
8366
|
-
--ptr-size:
|
|
8808
|
+
--ptr-size: calc(var(--seed-dimension-x6) + var(--seed-dimension-x8) * 2);
|
|
8367
8809
|
--ptr-transition-duration: var(--seed-duration-d6);
|
|
8368
8810
|
height: 100%;
|
|
8369
8811
|
}
|
|
@@ -8397,7 +8839,7 @@
|
|
|
8397
8839
|
box-sizing: border-box;
|
|
8398
8840
|
cursor: pointer;
|
|
8399
8841
|
background-color: var(--seed-color-bg-transparent);
|
|
8400
|
-
transition: background-color var(--seed-duration-color-transition) var(--seed-timing-function-easing), outline-color var(--seed-duration-d3) var(--seed-timing-function-easing);
|
|
8842
|
+
transition: background-color var(--seed-duration-color-transition) var(--seed-timing-function-easing), scale var(--seed-duration-pressed-scale) var(--seed-timing-function-pressed-scale), outline-color var(--seed-duration-d3) var(--seed-timing-function-easing);
|
|
8401
8843
|
outline: var(--seed-dimension-x0_5) solid transparent;
|
|
8402
8844
|
outline-offset: var(--seed-dimension-x0_5);
|
|
8403
8845
|
border: none;
|
|
@@ -8413,6 +8855,10 @@
|
|
|
8413
8855
|
outline-offset: var(--seed-dimension-x0_5);
|
|
8414
8856
|
}
|
|
8415
8857
|
|
|
8858
|
+
.seed-quantity-picker__decrementButton:not(:is(:disabled, [disabled], [data-disabled])):is(:active, [data-active]) {
|
|
8859
|
+
scale: var(--seed-feedback-scale);
|
|
8860
|
+
}
|
|
8861
|
+
|
|
8416
8862
|
@media (hover: hover) and (pointer: fine) {
|
|
8417
8863
|
.seed-quantity-picker__decrementButton:not(:is(:disabled, [disabled], [data-disabled])):is(:hover, [data-hover]) {
|
|
8418
8864
|
background-color: var(--seed-color-bg-transparent-pressed);
|
|
@@ -8480,7 +8926,7 @@
|
|
|
8480
8926
|
box-sizing: border-box;
|
|
8481
8927
|
cursor: pointer;
|
|
8482
8928
|
background-color: var(--seed-color-bg-transparent);
|
|
8483
|
-
transition: background-color var(--seed-duration-color-transition) var(--seed-timing-function-easing), outline-color var(--seed-duration-d3) var(--seed-timing-function-easing);
|
|
8929
|
+
transition: background-color var(--seed-duration-color-transition) var(--seed-timing-function-easing), scale var(--seed-duration-pressed-scale) var(--seed-timing-function-pressed-scale), outline-color var(--seed-duration-d3) var(--seed-timing-function-easing);
|
|
8484
8930
|
outline: var(--seed-dimension-x0_5) solid transparent;
|
|
8485
8931
|
outline-offset: var(--seed-dimension-x0_5);
|
|
8486
8932
|
border: none;
|
|
@@ -8496,6 +8942,10 @@
|
|
|
8496
8942
|
outline-offset: var(--seed-dimension-x0_5);
|
|
8497
8943
|
}
|
|
8498
8944
|
|
|
8945
|
+
.seed-quantity-picker__incrementButton:not(:is(:disabled, [disabled], [data-disabled])):is(:active, [data-active]) {
|
|
8946
|
+
scale: var(--seed-feedback-scale);
|
|
8947
|
+
}
|
|
8948
|
+
|
|
8499
8949
|
@media (hover: hover) and (pointer: fine) {
|
|
8500
8950
|
.seed-quantity-picker__incrementButton:not(:is(:disabled, [disabled], [data-disabled])):is(:hover, [data-hover]) {
|
|
8501
8951
|
background-color: var(--seed-color-bg-transparent-pressed);
|
|
@@ -8723,9 +9173,6 @@
|
|
|
8723
9173
|
border-color: var(--seed-color-stroke-neutral-weak);
|
|
8724
9174
|
border-radius: var(--seed-radius-full);
|
|
8725
9175
|
margin-top: var(--radiomark-margin-top, 0);
|
|
8726
|
-
transition: background-color var(--seed-duration-color-transition) var(--seed-timing-function-easing), outline-color var(--seed-duration-d3) var(--seed-timing-function-easing);
|
|
8727
|
-
outline: var(--seed-focus-ring, var(--seed-dimension-x0_5) solid transparent);
|
|
8728
|
-
outline-offset: var(--seed-dimension-x0_5);
|
|
8729
9176
|
flex: none;
|
|
8730
9177
|
justify-content: center;
|
|
8731
9178
|
align-items: center;
|
|
@@ -8733,6 +9180,16 @@
|
|
|
8733
9180
|
position: relative;
|
|
8734
9181
|
}
|
|
8735
9182
|
|
|
9183
|
+
.seed-radiomark__root:not(:is(:disabled, [disabled], [data-disabled])):is(:active, [data-active]) {
|
|
9184
|
+
scale: var(--seed-radiomark-feedback-scale, var(--seed-feedback-scale));
|
|
9185
|
+
}
|
|
9186
|
+
|
|
9187
|
+
.seed-radiomark__root {
|
|
9188
|
+
transition: background-color var(--seed-duration-color-transition) var(--seed-timing-function-easing), scale var(--seed-duration-pressed-scale) var(--seed-timing-function-pressed-scale), outline-color var(--seed-duration-d3) var(--seed-timing-function-easing);
|
|
9189
|
+
outline: var(--seed-focus-ring, var(--seed-dimension-x0_5) solid transparent);
|
|
9190
|
+
outline-offset: var(--seed-dimension-x0_5);
|
|
9191
|
+
}
|
|
9192
|
+
|
|
8736
9193
|
@media (hover: hover) and (pointer: fine) {
|
|
8737
9194
|
.seed-radiomark__root:not(:is(:disabled, [disabled], [data-disabled])):is(:hover, [data-hover]) {
|
|
8738
9195
|
background-color: var(--seed-color-bg-transparent-pressed);
|
|
@@ -8872,8 +9329,12 @@
|
|
|
8872
9329
|
outline-offset: var(--seed-dimension-x0_5);
|
|
8873
9330
|
}
|
|
8874
9331
|
|
|
9332
|
+
.seed-reaction-button:not(:is(:disabled, [disabled], [data-disabled])):is(:active, [data-active]) {
|
|
9333
|
+
scale: var(--seed-feedback-scale);
|
|
9334
|
+
}
|
|
9335
|
+
|
|
8875
9336
|
.seed-reaction-button {
|
|
8876
|
-
transition: background-color var(--seed-duration-color-transition) var(--seed-timing-function-easing), box-shadow var(--seed-duration-color-transition) var(--seed-timing-function-easing), outline-color var(--seed-duration-d3) var(--seed-timing-function-easing);
|
|
9337
|
+
transition: background-color var(--seed-duration-color-transition) var(--seed-timing-function-easing), box-shadow var(--seed-duration-color-transition) var(--seed-timing-function-easing), scale var(--seed-duration-pressed-scale) var(--seed-timing-function-pressed-scale), outline-color var(--seed-duration-d3) var(--seed-timing-function-easing);
|
|
8877
9338
|
background: var(--seed-color-bg-transparent);
|
|
8878
9339
|
font-weight: var(--seed-font-weight-medium);
|
|
8879
9340
|
color: var(--seed-color-fg-neutral);
|
|
@@ -9144,7 +9605,7 @@
|
|
|
9144
9605
|
}
|
|
9145
9606
|
|
|
9146
9607
|
.seed-select__scrollArea {
|
|
9147
|
-
max-height: min(480px, var(--seed-select-available-height, 480px));
|
|
9608
|
+
max-height: min(var(--seed-select-max-height, 480px), var(--seed-select-available-height, var(--seed-select-max-height, 480px)));
|
|
9148
9609
|
box-sizing: border-box;
|
|
9149
9610
|
padding-block: var(--seed-dimension-x2);
|
|
9150
9611
|
gap: var(--seed-dimension-x2);
|
|
@@ -9627,7 +10088,7 @@
|
|
|
9627
10088
|
cursor: pointer;
|
|
9628
10089
|
border-radius: var(--seed-radius-r3);
|
|
9629
10090
|
background-color: var(--seed-color-bg-transparent);
|
|
9630
|
-
box-shadow: inset 0 0 0 1px var(--seed-color-stroke-neutral-
|
|
10091
|
+
box-shadow: inset 0 0 0 1px var(--seed-color-stroke-neutral-weak);
|
|
9631
10092
|
transition: background-color var(--seed-duration-color-transition) var(--seed-timing-function-easing), outline-color var(--seed-duration-d3) var(--seed-timing-function-easing);
|
|
9632
10093
|
flex-direction: column;
|
|
9633
10094
|
display: flex;
|
|
@@ -9664,11 +10125,11 @@
|
|
|
9664
10125
|
|
|
9665
10126
|
.seed-select-box__root:is(:disabled, [disabled], [data-disabled]) {
|
|
9666
10127
|
cursor: not-allowed;
|
|
9667
|
-
box-shadow: inset 0 0 0 1px var(--seed-color-stroke-neutral-
|
|
10128
|
+
box-shadow: inset 0 0 0 1px var(--seed-color-stroke-neutral-weak);
|
|
9668
10129
|
}
|
|
9669
10130
|
|
|
9670
10131
|
.seed-select-box__root:is(:disabled, [disabled], [data-disabled]):is(:checked, [data-checked]) {
|
|
9671
|
-
box-shadow: inset 0 0 0 2px var(--seed-color-stroke-neutral-
|
|
10132
|
+
box-shadow: inset 0 0 0 2px var(--seed-color-stroke-neutral-weak);
|
|
9672
10133
|
}
|
|
9673
10134
|
|
|
9674
10135
|
.seed-select-box__root {
|
|
@@ -10362,11 +10823,6 @@
|
|
|
10362
10823
|
top: calc(28px + var(--seed-safe-area-top));
|
|
10363
10824
|
border-radius: var(--seed-radius-r3);
|
|
10364
10825
|
cursor: pointer;
|
|
10365
|
-
transition: background var(--seed-duration-color-transition) var(--seed-timing-function-easing), outline-color var(--seed-duration-d3) var(--seed-timing-function-easing);
|
|
10366
|
-
--seed-icon-size: 22px;
|
|
10367
|
-
--seed-icon-color: var(--seed-color-fg-neutral-subtle);
|
|
10368
|
-
outline: var(--seed-dimension-x0_5) solid transparent;
|
|
10369
|
-
outline-offset: var(--seed-dimension-x0_5);
|
|
10370
10826
|
border: none;
|
|
10371
10827
|
justify-content: center;
|
|
10372
10828
|
align-items: center;
|
|
@@ -10377,6 +10833,18 @@
|
|
|
10377
10833
|
right: 24px;
|
|
10378
10834
|
}
|
|
10379
10835
|
|
|
10836
|
+
.seed-side-panel__closeButton:is(:active, [data-active]) {
|
|
10837
|
+
scale: var(--seed-feedback-scale);
|
|
10838
|
+
}
|
|
10839
|
+
|
|
10840
|
+
.seed-side-panel__closeButton {
|
|
10841
|
+
transition: background var(--seed-duration-color-transition) var(--seed-timing-function-easing), scale var(--seed-duration-pressed-scale) var(--seed-timing-function-pressed-scale), outline-color var(--seed-duration-d3) var(--seed-timing-function-easing);
|
|
10842
|
+
--seed-icon-size: 22px;
|
|
10843
|
+
--seed-icon-color: var(--seed-color-fg-neutral-subtle);
|
|
10844
|
+
outline: var(--seed-dimension-x0_5) solid transparent;
|
|
10845
|
+
outline-offset: var(--seed-dimension-x0_5);
|
|
10846
|
+
}
|
|
10847
|
+
|
|
10380
10848
|
.seed-side-panel__closeButton:is(:focus-visible, [data-focus-visible]) {
|
|
10381
10849
|
outline: var(--seed-dimension-x0_5) solid var(--seed-color-stroke-focus-ring);
|
|
10382
10850
|
outline-offset: var(--seed-dimension-x0_5);
|
|
@@ -10792,7 +11260,7 @@
|
|
|
10792
11260
|
background: var(--seed-color-bg-neutral-inverted);
|
|
10793
11261
|
border-radius: var(--seed-radius-r2);
|
|
10794
11262
|
width: 100%;
|
|
10795
|
-
max-width:
|
|
11263
|
+
max-width: 464px;
|
|
10796
11264
|
padding-inline: var(--seed-dimension-x2_5);
|
|
10797
11265
|
padding-block: var(--seed-dimension-x2_5);
|
|
10798
11266
|
min-height: 44px;
|
|
@@ -10873,6 +11341,14 @@
|
|
|
10873
11341
|
position: relative;
|
|
10874
11342
|
}
|
|
10875
11343
|
|
|
11344
|
+
.seed-snackbar__actionButton:is(:active, [data-active]) {
|
|
11345
|
+
scale: var(--seed-feedback-scale);
|
|
11346
|
+
}
|
|
11347
|
+
|
|
11348
|
+
.seed-snackbar__actionButton {
|
|
11349
|
+
transition: scale var(--seed-duration-pressed-scale) var(--seed-timing-function-pressed-scale);
|
|
11350
|
+
}
|
|
11351
|
+
|
|
10876
11352
|
.seed-snackbar__actionButton:after {
|
|
10877
11353
|
content: "";
|
|
10878
11354
|
top: 50%;
|
|
@@ -10989,11 +11465,15 @@
|
|
|
10989
11465
|
border-radius: var(--seed-radius-full);
|
|
10990
11466
|
background: var(--seed-color-palette-gray-600);
|
|
10991
11467
|
margin: var(--switchmark-margin-top, 0) 0;
|
|
10992
|
-
transition: background-color var(--seed-duration-d1) var(--seed-timing-function-easing) 20ms, opacity var(--seed-duration-d1) var(--seed-timing-function-easing), outline-color var(--seed-duration-d3) var(--seed-timing-function-easing);
|
|
11468
|
+
transition: background-color var(--seed-duration-d1) var(--seed-timing-function-easing) 20ms, opacity var(--seed-duration-d1) var(--seed-timing-function-easing), scale var(--seed-duration-pressed-scale) var(--seed-timing-function-pressed-scale), outline-color var(--seed-duration-d3) var(--seed-timing-function-easing);
|
|
10993
11469
|
display: block;
|
|
10994
11470
|
position: relative;
|
|
10995
11471
|
}
|
|
10996
11472
|
|
|
11473
|
+
.seed-switchmark__root:not(:is(:disabled, [disabled], [data-disabled])):is(:active, [data-active]) {
|
|
11474
|
+
scale: var(--seed-switchmark-feedback-scale, var(--seed-feedback-scale));
|
|
11475
|
+
}
|
|
11476
|
+
|
|
10997
11477
|
.seed-switchmark__root:is(:disabled, [disabled], [data-disabled]) {
|
|
10998
11478
|
opacity: .38;
|
|
10999
11479
|
}
|
|
@@ -11179,8 +11659,12 @@
|
|
|
11179
11659
|
bottom: 0;
|
|
11180
11660
|
}
|
|
11181
11661
|
|
|
11662
|
+
.seed-tabs__trigger:not(:is(:disabled, [disabled], [data-disabled])):is(:active, [data-active]) {
|
|
11663
|
+
scale: var(--seed-feedback-scale);
|
|
11664
|
+
}
|
|
11665
|
+
|
|
11182
11666
|
.seed-tabs__trigger {
|
|
11183
|
-
transition: outline-color var(--seed-duration-d3) var(--seed-timing-function-easing);
|
|
11667
|
+
transition: scale var(--seed-duration-pressed-scale) var(--seed-timing-function-pressed-scale), outline-color var(--seed-duration-d3) var(--seed-timing-function-easing);
|
|
11184
11668
|
outline: var(--seed-dimension-x0_5) solid transparent;
|
|
11185
11669
|
outline-offset: calc(var(--seed-dimension-x0_5) * -1);
|
|
11186
11670
|
}
|
|
@@ -12672,8 +13156,12 @@
|
|
|
12672
13156
|
cursor: not-allowed;
|
|
12673
13157
|
}
|
|
12674
13158
|
|
|
13159
|
+
.seed-toggle-button:not(:is(:disabled, [disabled], [data-disabled])):is(:active, [data-active]) {
|
|
13160
|
+
scale: var(--seed-feedback-scale);
|
|
13161
|
+
}
|
|
13162
|
+
|
|
12675
13163
|
.seed-toggle-button {
|
|
12676
|
-
transition: background-color var(--seed-duration-color-transition) var(--seed-timing-function-easing), outline-color var(--seed-duration-d3) var(--seed-timing-function-easing);
|
|
13164
|
+
transition: background-color var(--seed-duration-color-transition) var(--seed-timing-function-easing), scale var(--seed-duration-pressed-scale) var(--seed-timing-function-pressed-scale), outline-color var(--seed-duration-d3) var(--seed-timing-function-easing);
|
|
12677
13165
|
font-weight: var(--seed-font-weight-bold);
|
|
12678
13166
|
}
|
|
12679
13167
|
|
|
@@ -12912,7 +13400,7 @@
|
|
|
12912
13400
|
|
|
12913
13401
|
.seed-wheel-picker__selectionIndicator {
|
|
12914
13402
|
z-index: 0;
|
|
12915
|
-
inset-inline:
|
|
13403
|
+
inset-inline: var(--seed-dimension-x4);
|
|
12916
13404
|
height: var(--seed-wheel-picker-item-size);
|
|
12917
13405
|
pointer-events: none;
|
|
12918
13406
|
position: absolute;
|
|
@@ -12920,6 +13408,145 @@
|
|
|
12920
13408
|
transform: translateY(-50%);
|
|
12921
13409
|
}
|
|
12922
13410
|
|
|
13411
|
+
.seed-wheel-picker-public__root {
|
|
13412
|
+
background-color: var(--seed-color-bg-layer-floating);
|
|
13413
|
+
--seed-wheel-picker-public-item-color: var(--seed-color-fg-disabled);
|
|
13414
|
+
--seed-wheel-picker-public-selected-item-color: var(--seed-color-fg-neutral);
|
|
13415
|
+
--seed-wheel-picker-public-scroll-fog-size: min(calc(.4 * 100%), var(--seed-wheel-picker-public-scroll-fog-max-height));
|
|
13416
|
+
width: 100%;
|
|
13417
|
+
position: relative;
|
|
13418
|
+
overflow: hidden;
|
|
13419
|
+
}
|
|
13420
|
+
|
|
13421
|
+
.seed-wheel-picker-public__scrollFog {
|
|
13422
|
+
z-index: 1;
|
|
13423
|
+
height: 100%;
|
|
13424
|
+
position: relative;
|
|
13425
|
+
overflow: hidden;
|
|
13426
|
+
}
|
|
13427
|
+
|
|
13428
|
+
.seed-wheel-picker-public__columns {
|
|
13429
|
+
justify-content: center;
|
|
13430
|
+
width: 100%;
|
|
13431
|
+
height: 100%;
|
|
13432
|
+
display: flex;
|
|
13433
|
+
}
|
|
13434
|
+
|
|
13435
|
+
.seed-wheel-picker-public__column {
|
|
13436
|
+
box-sizing: border-box;
|
|
13437
|
+
overscroll-behavior-x: none;
|
|
13438
|
+
overscroll-behavior-y: contain;
|
|
13439
|
+
scroll-snap-type: y mandatory;
|
|
13440
|
+
scrollbar-width: none;
|
|
13441
|
+
-ms-overflow-style: none;
|
|
13442
|
+
touch-action: pan-y;
|
|
13443
|
+
cursor: grab;
|
|
13444
|
+
width: max-content;
|
|
13445
|
+
height: 100%;
|
|
13446
|
+
padding-block: var(--seed-wheel-picker-public-center-offset);
|
|
13447
|
+
outline: none;
|
|
13448
|
+
flex: none;
|
|
13449
|
+
overflow: hidden auto;
|
|
13450
|
+
}
|
|
13451
|
+
|
|
13452
|
+
.seed-wheel-picker-public__column:is(:disabled, [disabled], [data-disabled]) {
|
|
13453
|
+
cursor: default;
|
|
13454
|
+
--seed-wheel-picker-public-item-color: var(--seed-color-fg-disabled);
|
|
13455
|
+
--seed-wheel-picker-public-selected-item-color: var(--seed-color-fg-disabled);
|
|
13456
|
+
overflow-y: hidden;
|
|
13457
|
+
}
|
|
13458
|
+
|
|
13459
|
+
.seed-wheel-picker-public__column[data-wheel-picker-dragging] {
|
|
13460
|
+
cursor: grabbing;
|
|
13461
|
+
scroll-snap-type: none;
|
|
13462
|
+
}
|
|
13463
|
+
|
|
13464
|
+
.seed-wheel-picker-public__column[data-wheel-picker-scrolling] {
|
|
13465
|
+
scroll-snap-type: none;
|
|
13466
|
+
}
|
|
13467
|
+
|
|
13468
|
+
.seed-wheel-picker-public__column::-webkit-scrollbar {
|
|
13469
|
+
display: none;
|
|
13470
|
+
}
|
|
13471
|
+
|
|
13472
|
+
.seed-wheel-picker-public__column :is([aria-selected="true"], [data-selected]) {
|
|
13473
|
+
outline: var(--seed-dimension-x0_5) solid transparent;
|
|
13474
|
+
outline-offset: calc(var(--seed-dimension-x0_5) * -1);
|
|
13475
|
+
border-radius: var(--seed-radius-r2);
|
|
13476
|
+
transition: outline-color var(--seed-duration-d3) var(--seed-timing-function-easing);
|
|
13477
|
+
}
|
|
13478
|
+
|
|
13479
|
+
.seed-wheel-picker-public__column.seed-wheel-picker-public__column:is(:focus-visible, [data-focus-visible]):not([data-wheel-picker-pointer-focus]) :is([aria-selected="true"], [data-selected]) {
|
|
13480
|
+
outline: var(--seed-dimension-x0_5) solid var(--seed-color-stroke-focus-ring);
|
|
13481
|
+
outline-offset: calc(var(--seed-dimension-x0_5) * -1);
|
|
13482
|
+
}
|
|
13483
|
+
|
|
13484
|
+
.seed-wheel-picker-public__item {
|
|
13485
|
+
height: var(--seed-wheel-picker-public-item-size);
|
|
13486
|
+
min-height: var(--seed-wheel-picker-public-item-size);
|
|
13487
|
+
color: var(--seed-wheel-picker-public-item-color);
|
|
13488
|
+
scroll-snap-align: center;
|
|
13489
|
+
-webkit-user-select: none;
|
|
13490
|
+
user-select: none;
|
|
13491
|
+
justify-content: center;
|
|
13492
|
+
align-items: center;
|
|
13493
|
+
display: flex;
|
|
13494
|
+
}
|
|
13495
|
+
|
|
13496
|
+
.seed-wheel-picker-public__item[data-wheel-picker-indicator-overlap] {
|
|
13497
|
+
color: #0000;
|
|
13498
|
+
background-image: linear-gradient(to bottom, var(--seed-wheel-picker-public-item-color) 0%, var(--seed-wheel-picker-public-item-color) var(--seed-wheel-picker-indicator-overlap-start), var(--seed-wheel-picker-public-selected-item-color) var(--seed-wheel-picker-indicator-overlap-start), var(--seed-wheel-picker-public-selected-item-color) var(--seed-wheel-picker-indicator-overlap-end), var(--seed-wheel-picker-public-item-color) var(--seed-wheel-picker-indicator-overlap-end), var(--seed-wheel-picker-public-item-color) 100%);
|
|
13499
|
+
-webkit-text-fill-color: transparent;
|
|
13500
|
+
-webkit-background-clip: text;
|
|
13501
|
+
background-clip: text;
|
|
13502
|
+
}
|
|
13503
|
+
|
|
13504
|
+
.seed-wheel-picker-public__itemLabel {
|
|
13505
|
+
box-sizing: border-box;
|
|
13506
|
+
height: 100%;
|
|
13507
|
+
padding-inline: var(--seed-dimension-x4);
|
|
13508
|
+
font-weight: var(--seed-font-weight-medium);
|
|
13509
|
+
white-space: nowrap;
|
|
13510
|
+
flex-shrink: 0;
|
|
13511
|
+
justify-content: center;
|
|
13512
|
+
align-items: center;
|
|
13513
|
+
display: flex;
|
|
13514
|
+
}
|
|
13515
|
+
|
|
13516
|
+
.seed-wheel-picker-public__selectionIndicator {
|
|
13517
|
+
z-index: 0;
|
|
13518
|
+
inset-inline: var(--seed-dimension-x4);
|
|
13519
|
+
height: var(--seed-wheel-picker-public-item-size);
|
|
13520
|
+
border-radius: var(--seed-radius-r2);
|
|
13521
|
+
background-color: var(--seed-color-bg-neutral-weak);
|
|
13522
|
+
pointer-events: none;
|
|
13523
|
+
position: absolute;
|
|
13524
|
+
top: 50%;
|
|
13525
|
+
transform: translateY(-50%);
|
|
13526
|
+
}
|
|
13527
|
+
|
|
13528
|
+
.seed-wheel-picker-public__root--size_small {
|
|
13529
|
+
height: var(--seed-wheel-picker-public-viewport-size, 180px);
|
|
13530
|
+
--seed-wheel-picker-public-item-size: 36px;
|
|
13531
|
+
--seed-wheel-picker-public-scroll-fog-max-height: 108px;
|
|
13532
|
+
}
|
|
13533
|
+
|
|
13534
|
+
.seed-wheel-picker-public__itemLabel--size_small {
|
|
13535
|
+
font-size: var(--seed-font-size-t7-static);
|
|
13536
|
+
line-height: var(--seed-line-height-t7-static);
|
|
13537
|
+
}
|
|
13538
|
+
|
|
13539
|
+
.seed-wheel-picker-public__root--size_medium {
|
|
13540
|
+
height: var(--seed-wheel-picker-public-viewport-size, 220px);
|
|
13541
|
+
--seed-wheel-picker-public-item-size: 44px;
|
|
13542
|
+
--seed-wheel-picker-public-scroll-fog-max-height: 132px;
|
|
13543
|
+
}
|
|
13544
|
+
|
|
13545
|
+
.seed-wheel-picker-public__itemLabel--size_medium {
|
|
13546
|
+
font-size: var(--seed-font-size-t10-static);
|
|
13547
|
+
line-height: var(--seed-line-height-t10-static);
|
|
13548
|
+
}
|
|
13549
|
+
|
|
12923
13550
|
@keyframes seed-enter {
|
|
12924
13551
|
from {
|
|
12925
13552
|
opacity: var(--seed-enter-opacity, 1);
|
|
@@ -13079,6 +13706,12 @@
|
|
|
13079
13706
|
--seed-box-max-height: var(--seed-box-max-height-sm, initial);
|
|
13080
13707
|
}
|
|
13081
13708
|
|
|
13709
|
+
.seed-date-picker__root {
|
|
13710
|
+
--seed-box-height: var(--seed-box-height-sm, initial);
|
|
13711
|
+
--seed-box-min-height: var(--seed-box-min-height-sm, initial);
|
|
13712
|
+
--seed-box-max-height: var(--seed-box-max-height-sm, initial);
|
|
13713
|
+
}
|
|
13714
|
+
|
|
13082
13715
|
.seed-help-bubble__content {
|
|
13083
13716
|
--seed-box-max-width: var(--seed-box-max-width-sm, initial);
|
|
13084
13717
|
}
|
|
@@ -13175,6 +13808,12 @@
|
|
|
13175
13808
|
--seed-box-max-height: var(--seed-box-max-height-md, initial);
|
|
13176
13809
|
}
|
|
13177
13810
|
|
|
13811
|
+
.seed-date-picker__root {
|
|
13812
|
+
--seed-box-height: var(--seed-box-height-md, initial);
|
|
13813
|
+
--seed-box-min-height: var(--seed-box-min-height-md, initial);
|
|
13814
|
+
--seed-box-max-height: var(--seed-box-max-height-md, initial);
|
|
13815
|
+
}
|
|
13816
|
+
|
|
13178
13817
|
.seed-help-bubble__content {
|
|
13179
13818
|
--seed-box-max-width: var(--seed-box-max-width-md, initial);
|
|
13180
13819
|
}
|
|
@@ -13271,6 +13910,12 @@
|
|
|
13271
13910
|
--seed-box-max-height: var(--seed-box-max-height-lg, initial);
|
|
13272
13911
|
}
|
|
13273
13912
|
|
|
13913
|
+
.seed-date-picker__root {
|
|
13914
|
+
--seed-box-height: var(--seed-box-height-lg, initial);
|
|
13915
|
+
--seed-box-min-height: var(--seed-box-min-height-lg, initial);
|
|
13916
|
+
--seed-box-max-height: var(--seed-box-max-height-lg, initial);
|
|
13917
|
+
}
|
|
13918
|
+
|
|
13274
13919
|
.seed-help-bubble__content {
|
|
13275
13920
|
--seed-box-max-width: var(--seed-box-max-width-lg, initial);
|
|
13276
13921
|
}
|
|
@@ -13367,6 +14012,12 @@
|
|
|
13367
14012
|
--seed-box-max-height: var(--seed-box-max-height-xl, initial);
|
|
13368
14013
|
}
|
|
13369
14014
|
|
|
14015
|
+
.seed-date-picker__root {
|
|
14016
|
+
--seed-box-height: var(--seed-box-height-xl, initial);
|
|
14017
|
+
--seed-box-min-height: var(--seed-box-min-height-xl, initial);
|
|
14018
|
+
--seed-box-max-height: var(--seed-box-max-height-xl, initial);
|
|
14019
|
+
}
|
|
14020
|
+
|
|
13370
14021
|
.seed-help-bubble__content {
|
|
13371
14022
|
--seed-box-max-width: var(--seed-box-max-width-xl, initial);
|
|
13372
14023
|
}
|