@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.layered.css
CHANGED
|
@@ -24,6 +24,8 @@
|
|
|
24
24
|
--seed-font-size-limit-max: 1.5;
|
|
25
25
|
--seed-line-height-limit-min: .8;
|
|
26
26
|
--seed-line-height-limit-max: 1.5;
|
|
27
|
+
--seed-feedback-scale: 1;
|
|
28
|
+
--seed-feedback-scale-transition: scale var(--seed-duration-pressed-scale) var(--seed-timing-function-pressed-scale);
|
|
27
29
|
}
|
|
28
30
|
|
|
29
31
|
[data-seed-platform="ios"] {
|
|
@@ -381,6 +383,19 @@
|
|
|
381
383
|
display: block;
|
|
382
384
|
}
|
|
383
385
|
|
|
386
|
+
.seed-scale-feedback {
|
|
387
|
+
--seed-dynamic-scale-basis: max(var(--seed-element-height), var(--seed-element-width) / 4, 24);
|
|
388
|
+
--seed-dynamic-scale: calc((var(--seed-dynamic-scale-basis) - 2) / var(--seed-dynamic-scale-basis));
|
|
389
|
+
--seed-feedback-scale: var(--seed-dynamic-scale, 1);
|
|
390
|
+
scale: 1;
|
|
391
|
+
}
|
|
392
|
+
|
|
393
|
+
@media (prefers-reduced-motion: reduce) {
|
|
394
|
+
.seed-scale-feedback {
|
|
395
|
+
--seed-feedback-scale: 1;
|
|
396
|
+
}
|
|
397
|
+
}
|
|
398
|
+
|
|
384
399
|
:root, [data-seed-color-mode="system"] {
|
|
385
400
|
--lightningcss-light: initial;
|
|
386
401
|
--lightningcss-dark: ;
|
|
@@ -1357,7 +1372,7 @@
|
|
|
1357
1372
|
}
|
|
1358
1373
|
|
|
1359
1374
|
.seed-accordion__item--variant_separated {
|
|
1360
|
-
box-shadow: inset 0 0 0 1px var(--seed-color-stroke-neutral-
|
|
1375
|
+
box-shadow: inset 0 0 0 1px var(--seed-color-stroke-neutral-weak);
|
|
1361
1376
|
border-radius: var(--seed-radius-r3);
|
|
1362
1377
|
overflow: hidden;
|
|
1363
1378
|
}
|
|
@@ -1577,9 +1592,12 @@
|
|
|
1577
1592
|
cursor: not-allowed;
|
|
1578
1593
|
}
|
|
1579
1594
|
|
|
1595
|
+
.seed-action-button:not(:is(:disabled, [disabled], [data-disabled])):is(:active, [data-active]) {
|
|
1596
|
+
scale: var(--seed-feedback-scale);
|
|
1597
|
+
}
|
|
1598
|
+
|
|
1580
1599
|
.seed-action-button {
|
|
1581
1600
|
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);
|
|
1582
|
-
scale: 1;
|
|
1583
1601
|
}
|
|
1584
1602
|
|
|
1585
1603
|
.seed-action-button--variant_brandSolid {
|
|
@@ -1847,10 +1865,6 @@
|
|
|
1847
1865
|
--seed-icon-size: var(--seed-dimension-x3_5);
|
|
1848
1866
|
}
|
|
1849
1867
|
|
|
1850
|
-
.seed-action-button--size_xsmall:not(:is(:disabled, [disabled], [data-disabled])):is(:active, [data-active]) {
|
|
1851
|
-
scale: var(--seed-scale-s95);
|
|
1852
|
-
}
|
|
1853
|
-
|
|
1854
1868
|
.seed-action-button--size_small {
|
|
1855
1869
|
height: var(--seed-dimension-x9);
|
|
1856
1870
|
border-radius: var(--seed-radius-r2);
|
|
@@ -1861,10 +1875,6 @@
|
|
|
1861
1875
|
--seed-icon-size: var(--seed-dimension-x4);
|
|
1862
1876
|
}
|
|
1863
1877
|
|
|
1864
|
-
.seed-action-button--size_small:not(:is(:disabled, [disabled], [data-disabled])):is(:active, [data-active]) {
|
|
1865
|
-
scale: var(--seed-scale-s97);
|
|
1866
|
-
}
|
|
1867
|
-
|
|
1868
1878
|
.seed-action-button--size_medium {
|
|
1869
1879
|
height: var(--seed-dimension-x10);
|
|
1870
1880
|
border-radius: var(--seed-radius-r2);
|
|
@@ -1875,10 +1885,6 @@
|
|
|
1875
1885
|
--seed-icon-size: 18px;
|
|
1876
1886
|
}
|
|
1877
1887
|
|
|
1878
|
-
.seed-action-button--size_medium:not(:is(:disabled, [disabled], [data-disabled])):is(:active, [data-active]) {
|
|
1879
|
-
scale: var(--seed-scale-s97);
|
|
1880
|
-
}
|
|
1881
|
-
|
|
1882
1888
|
.seed-action-button--size_large {
|
|
1883
1889
|
height: var(--seed-dimension-x13);
|
|
1884
1890
|
border-radius: var(--seed-radius-r3);
|
|
@@ -1889,10 +1895,6 @@
|
|
|
1889
1895
|
--seed-icon-size: 22px;
|
|
1890
1896
|
}
|
|
1891
1897
|
|
|
1892
|
-
.seed-action-button--size_large:not(:is(:disabled, [disabled], [data-disabled])):is(:active, [data-active]) {
|
|
1893
|
-
scale: var(--seed-scale-s98);
|
|
1894
|
-
}
|
|
1895
|
-
|
|
1896
1898
|
.seed-action-button--size_xsmall-layout_withText {
|
|
1897
1899
|
gap: var(--seed-dimension-x1);
|
|
1898
1900
|
--seed-box-padding-left: var(--seed-dimension-x3_5);
|
|
@@ -3105,6 +3107,7 @@
|
|
|
3105
3107
|
background: var(--seed-color-bg-layer-floating);
|
|
3106
3108
|
border-top-left-radius: var(--seed-radius-r6);
|
|
3107
3109
|
border-top-right-radius: var(--seed-radius-r6);
|
|
3110
|
+
max-width: 480px;
|
|
3108
3111
|
padding-bottom: var(--seed-safe-area-bottom);
|
|
3109
3112
|
touch-action: none;
|
|
3110
3113
|
will-change: transform;
|
|
@@ -3215,8 +3218,6 @@
|
|
|
3215
3218
|
border-radius: var(--seed-radius-full);
|
|
3216
3219
|
background: var(--seed-color-bg-neutral-weak);
|
|
3217
3220
|
cursor: pointer;
|
|
3218
|
-
--seed-icon-size: 14px;
|
|
3219
|
-
--seed-icon-color: var(--seed-color-fg-neutral);
|
|
3220
3221
|
border: none;
|
|
3221
3222
|
justify-content: center;
|
|
3222
3223
|
align-items: center;
|
|
@@ -3226,6 +3227,16 @@
|
|
|
3226
3227
|
position: absolute;
|
|
3227
3228
|
}
|
|
3228
3229
|
|
|
3230
|
+
.seed-bottom-sheet__closeButton:is(:active, [data-active]) {
|
|
3231
|
+
scale: var(--seed-feedback-scale);
|
|
3232
|
+
}
|
|
3233
|
+
|
|
3234
|
+
.seed-bottom-sheet__closeButton {
|
|
3235
|
+
transition: scale var(--seed-duration-pressed-scale) var(--seed-timing-function-pressed-scale);
|
|
3236
|
+
--seed-icon-size: 14px;
|
|
3237
|
+
--seed-icon-color: var(--seed-color-fg-neutral);
|
|
3238
|
+
}
|
|
3239
|
+
|
|
3229
3240
|
.seed-bottom-sheet__closeButton:after {
|
|
3230
3241
|
content: "";
|
|
3231
3242
|
border-radius: var(--seed-radius-r1);
|
|
@@ -3375,7 +3386,14 @@
|
|
|
3375
3386
|
|
|
3376
3387
|
.seed-callout__root:is(button, a) {
|
|
3377
3388
|
cursor: pointer;
|
|
3378
|
-
transition: outline-color var(--seed-duration-d3) var(--seed-timing-function-easing);
|
|
3389
|
+
transition: scale var(--seed-duration-pressed-scale) var(--seed-timing-function-pressed-scale), outline-color var(--seed-duration-d3) var(--seed-timing-function-easing);
|
|
3390
|
+
}
|
|
3391
|
+
|
|
3392
|
+
.seed-callout__root:is(button, a):is(:active, [data-active]) {
|
|
3393
|
+
scale: var(--seed-feedback-scale);
|
|
3394
|
+
}
|
|
3395
|
+
|
|
3396
|
+
.seed-callout__root:is(button, a) {
|
|
3379
3397
|
outline: var(--seed-dimension-x0_5) solid transparent;
|
|
3380
3398
|
outline-offset: var(--seed-dimension-x0_5);
|
|
3381
3399
|
}
|
|
@@ -3436,15 +3454,13 @@
|
|
|
3436
3454
|
}
|
|
3437
3455
|
|
|
3438
3456
|
.seed-callout__closeButton {
|
|
3457
|
+
background-color: var(--seed-color-bg-transparent);
|
|
3439
3458
|
cursor: pointer;
|
|
3440
3459
|
width: var(--seed-dimension-x10);
|
|
3441
3460
|
height: var(--seed-dimension-x10);
|
|
3442
3461
|
margin: calc((var(--seed-dimension-x10) - var(--seed-dimension-x4)) * -.5);
|
|
3443
|
-
border-radius: var(--seed-radius-
|
|
3444
|
-
|
|
3445
|
-
outline: var(--seed-dimension-x0_5) solid transparent;
|
|
3446
|
-
outline-offset: var(--seed-dimension-x0_5);
|
|
3447
|
-
background-color: #0000;
|
|
3462
|
+
border-radius: var(--seed-radius-r2);
|
|
3463
|
+
--seed-suffix-icon-size: var(--seed-dimension-x4);
|
|
3448
3464
|
border: none;
|
|
3449
3465
|
flex-grow: 0;
|
|
3450
3466
|
flex-shrink: 0;
|
|
@@ -3454,11 +3470,33 @@
|
|
|
3454
3470
|
display: flex;
|
|
3455
3471
|
}
|
|
3456
3472
|
|
|
3473
|
+
.seed-callout__closeButton:is(:active, [data-active]) {
|
|
3474
|
+
scale: var(--seed-feedback-scale);
|
|
3475
|
+
}
|
|
3476
|
+
|
|
3477
|
+
.seed-callout__closeButton {
|
|
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-dimension-x0_5) solid transparent;
|
|
3480
|
+
outline-offset: var(--seed-dimension-x0_5);
|
|
3481
|
+
}
|
|
3482
|
+
|
|
3457
3483
|
.seed-callout__closeButton:is(:focus-visible, [data-focus-visible]) {
|
|
3458
3484
|
outline: var(--seed-dimension-x0_5) solid var(--seed-color-stroke-focus-ring);
|
|
3459
3485
|
outline-offset: var(--seed-dimension-x0_5);
|
|
3460
3486
|
}
|
|
3461
3487
|
|
|
3488
|
+
@media (hover: hover) and (pointer: fine) {
|
|
3489
|
+
.seed-callout__closeButton:is(:hover, [data-hover]) {
|
|
3490
|
+
background-color: var(--seed-color-bg-transparent-pressed);
|
|
3491
|
+
}
|
|
3492
|
+
}
|
|
3493
|
+
|
|
3494
|
+
@media not all and (hover: hover) and (pointer: fine) {
|
|
3495
|
+
.seed-callout__closeButton:is(:active, [data-active]) {
|
|
3496
|
+
background-color: var(--seed-color-bg-transparent-pressed);
|
|
3497
|
+
}
|
|
3498
|
+
}
|
|
3499
|
+
|
|
3462
3500
|
.seed-callout__root--tone_neutral {
|
|
3463
3501
|
background-color: var(--seed-color-bg-neutral-weak);
|
|
3464
3502
|
--seed-prefix-icon-color: var(--seed-color-fg-neutral);
|
|
@@ -3481,6 +3519,10 @@
|
|
|
3481
3519
|
color: var(--seed-color-fg-neutral);
|
|
3482
3520
|
}
|
|
3483
3521
|
|
|
3522
|
+
.seed-callout__closeButton--tone_neutral {
|
|
3523
|
+
--seed-suffix-icon-color: var(--seed-color-fg-neutral);
|
|
3524
|
+
}
|
|
3525
|
+
|
|
3484
3526
|
.seed-callout__root--tone_informative {
|
|
3485
3527
|
background-color: var(--seed-color-bg-informative-weak);
|
|
3486
3528
|
--seed-prefix-icon-color: var(--seed-color-fg-informative-contrast);
|
|
@@ -3503,6 +3545,10 @@
|
|
|
3503
3545
|
color: var(--seed-color-fg-informative-contrast);
|
|
3504
3546
|
}
|
|
3505
3547
|
|
|
3548
|
+
.seed-callout__closeButton--tone_informative {
|
|
3549
|
+
--seed-suffix-icon-color: var(--seed-color-fg-informative-contrast);
|
|
3550
|
+
}
|
|
3551
|
+
|
|
3506
3552
|
.seed-callout__root--tone_positive {
|
|
3507
3553
|
background-color: var(--seed-color-bg-positive-weak);
|
|
3508
3554
|
--seed-prefix-icon-color: var(--seed-color-fg-positive-contrast);
|
|
@@ -3525,6 +3571,10 @@
|
|
|
3525
3571
|
color: var(--seed-color-fg-positive-contrast);
|
|
3526
3572
|
}
|
|
3527
3573
|
|
|
3574
|
+
.seed-callout__closeButton--tone_positive {
|
|
3575
|
+
--seed-suffix-icon-color: var(--seed-color-fg-positive-contrast);
|
|
3576
|
+
}
|
|
3577
|
+
|
|
3528
3578
|
.seed-callout__root--tone_warning {
|
|
3529
3579
|
background-color: var(--seed-color-bg-warning-weak);
|
|
3530
3580
|
--seed-prefix-icon-color: var(--seed-color-fg-warning-contrast);
|
|
@@ -3547,6 +3597,10 @@
|
|
|
3547
3597
|
color: var(--seed-color-fg-warning-contrast);
|
|
3548
3598
|
}
|
|
3549
3599
|
|
|
3600
|
+
.seed-callout__closeButton--tone_warning {
|
|
3601
|
+
--seed-suffix-icon-color: var(--seed-color-fg-warning-contrast);
|
|
3602
|
+
}
|
|
3603
|
+
|
|
3550
3604
|
.seed-callout__root--tone_critical {
|
|
3551
3605
|
background-color: var(--seed-color-bg-critical-weak);
|
|
3552
3606
|
--seed-prefix-icon-color: var(--seed-color-fg-critical-contrast);
|
|
@@ -3569,6 +3623,10 @@
|
|
|
3569
3623
|
color: var(--seed-color-fg-critical-contrast);
|
|
3570
3624
|
}
|
|
3571
3625
|
|
|
3626
|
+
.seed-callout__closeButton--tone_critical {
|
|
3627
|
+
--seed-suffix-icon-color: var(--seed-color-fg-critical-contrast);
|
|
3628
|
+
}
|
|
3629
|
+
|
|
3572
3630
|
.seed-callout__root--tone_magic {
|
|
3573
3631
|
background-image: linear-gradient(88deg, var(--seed-gradient-glow-magic));
|
|
3574
3632
|
--seed-prefix-icon-color: var(--seed-color-fg-neutral);
|
|
@@ -3591,6 +3649,10 @@
|
|
|
3591
3649
|
color: var(--seed-color-fg-neutral);
|
|
3592
3650
|
}
|
|
3593
3651
|
|
|
3652
|
+
.seed-callout__closeButton--tone_magic {
|
|
3653
|
+
--seed-suffix-icon-color: var(--seed-color-fg-neutral);
|
|
3654
|
+
}
|
|
3655
|
+
|
|
3594
3656
|
.seed-checkbox__root {
|
|
3595
3657
|
vertical-align: top;
|
|
3596
3658
|
isolation: isolate;
|
|
@@ -3653,13 +3715,20 @@
|
|
|
3653
3715
|
.seed-checkmark__root {
|
|
3654
3716
|
box-sizing: border-box;
|
|
3655
3717
|
margin-top: var(--checkmark-margin-top, 0);
|
|
3656
|
-
transition: background-color var(--seed-duration-color-transition) var(--seed-timing-function-easing), outline-color var(--seed-duration-d3) var(--seed-timing-function-easing);
|
|
3657
|
-
outline: var(--seed-focus-ring, var(--seed-dimension-x0_5) solid transparent);
|
|
3658
|
-
outline-offset: var(--seed-dimension-x0_5);
|
|
3659
3718
|
flex: none;
|
|
3660
3719
|
position: relative;
|
|
3661
3720
|
}
|
|
3662
3721
|
|
|
3722
|
+
.seed-checkmark__root:not(:is(:disabled, [disabled], [data-disabled])):is(:active, [data-active]) {
|
|
3723
|
+
scale: var(--seed-checkmark-feedback-scale, var(--seed-feedback-scale));
|
|
3724
|
+
}
|
|
3725
|
+
|
|
3726
|
+
.seed-checkmark__root {
|
|
3727
|
+
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);
|
|
3728
|
+
outline: var(--seed-focus-ring, var(--seed-dimension-x0_5) solid transparent);
|
|
3729
|
+
outline-offset: var(--seed-dimension-x0_5);
|
|
3730
|
+
}
|
|
3731
|
+
|
|
3663
3732
|
.seed-checkmark__root:is(:focus-visible, [data-focus-visible]) {
|
|
3664
3733
|
outline: var(--seed-focus-ring, var(--seed-dimension-x0_5) solid var(--seed-color-stroke-focus-ring));
|
|
3665
3734
|
outline-offset: var(--seed-dimension-x0_5);
|
|
@@ -3845,21 +3914,26 @@
|
|
|
3845
3914
|
-webkit-font-smoothing: antialiased;
|
|
3846
3915
|
-moz-osx-font-smoothing: grayscale;
|
|
3847
3916
|
border-radius: var(--seed-radius-full);
|
|
3848
|
-
transition-duration: var(--seed-duration-color-transition);
|
|
3849
|
-
transition-timing-function: var(--seed-timing-function-easing);
|
|
3850
|
-
outline: var(--seed-dimension-x0_5) solid transparent;
|
|
3851
|
-
outline-offset: var(--seed-dimension-x0_5);
|
|
3852
3917
|
border: none;
|
|
3853
3918
|
flex-shrink: 0;
|
|
3854
3919
|
justify-content: center;
|
|
3855
3920
|
align-items: center;
|
|
3856
3921
|
font-family: inherit;
|
|
3857
3922
|
line-height: 1;
|
|
3858
|
-
transition-property: background-color, color, border-color, box-shadow, outline-color;
|
|
3859
3923
|
display: inline-flex;
|
|
3860
3924
|
position: relative;
|
|
3861
3925
|
}
|
|
3862
3926
|
|
|
3927
|
+
.seed-chip__root:not(:is(:disabled, [disabled], [data-disabled])):is(:active, [data-active]) {
|
|
3928
|
+
scale: var(--seed-feedback-scale);
|
|
3929
|
+
}
|
|
3930
|
+
|
|
3931
|
+
.seed-chip__root {
|
|
3932
|
+
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);
|
|
3933
|
+
outline: var(--seed-dimension-x0_5) solid transparent;
|
|
3934
|
+
outline-offset: var(--seed-dimension-x0_5);
|
|
3935
|
+
}
|
|
3936
|
+
|
|
3863
3937
|
.seed-chip__root:is(:focus-visible, [data-focus-visible]) {
|
|
3864
3938
|
outline: var(--seed-dimension-x0_5) solid var(--seed-color-stroke-focus-ring);
|
|
3865
3939
|
outline-offset: var(--seed-dimension-x0_5);
|
|
@@ -4167,9 +4241,6 @@
|
|
|
4167
4241
|
border-radius: var(--seed-radius-full);
|
|
4168
4242
|
font-family: inherit;
|
|
4169
4243
|
font-weight: var(--seed-font-weight-medium);
|
|
4170
|
-
transition: background-color var(--seed-duration-color-transition) var(--seed-timing-function-easing), outline-color var(--seed-duration-d3) var(--seed-timing-function-easing);
|
|
4171
|
-
outline: var(--seed-dimension-x0_5) solid transparent;
|
|
4172
|
-
outline-offset: var(--seed-dimension-x0_5);
|
|
4173
4244
|
border: none;
|
|
4174
4245
|
flex-shrink: 0;
|
|
4175
4246
|
justify-content: center;
|
|
@@ -4177,6 +4248,16 @@
|
|
|
4177
4248
|
display: flex;
|
|
4178
4249
|
}
|
|
4179
4250
|
|
|
4251
|
+
.seed-chip-tabs__trigger:not(:is(:disabled, [disabled], [data-disabled])):is(:active, [data-active]) {
|
|
4252
|
+
scale: var(--seed-feedback-scale);
|
|
4253
|
+
}
|
|
4254
|
+
|
|
4255
|
+
.seed-chip-tabs__trigger {
|
|
4256
|
+
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);
|
|
4257
|
+
outline: var(--seed-dimension-x0_5) solid transparent;
|
|
4258
|
+
outline-offset: var(--seed-dimension-x0_5);
|
|
4259
|
+
}
|
|
4260
|
+
|
|
4180
4261
|
.seed-chip-tabs__trigger:is(:focus-visible, [data-focus-visible]) {
|
|
4181
4262
|
outline: var(--seed-dimension-x0_5) solid var(--seed-color-stroke-focus-ring);
|
|
4182
4263
|
outline-offset: var(--seed-dimension-x0_5);
|
|
@@ -4513,7 +4594,7 @@
|
|
|
4513
4594
|
background: var(--seed-color-bg-transparent);
|
|
4514
4595
|
border-radius: var(--seed-radius-r3);
|
|
4515
4596
|
cursor: pointer;
|
|
4516
|
-
transition: background var(--seed-duration-color-transition) var(--seed-timing-function-easing), outline-color var(--seed-duration-d3) var(--seed-timing-function-easing);
|
|
4597
|
+
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);
|
|
4517
4598
|
--seed-icon-size: 22px;
|
|
4518
4599
|
--seed-icon-color: var(--seed-color-fg-neutral-subtle);
|
|
4519
4600
|
outline: var(--seed-dimension-x0_5) solid transparent;
|
|
@@ -4532,6 +4613,10 @@
|
|
|
4532
4613
|
outline-offset: var(--seed-dimension-x0_5);
|
|
4533
4614
|
}
|
|
4534
4615
|
|
|
4616
|
+
.seed-content-dialog__closeButton:is(:active, [data-active]) {
|
|
4617
|
+
scale: var(--seed-feedback-scale);
|
|
4618
|
+
}
|
|
4619
|
+
|
|
4535
4620
|
@media (hover: hover) and (pointer: fine) {
|
|
4536
4621
|
.seed-content-dialog__closeButton:is(:hover, [data-hover]) {
|
|
4537
4622
|
background: var(--seed-color-bg-transparent-pressed);
|
|
@@ -4624,7 +4709,14 @@
|
|
|
4624
4709
|
--seed-icon-size: 22px;
|
|
4625
4710
|
--size: 16px;
|
|
4626
4711
|
--thickness: 2px;
|
|
4627
|
-
|
|
4712
|
+
}
|
|
4713
|
+
|
|
4714
|
+
.seed-contextual-floating-button:not(:is(:disabled, [disabled], [data-disabled])):is(:active, [data-active]) {
|
|
4715
|
+
scale: var(--seed-feedback-scale);
|
|
4716
|
+
}
|
|
4717
|
+
|
|
4718
|
+
.seed-contextual-floating-button {
|
|
4719
|
+
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);
|
|
4628
4720
|
}
|
|
4629
4721
|
|
|
4630
4722
|
.seed-contextual-floating-button--variant_solid {
|
|
@@ -4805,8 +4897,29 @@
|
|
|
4805
4897
|
|
|
4806
4898
|
.seed-date-picker__root {
|
|
4807
4899
|
box-sizing: border-box;
|
|
4900
|
+
--seed-box-height-base: auto;
|
|
4901
|
+
--seed-box-height-sm: var(--seed-box-height-base, initial);
|
|
4902
|
+
--seed-box-height-md: var(--seed-box-height-sm, initial);
|
|
4903
|
+
--seed-box-height-lg: var(--seed-box-height-md, initial);
|
|
4904
|
+
--seed-box-height-xl: var(--seed-box-height-lg, initial);
|
|
4905
|
+
--seed-box-height: var(--seed-box-height-base, initial);
|
|
4906
|
+
--seed-box-min-height-base: auto;
|
|
4907
|
+
--seed-box-min-height-sm: var(--seed-box-min-height-base, initial);
|
|
4908
|
+
--seed-box-min-height-md: var(--seed-box-min-height-sm, initial);
|
|
4909
|
+
--seed-box-min-height-lg: var(--seed-box-min-height-md, initial);
|
|
4910
|
+
--seed-box-min-height-xl: var(--seed-box-min-height-lg, initial);
|
|
4911
|
+
--seed-box-min-height: var(--seed-box-min-height-base, initial);
|
|
4912
|
+
--seed-box-max-height-base: none;
|
|
4913
|
+
--seed-box-max-height-sm: var(--seed-box-max-height-base, initial);
|
|
4914
|
+
--seed-box-max-height-md: var(--seed-box-max-height-sm, initial);
|
|
4915
|
+
--seed-box-max-height-lg: var(--seed-box-max-height-md, initial);
|
|
4916
|
+
--seed-box-max-height-xl: var(--seed-box-max-height-lg, initial);
|
|
4917
|
+
--seed-box-max-height: var(--seed-box-max-height-base, initial);
|
|
4808
4918
|
width: 100%;
|
|
4809
4919
|
min-width: 0;
|
|
4920
|
+
height: var(--seed-box-height);
|
|
4921
|
+
min-height: var(--seed-box-min-height);
|
|
4922
|
+
max-height: var(--seed-box-max-height);
|
|
4810
4923
|
color: var(--seed-color-fg-neutral-muted);
|
|
4811
4924
|
background-color: var(--seed-color-bg-layer-floating);
|
|
4812
4925
|
position: relative;
|
|
@@ -5253,11 +5366,6 @@
|
|
|
5253
5366
|
grid-template-columns: repeat(2, minmax(0, 1fr));
|
|
5254
5367
|
}
|
|
5255
5368
|
|
|
5256
|
-
.seed-date-picker__root--visibleRange_continuous {
|
|
5257
|
-
height: 100%;
|
|
5258
|
-
min-height: 0;
|
|
5259
|
-
}
|
|
5260
|
-
|
|
5261
5369
|
.seed-date-picker__weekdayRow--visibleRange_continuous {
|
|
5262
5370
|
position: sticky;
|
|
5263
5371
|
top: 0;
|
|
@@ -5843,11 +5951,12 @@
|
|
|
5843
5951
|
align-items: center;
|
|
5844
5952
|
gap: var(--seed-dimension-x2_5);
|
|
5845
5953
|
border-radius: var(--seed-radius-r3);
|
|
5954
|
+
height: 80px;
|
|
5955
|
+
transition: scale var(--seed-duration-pressed-scale) var(--seed-timing-function-pressed-scale);
|
|
5846
5956
|
--remove-button-mask-size: var(--seed-dimension-x6);
|
|
5847
5957
|
--remove-button-mask-offset: var(--seed-dimension-x1_5);
|
|
5848
5958
|
outline: var(--seed-dimension-x0_5) solid transparent;
|
|
5849
5959
|
outline-offset: var(--seed-dimension-x0_5);
|
|
5850
|
-
height: 80px;
|
|
5851
5960
|
display: flex;
|
|
5852
5961
|
position: relative;
|
|
5853
5962
|
}
|
|
@@ -5885,6 +5994,7 @@
|
|
|
5885
5994
|
}
|
|
5886
5995
|
|
|
5887
5996
|
.seed-attachment-input-item__root[aria-grabbed="true"] {
|
|
5997
|
+
scale: var(--seed-feedback-scale);
|
|
5888
5998
|
--remove-button-mask-size: 0px;
|
|
5889
5999
|
--remove-button-mask-offset: 0px;
|
|
5890
6000
|
}
|
|
@@ -5979,9 +6089,6 @@
|
|
|
5979
6089
|
font: inherit;
|
|
5980
6090
|
cursor: pointer;
|
|
5981
6091
|
border-radius: inherit;
|
|
5982
|
-
transition: outline-color var(--seed-duration-d3) var(--seed-timing-function-easing);
|
|
5983
|
-
outline: var(--seed-dimension-x0_5) solid transparent;
|
|
5984
|
-
outline-offset: calc(var(--seed-dimension-x0_5) * -1);
|
|
5985
6092
|
background: none;
|
|
5986
6093
|
border: none;
|
|
5987
6094
|
flex-direction: column;
|
|
@@ -5991,6 +6098,16 @@
|
|
|
5991
6098
|
display: flex;
|
|
5992
6099
|
}
|
|
5993
6100
|
|
|
6101
|
+
.seed-attachment-input-item__actionButton:not(:is(:disabled, [disabled], [data-disabled])):is(:active, [data-active]) {
|
|
6102
|
+
scale: var(--seed-feedback-scale);
|
|
6103
|
+
}
|
|
6104
|
+
|
|
6105
|
+
.seed-attachment-input-item__actionButton {
|
|
6106
|
+
transition: scale var(--seed-duration-pressed-scale) var(--seed-timing-function-pressed-scale), outline-color var(--seed-duration-d3) var(--seed-timing-function-easing);
|
|
6107
|
+
outline: var(--seed-dimension-x0_5) solid transparent;
|
|
6108
|
+
outline-offset: calc(var(--seed-dimension-x0_5) * -1);
|
|
6109
|
+
}
|
|
6110
|
+
|
|
5994
6111
|
.seed-attachment-input-item__actionButton:is(:focus-visible, [data-focus-visible]) {
|
|
5995
6112
|
outline: var(--seed-dimension-x0_5) solid var(--seed-color-stroke-focus-ring);
|
|
5996
6113
|
outline-offset: calc(var(--seed-dimension-x0_5) * -1);
|
|
@@ -6012,9 +6129,6 @@
|
|
|
6012
6129
|
background-color: var(--seed-color-bg-layer-default);
|
|
6013
6130
|
border-radius: var(--seed-radius-full);
|
|
6014
6131
|
cursor: pointer;
|
|
6015
|
-
transition: background-color .2s, outline-color var(--seed-duration-d3) var(--seed-timing-function-easing);
|
|
6016
|
-
outline: var(--seed-dimension-x0_5) solid transparent;
|
|
6017
|
-
outline-offset: calc(var(--seed-dimension-x0_5) * -1);
|
|
6018
6132
|
border: none;
|
|
6019
6133
|
justify-content: center;
|
|
6020
6134
|
align-items: center;
|
|
@@ -6023,6 +6137,16 @@
|
|
|
6023
6137
|
position: absolute;
|
|
6024
6138
|
}
|
|
6025
6139
|
|
|
6140
|
+
.seed-attachment-input-item__removeButton:not(:is(:disabled, [disabled], [data-disabled])):is(:active, [data-active]) {
|
|
6141
|
+
scale: var(--seed-feedback-scale);
|
|
6142
|
+
}
|
|
6143
|
+
|
|
6144
|
+
.seed-attachment-input-item__removeButton {
|
|
6145
|
+
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);
|
|
6146
|
+
outline: var(--seed-dimension-x0_5) solid transparent;
|
|
6147
|
+
outline-offset: calc(var(--seed-dimension-x0_5) * -1);
|
|
6148
|
+
}
|
|
6149
|
+
|
|
6026
6150
|
.seed-attachment-input-item__removeButton:is(:focus-visible, [data-focus-visible]) {
|
|
6027
6151
|
outline: var(--seed-dimension-x0_5) solid var(--seed-color-stroke-focus-ring);
|
|
6028
6152
|
outline-offset: calc(var(--seed-dimension-x0_5) * -1);
|
|
@@ -6087,7 +6211,7 @@
|
|
|
6087
6211
|
|
|
6088
6212
|
.seed-attachment-input-item__root--type_image {
|
|
6089
6213
|
width: 80px;
|
|
6090
|
-
transition: opacity .2s;
|
|
6214
|
+
transition: opacity .2s, scale var(--seed-duration-pressed-scale) var(--seed-timing-function-pressed-scale);
|
|
6091
6215
|
}
|
|
6092
6216
|
|
|
6093
6217
|
.seed-attachment-input-item__root--type_image:before {
|
|
@@ -6145,9 +6269,6 @@
|
|
|
6145
6269
|
box-shadow: inset 0 0 0 1px var(--seed-color-stroke-neutral-weak);
|
|
6146
6270
|
cursor: pointer;
|
|
6147
6271
|
border-radius: var(--seed-radius-r3);
|
|
6148
|
-
transition: background-color .2s, outline-color var(--seed-duration-d3) var(--seed-timing-function-easing);
|
|
6149
|
-
outline: var(--seed-dimension-x0_5) solid transparent;
|
|
6150
|
-
outline-offset: calc(var(--seed-dimension-x0_5) * -1);
|
|
6151
6272
|
background-color: #0000;
|
|
6152
6273
|
border: none;
|
|
6153
6274
|
flex-direction: column;
|
|
@@ -6156,6 +6277,16 @@
|
|
|
6156
6277
|
display: flex;
|
|
6157
6278
|
}
|
|
6158
6279
|
|
|
6280
|
+
.seed-attachment-input-trigger__root:not(:is(:disabled, [disabled], [data-disabled])):is(:active, [data-active]) {
|
|
6281
|
+
scale: var(--seed-feedback-scale);
|
|
6282
|
+
}
|
|
6283
|
+
|
|
6284
|
+
.seed-attachment-input-trigger__root {
|
|
6285
|
+
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);
|
|
6286
|
+
outline: var(--seed-dimension-x0_5) solid transparent;
|
|
6287
|
+
outline-offset: calc(var(--seed-dimension-x0_5) * -1);
|
|
6288
|
+
}
|
|
6289
|
+
|
|
6159
6290
|
.seed-attachment-input-trigger__root:is(:focus-visible, [data-focus-visible]) {
|
|
6160
6291
|
outline: var(--seed-dimension-x0_5) solid var(--seed-color-stroke-focus-ring);
|
|
6161
6292
|
outline-offset: calc(var(--seed-dimension-x0_5) * -1);
|
|
@@ -6252,11 +6383,18 @@
|
|
|
6252
6383
|
font-size: var(--seed-font-size-t5);
|
|
6253
6384
|
line-height: var(--seed-line-height-t5);
|
|
6254
6385
|
font-weight: var(--seed-font-weight-bold);
|
|
6255
|
-
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);
|
|
6256
6386
|
position: relative;
|
|
6257
6387
|
overflow: hidden;
|
|
6258
6388
|
}
|
|
6259
6389
|
|
|
6390
|
+
.seed-floating-action-button__root:not(:is(:disabled, [disabled], [data-disabled])):is(:active, [data-active]) {
|
|
6391
|
+
scale: var(--seed-feedback-scale);
|
|
6392
|
+
}
|
|
6393
|
+
|
|
6394
|
+
.seed-floating-action-button__root {
|
|
6395
|
+
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);
|
|
6396
|
+
}
|
|
6397
|
+
|
|
6260
6398
|
@media (hover: hover) and (pointer: fine) {
|
|
6261
6399
|
.seed-floating-action-button__root:is(:hover, [data-hover]) {
|
|
6262
6400
|
background: var(--seed-color-bg-brand-solid-pressed);
|
|
@@ -6376,11 +6514,12 @@
|
|
|
6376
6514
|
}
|
|
6377
6515
|
|
|
6378
6516
|
.seed-help-bubble__content {
|
|
6517
|
+
box-sizing: border-box;
|
|
6379
6518
|
background: var(--seed-color-bg-neutral-inverted);
|
|
6380
6519
|
padding-inline: var(--seed-dimension-x3);
|
|
6381
6520
|
padding-block: var(--seed-dimension-x2_5);
|
|
6382
6521
|
border-radius: var(--seed-radius-r3);
|
|
6383
|
-
--seed-box-max-width-base:
|
|
6522
|
+
--seed-box-max-width-base: 280px;
|
|
6384
6523
|
--seed-box-max-width-sm: var(--seed-box-max-width-base, initial);
|
|
6385
6524
|
--seed-box-max-width-md: var(--seed-box-max-width-sm, initial);
|
|
6386
6525
|
--seed-box-max-width-lg: var(--seed-box-max-width-md, initial);
|
|
@@ -6467,9 +6606,6 @@
|
|
|
6467
6606
|
--seed-icon-size: var(--seed-dimension-x3_5);
|
|
6468
6607
|
--seed-icon-color: var(--seed-color-fg-neutral-inverted);
|
|
6469
6608
|
border-radius: var(--seed-radius-r3);
|
|
6470
|
-
transition: outline-color var(--seed-duration-d3) var(--seed-timing-function-easing);
|
|
6471
|
-
outline: var(--seed-dimension-x0_5) solid transparent;
|
|
6472
|
-
outline-offset: calc(var(--seed-dimension-x0_5) * -1);
|
|
6473
6609
|
background: none;
|
|
6474
6610
|
border: none;
|
|
6475
6611
|
justify-content: center;
|
|
@@ -6477,6 +6613,16 @@
|
|
|
6477
6613
|
display: flex;
|
|
6478
6614
|
}
|
|
6479
6615
|
|
|
6616
|
+
.seed-help-bubble__closeButton:is(:active, [data-active]) {
|
|
6617
|
+
scale: var(--seed-feedback-scale);
|
|
6618
|
+
}
|
|
6619
|
+
|
|
6620
|
+
.seed-help-bubble__closeButton {
|
|
6621
|
+
transition: scale var(--seed-duration-pressed-scale) var(--seed-timing-function-pressed-scale), outline-color var(--seed-duration-d3) var(--seed-timing-function-easing);
|
|
6622
|
+
outline: var(--seed-dimension-x0_5) solid transparent;
|
|
6623
|
+
outline-offset: calc(var(--seed-dimension-x0_5) * -1);
|
|
6624
|
+
}
|
|
6625
|
+
|
|
6480
6626
|
.seed-help-bubble__closeButton:is(:focus-visible, [data-focus-visible]) {
|
|
6481
6627
|
outline: var(--seed-dimension-x0_5) solid var(--seed-color-stroke-focus-ring);
|
|
6482
6628
|
outline-offset: calc(var(--seed-dimension-x0_5) * -1);
|
|
@@ -6583,6 +6729,14 @@
|
|
|
6583
6729
|
position: relative;
|
|
6584
6730
|
}
|
|
6585
6731
|
|
|
6732
|
+
.seed-image-frame-reaction-button__root:is(:active, [data-active]) {
|
|
6733
|
+
scale: var(--seed-feedback-scale);
|
|
6734
|
+
}
|
|
6735
|
+
|
|
6736
|
+
.seed-image-frame-reaction-button__root {
|
|
6737
|
+
transition: scale var(--seed-duration-pressed-scale) var(--seed-timing-function-pressed-scale);
|
|
6738
|
+
}
|
|
6739
|
+
|
|
6586
6740
|
.seed-image-frame-reaction-button__root:before {
|
|
6587
6741
|
content: "";
|
|
6588
6742
|
inset: calc((var(--seed-dimension-x10) - var(--seed-dimension-x6)) / 2 * -1);
|
|
@@ -6929,14 +7083,21 @@
|
|
|
6929
7083
|
.seed-input-button__clearButton {
|
|
6930
7084
|
cursor: pointer;
|
|
6931
7085
|
border-radius: var(--seed-radius-full);
|
|
6932
|
-
transition: outline-color var(--seed-duration-d3) var(--seed-timing-function-easing);
|
|
6933
|
-
outline: var(--seed-dimension-x0_5) solid transparent;
|
|
6934
|
-
outline-offset: var(--seed-dimension-x0_5);
|
|
6935
7086
|
background-color: #0000;
|
|
6936
7087
|
border: none;
|
|
6937
7088
|
padding: 0;
|
|
6938
7089
|
}
|
|
6939
7090
|
|
|
7091
|
+
.seed-input-button__clearButton:is(:active, [data-active]) {
|
|
7092
|
+
scale: var(--seed-feedback-scale);
|
|
7093
|
+
}
|
|
7094
|
+
|
|
7095
|
+
.seed-input-button__clearButton {
|
|
7096
|
+
transition: scale var(--seed-duration-pressed-scale) var(--seed-timing-function-pressed-scale), outline-color var(--seed-duration-d3) var(--seed-timing-function-easing);
|
|
7097
|
+
outline: var(--seed-dimension-x0_5) solid transparent;
|
|
7098
|
+
outline-offset: var(--seed-dimension-x0_5);
|
|
7099
|
+
}
|
|
7100
|
+
|
|
6940
7101
|
.seed-input-button__clearButton:is(:focus-visible, [data-focus-visible]) {
|
|
6941
7102
|
outline: var(--seed-dimension-x0_5) solid var(--seed-color-stroke-focus-ring);
|
|
6942
7103
|
outline-offset: var(--seed-dimension-x0_5);
|
|
@@ -7238,6 +7399,9 @@
|
|
|
7238
7399
|
--seed-box-padding-right: var(--seed-box-padding-right-base, initial);
|
|
7239
7400
|
padding-right: var(--seed-box-padding-right);
|
|
7240
7401
|
--seed-focus-ring: none;
|
|
7402
|
+
--seed-checkmark-feedback-scale: 1;
|
|
7403
|
+
--seed-radiomark-feedback-scale: 1;
|
|
7404
|
+
--seed-switchmark-feedback-scale: 1;
|
|
7241
7405
|
--seed-icon-size: 22px;
|
|
7242
7406
|
--seed-icon-color: var(--seed-color-fg-neutral);
|
|
7243
7407
|
flex-shrink: 0;
|
|
@@ -7261,6 +7425,9 @@
|
|
|
7261
7425
|
align-items: center;
|
|
7262
7426
|
gap: var(--seed-box-gap);
|
|
7263
7427
|
--seed-focus-ring: none;
|
|
7428
|
+
--seed-checkmark-feedback-scale: 1;
|
|
7429
|
+
--seed-radiomark-feedback-scale: 1;
|
|
7430
|
+
--seed-switchmark-feedback-scale: 1;
|
|
7264
7431
|
font-size: var(--seed-font-size-t5);
|
|
7265
7432
|
line-height: var(--seed-line-height-t5);
|
|
7266
7433
|
font-weight: var(--seed-font-weight-regular);
|
|
@@ -7586,7 +7753,7 @@
|
|
|
7586
7753
|
}
|
|
7587
7754
|
|
|
7588
7755
|
.seed-menu__scrollArea {
|
|
7589
|
-
max-height: min(480px, var(--seed-menu-available-height, 480px));
|
|
7756
|
+
max-height: min(var(--seed-menu-max-height, 480px), var(--seed-menu-available-height, var(--seed-menu-max-height, 480px)));
|
|
7590
7757
|
box-sizing: border-box;
|
|
7591
7758
|
padding-block: var(--seed-dimension-x2);
|
|
7592
7759
|
gap: var(--seed-dimension-x2);
|
|
@@ -7877,6 +8044,7 @@
|
|
|
7877
8044
|
word-break: break-all;
|
|
7878
8045
|
z-index: calc(var(--sheet-z-index) + var(--layer-index, 0));
|
|
7879
8046
|
background: var(--seed-color-bg-layer-floating);
|
|
8047
|
+
max-width: 480px;
|
|
7880
8048
|
padding-inline: var(--seed-dimension-spacing-x-global-gutter);
|
|
7881
8049
|
padding-top: var(--menu-sheet-header-padding-top, var(--seed-dimension-x4));
|
|
7882
8050
|
padding-bottom: calc(var(--seed-dimension-x4) + var(--seed-safe-area-bottom));
|
|
@@ -7967,13 +8135,20 @@
|
|
|
7967
8135
|
font-size: var(--seed-font-size-t5);
|
|
7968
8136
|
line-height: var(--seed-line-height-t5);
|
|
7969
8137
|
font-weight: var(--seed-font-weight-medium);
|
|
7970
|
-
transition: outline-color var(--seed-duration-d3) var(--seed-timing-function-easing);
|
|
7971
8138
|
border: none;
|
|
7972
8139
|
justify-content: center;
|
|
7973
8140
|
align-items: center;
|
|
7974
8141
|
display: flex;
|
|
7975
8142
|
}
|
|
7976
8143
|
|
|
8144
|
+
.seed-menu-sheet__closeButton:is(:active, [data-active]) {
|
|
8145
|
+
scale: var(--seed-feedback-scale);
|
|
8146
|
+
}
|
|
8147
|
+
|
|
8148
|
+
.seed-menu-sheet__closeButton {
|
|
8149
|
+
transition: scale var(--seed-duration-pressed-scale) var(--seed-timing-function-pressed-scale), outline-color var(--seed-duration-d3) var(--seed-timing-function-easing);
|
|
8150
|
+
}
|
|
8151
|
+
|
|
7977
8152
|
@media (hover: hover) and (pointer: fine) {
|
|
7978
8153
|
.seed-menu-sheet__closeButton:is(:hover, [data-hover]) {
|
|
7979
8154
|
background-color: var(--seed-color-bg-neutral-weak-pressed);
|
|
@@ -8277,15 +8452,22 @@
|
|
|
8277
8452
|
line-height: var(--seed-line-height-t3);
|
|
8278
8453
|
font-weight: var(--seed-font-weight-bold);
|
|
8279
8454
|
border-radius: var(--seed-radius-r1);
|
|
8280
|
-
transition: outline-color var(--seed-duration-d3) var(--seed-timing-function-easing);
|
|
8281
|
-
outline: var(--seed-dimension-x0_5) solid transparent;
|
|
8282
|
-
outline-offset: calc(var(--seed-dimension-x0_5) * -1);
|
|
8283
8455
|
background-color: #0000;
|
|
8284
8456
|
border: none;
|
|
8285
8457
|
align-items: center;
|
|
8286
8458
|
display: flex;
|
|
8287
8459
|
}
|
|
8288
8460
|
|
|
8461
|
+
.seed-page-banner__button:is(:active, [data-active]) {
|
|
8462
|
+
scale: var(--seed-feedback-scale);
|
|
8463
|
+
}
|
|
8464
|
+
|
|
8465
|
+
.seed-page-banner__button {
|
|
8466
|
+
transition: scale var(--seed-duration-pressed-scale) var(--seed-timing-function-pressed-scale), outline-color var(--seed-duration-d3) var(--seed-timing-function-easing);
|
|
8467
|
+
outline: var(--seed-dimension-x0_5) solid transparent;
|
|
8468
|
+
outline-offset: calc(var(--seed-dimension-x0_5) * -1);
|
|
8469
|
+
}
|
|
8470
|
+
|
|
8289
8471
|
.seed-page-banner__button:is(:focus-visible, [data-focus-visible]) {
|
|
8290
8472
|
outline: var(--seed-dimension-x0_5) solid var(--seed-color-stroke-focus-ring);
|
|
8291
8473
|
outline-offset: calc(var(--seed-dimension-x0_5) * -1);
|
|
@@ -8297,12 +8479,10 @@
|
|
|
8297
8479
|
margin: calc((var(--seed-dimension-x10) - var(--seed-dimension-x4)) * -.5);
|
|
8298
8480
|
margin-left: calc((var(--seed-dimension-x10) - var(--seed-dimension-x4)) * -.5 + var(--seed-dimension-x2));
|
|
8299
8481
|
--seed-suffix-icon-margin-left: initial;
|
|
8482
|
+
background-color: var(--seed-color-bg-transparent);
|
|
8300
8483
|
cursor: pointer;
|
|
8301
|
-
border-radius: var(--seed-radius-
|
|
8302
|
-
|
|
8303
|
-
outline: var(--seed-dimension-x0_5) solid transparent;
|
|
8304
|
-
outline-offset: calc(var(--seed-dimension-x0_5) * -1);
|
|
8305
|
-
background-color: #0000;
|
|
8484
|
+
border-radius: var(--seed-radius-r2);
|
|
8485
|
+
--seed-suffix-icon-size: var(--seed-dimension-x4);
|
|
8306
8486
|
border: none;
|
|
8307
8487
|
flex-grow: 0;
|
|
8308
8488
|
flex-shrink: 0;
|
|
@@ -8313,11 +8493,33 @@
|
|
|
8313
8493
|
display: flex;
|
|
8314
8494
|
}
|
|
8315
8495
|
|
|
8496
|
+
.seed-page-banner__closeButton:is(:active, [data-active]) {
|
|
8497
|
+
scale: var(--seed-feedback-scale);
|
|
8498
|
+
}
|
|
8499
|
+
|
|
8500
|
+
.seed-page-banner__closeButton {
|
|
8501
|
+
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);
|
|
8502
|
+
outline: var(--seed-dimension-x0_5) solid transparent;
|
|
8503
|
+
outline-offset: calc(var(--seed-dimension-x0_5) * -1);
|
|
8504
|
+
}
|
|
8505
|
+
|
|
8316
8506
|
.seed-page-banner__closeButton:is(:focus-visible, [data-focus-visible]) {
|
|
8317
8507
|
outline: var(--seed-dimension-x0_5) solid var(--seed-color-stroke-focus-ring);
|
|
8318
8508
|
outline-offset: calc(var(--seed-dimension-x0_5) * -1);
|
|
8319
8509
|
}
|
|
8320
8510
|
|
|
8511
|
+
@media (hover: hover) and (pointer: fine) {
|
|
8512
|
+
.seed-page-banner__closeButton:is(:hover, [data-hover]) {
|
|
8513
|
+
background-color: var(--seed-color-bg-transparent-pressed);
|
|
8514
|
+
}
|
|
8515
|
+
}
|
|
8516
|
+
|
|
8517
|
+
@media not all and (hover: hover) and (pointer: fine) {
|
|
8518
|
+
.seed-page-banner__closeButton:is(:active, [data-active]) {
|
|
8519
|
+
background-color: var(--seed-color-bg-transparent-pressed);
|
|
8520
|
+
}
|
|
8521
|
+
}
|
|
8522
|
+
|
|
8321
8523
|
.seed-page-banner__root--tone_neutral-variant_weak {
|
|
8322
8524
|
background-color: var(--seed-color-bg-neutral-weak);
|
|
8323
8525
|
--seed-prefix-icon-color: var(--seed-color-fg-neutral);
|
|
@@ -8340,8 +8542,12 @@
|
|
|
8340
8542
|
color: var(--seed-color-fg-neutral);
|
|
8341
8543
|
}
|
|
8342
8544
|
|
|
8343
|
-
.seed-page-
|
|
8344
|
-
|
|
8545
|
+
.seed-page-banner__closeButton--tone_neutral-variant_weak {
|
|
8546
|
+
--seed-suffix-icon-color: var(--seed-color-fg-neutral);
|
|
8547
|
+
}
|
|
8548
|
+
|
|
8549
|
+
.seed-page-banner__root--tone_neutral-variant_solid {
|
|
8550
|
+
background-color: var(--seed-color-bg-neutral-inverted);
|
|
8345
8551
|
--seed-prefix-icon-color: var(--seed-color-fg-neutral-inverted);
|
|
8346
8552
|
--seed-suffix-icon-color: var(--seed-color-fg-neutral-inverted);
|
|
8347
8553
|
}
|
|
@@ -8362,6 +8568,10 @@
|
|
|
8362
8568
|
color: var(--seed-color-fg-neutral-inverted);
|
|
8363
8569
|
}
|
|
8364
8570
|
|
|
8571
|
+
.seed-page-banner__closeButton--tone_neutral-variant_solid {
|
|
8572
|
+
--seed-suffix-icon-color: var(--seed-color-fg-neutral-inverted);
|
|
8573
|
+
}
|
|
8574
|
+
|
|
8365
8575
|
.seed-page-banner__root--tone_informative-variant_weak {
|
|
8366
8576
|
background-color: var(--seed-color-bg-informative-weak);
|
|
8367
8577
|
--seed-prefix-icon-color: var(--seed-color-fg-informative-contrast);
|
|
@@ -8384,6 +8594,10 @@
|
|
|
8384
8594
|
color: var(--seed-color-fg-informative-contrast);
|
|
8385
8595
|
}
|
|
8386
8596
|
|
|
8597
|
+
.seed-page-banner__closeButton--tone_informative-variant_weak {
|
|
8598
|
+
--seed-suffix-icon-color: var(--seed-color-fg-informative-contrast);
|
|
8599
|
+
}
|
|
8600
|
+
|
|
8387
8601
|
.seed-page-banner__root--tone_informative-variant_solid {
|
|
8388
8602
|
background-color: var(--seed-color-bg-informative-solid);
|
|
8389
8603
|
--seed-prefix-icon-color: var(--seed-color-palette-static-white);
|
|
@@ -8406,6 +8620,10 @@
|
|
|
8406
8620
|
color: var(--seed-color-palette-static-white);
|
|
8407
8621
|
}
|
|
8408
8622
|
|
|
8623
|
+
.seed-page-banner__closeButton--tone_informative-variant_solid {
|
|
8624
|
+
--seed-suffix-icon-color: var(--seed-color-palette-static-white);
|
|
8625
|
+
}
|
|
8626
|
+
|
|
8409
8627
|
.seed-page-banner__root--tone_positive-variant_weak {
|
|
8410
8628
|
background-color: var(--seed-color-bg-positive-weak);
|
|
8411
8629
|
--seed-prefix-icon-color: var(--seed-color-fg-positive-contrast);
|
|
@@ -8428,6 +8646,10 @@
|
|
|
8428
8646
|
color: var(--seed-color-fg-positive-contrast);
|
|
8429
8647
|
}
|
|
8430
8648
|
|
|
8649
|
+
.seed-page-banner__closeButton--tone_positive-variant_weak {
|
|
8650
|
+
--seed-suffix-icon-color: var(--seed-color-fg-positive-contrast);
|
|
8651
|
+
}
|
|
8652
|
+
|
|
8431
8653
|
.seed-page-banner__root--tone_positive-variant_solid {
|
|
8432
8654
|
background-color: var(--seed-color-bg-positive-solid);
|
|
8433
8655
|
--seed-prefix-icon-color: var(--seed-color-palette-static-white);
|
|
@@ -8450,6 +8672,10 @@
|
|
|
8450
8672
|
color: var(--seed-color-palette-static-white);
|
|
8451
8673
|
}
|
|
8452
8674
|
|
|
8675
|
+
.seed-page-banner__closeButton--tone_positive-variant_solid {
|
|
8676
|
+
--seed-suffix-icon-color: var(--seed-color-palette-static-white);
|
|
8677
|
+
}
|
|
8678
|
+
|
|
8453
8679
|
.seed-page-banner__root--tone_warning-variant_weak {
|
|
8454
8680
|
background-color: var(--seed-color-bg-warning-weak);
|
|
8455
8681
|
--seed-prefix-icon-color: var(--seed-color-fg-warning-contrast);
|
|
@@ -8472,6 +8698,10 @@
|
|
|
8472
8698
|
color: var(--seed-color-fg-warning-contrast);
|
|
8473
8699
|
}
|
|
8474
8700
|
|
|
8701
|
+
.seed-page-banner__closeButton--tone_warning-variant_weak {
|
|
8702
|
+
--seed-suffix-icon-color: var(--seed-color-fg-warning-contrast);
|
|
8703
|
+
}
|
|
8704
|
+
|
|
8475
8705
|
.seed-page-banner__root--tone_warning-variant_solid {
|
|
8476
8706
|
background-color: var(--seed-color-bg-warning-solid);
|
|
8477
8707
|
--seed-prefix-icon-color: var(--seed-color-palette-static-black-alpha-900);
|
|
@@ -8494,6 +8724,10 @@
|
|
|
8494
8724
|
color: var(--seed-color-palette-static-black-alpha-900);
|
|
8495
8725
|
}
|
|
8496
8726
|
|
|
8727
|
+
.seed-page-banner__closeButton--tone_warning-variant_solid {
|
|
8728
|
+
--seed-suffix-icon-color: var(--seed-color-palette-static-black-alpha-900);
|
|
8729
|
+
}
|
|
8730
|
+
|
|
8497
8731
|
.seed-page-banner__root--tone_critical-variant_weak {
|
|
8498
8732
|
background-color: var(--seed-color-bg-critical-weak);
|
|
8499
8733
|
--seed-prefix-icon-color: var(--seed-color-fg-critical-contrast);
|
|
@@ -8516,6 +8750,10 @@
|
|
|
8516
8750
|
color: var(--seed-color-fg-critical-contrast);
|
|
8517
8751
|
}
|
|
8518
8752
|
|
|
8753
|
+
.seed-page-banner__closeButton--tone_critical-variant_weak {
|
|
8754
|
+
--seed-suffix-icon-color: var(--seed-color-fg-critical-contrast);
|
|
8755
|
+
}
|
|
8756
|
+
|
|
8519
8757
|
.seed-page-banner__root--tone_critical-variant_solid {
|
|
8520
8758
|
background-color: var(--seed-color-bg-critical-solid);
|
|
8521
8759
|
--seed-prefix-icon-color: var(--seed-color-palette-static-white);
|
|
@@ -8538,6 +8776,10 @@
|
|
|
8538
8776
|
color: var(--seed-color-palette-static-white);
|
|
8539
8777
|
}
|
|
8540
8778
|
|
|
8779
|
+
.seed-page-banner__closeButton--tone_critical-variant_solid {
|
|
8780
|
+
--seed-suffix-icon-color: var(--seed-color-palette-static-white);
|
|
8781
|
+
}
|
|
8782
|
+
|
|
8541
8783
|
.seed-page-banner__root--tone_magic-variant_weak {
|
|
8542
8784
|
background-image: linear-gradient(88deg, var(--seed-gradient-glow-magic));
|
|
8543
8785
|
--seed-prefix-icon-color: var(--seed-color-fg-neutral);
|
|
@@ -8560,6 +8802,206 @@
|
|
|
8560
8802
|
color: var(--seed-color-fg-neutral);
|
|
8561
8803
|
}
|
|
8562
8804
|
|
|
8805
|
+
.seed-page-banner__closeButton--tone_magic-variant_weak {
|
|
8806
|
+
--seed-suffix-icon-color: var(--seed-color-fg-neutral);
|
|
8807
|
+
}
|
|
8808
|
+
|
|
8809
|
+
.seed-pagination-button {
|
|
8810
|
+
box-sizing: border-box;
|
|
8811
|
+
cursor: pointer;
|
|
8812
|
+
text-transform: none;
|
|
8813
|
+
white-space: nowrap;
|
|
8814
|
+
vertical-align: middle;
|
|
8815
|
+
-webkit-font-smoothing: antialiased;
|
|
8816
|
+
-moz-osx-font-smoothing: grayscale;
|
|
8817
|
+
width: var(--seed-dimension-x10);
|
|
8818
|
+
height: var(--seed-dimension-x10);
|
|
8819
|
+
border-radius: var(--seed-radius-r2);
|
|
8820
|
+
isolation: isolate;
|
|
8821
|
+
background: none;
|
|
8822
|
+
border: none;
|
|
8823
|
+
flex-shrink: 0;
|
|
8824
|
+
justify-content: center;
|
|
8825
|
+
align-items: center;
|
|
8826
|
+
padding: 0;
|
|
8827
|
+
font-family: inherit;
|
|
8828
|
+
text-decoration: none;
|
|
8829
|
+
display: inline-flex;
|
|
8830
|
+
position: relative;
|
|
8831
|
+
}
|
|
8832
|
+
|
|
8833
|
+
.seed-pagination-button:before {
|
|
8834
|
+
content: "";
|
|
8835
|
+
z-index: -1;
|
|
8836
|
+
border-radius: inherit;
|
|
8837
|
+
background-color: var(--seed-color-bg-transparent);
|
|
8838
|
+
transition: background-color var(--seed-duration-color-transition) var(--seed-timing-function-easing);
|
|
8839
|
+
position: absolute;
|
|
8840
|
+
inset: 0;
|
|
8841
|
+
}
|
|
8842
|
+
|
|
8843
|
+
.seed-pagination-button {
|
|
8844
|
+
--seed-icon-size: var(--seed-dimension-x4);
|
|
8845
|
+
--seed-icon-color: var(--seed-color-fg-neutral);
|
|
8846
|
+
outline: var(--seed-dimension-x0_5) solid transparent;
|
|
8847
|
+
outline-offset: var(--seed-dimension-x0_5);
|
|
8848
|
+
}
|
|
8849
|
+
|
|
8850
|
+
.seed-pagination-button:is(:focus-visible, [data-focus-visible]) {
|
|
8851
|
+
outline: var(--seed-dimension-x0_5) solid var(--seed-color-stroke-focus-ring);
|
|
8852
|
+
outline-offset: var(--seed-dimension-x0_5);
|
|
8853
|
+
}
|
|
8854
|
+
|
|
8855
|
+
.seed-pagination-button {
|
|
8856
|
+
scale: 1;
|
|
8857
|
+
}
|
|
8858
|
+
|
|
8859
|
+
@media (hover: hover) and (pointer: fine) {
|
|
8860
|
+
.seed-pagination-button:is(:hover, [data-hover]):not(:is(:disabled, [disabled], [data-disabled])):before {
|
|
8861
|
+
background-color: var(--seed-color-bg-transparent-pressed);
|
|
8862
|
+
}
|
|
8863
|
+
}
|
|
8864
|
+
|
|
8865
|
+
@media not all and (hover: hover) and (pointer: fine) {
|
|
8866
|
+
.seed-pagination-button:is(:active, [data-active]):not(:is(:disabled, [disabled], [data-disabled])):before {
|
|
8867
|
+
background-color: var(--seed-color-bg-transparent-pressed);
|
|
8868
|
+
}
|
|
8869
|
+
}
|
|
8870
|
+
|
|
8871
|
+
.seed-pagination-button:not(:is(:disabled, [disabled], [data-disabled])):is(:active, [data-active]) {
|
|
8872
|
+
scale: var(--seed-scale-s97);
|
|
8873
|
+
}
|
|
8874
|
+
|
|
8875
|
+
.seed-pagination-button:is(:disabled, [disabled], [data-disabled]) {
|
|
8876
|
+
cursor: not-allowed;
|
|
8877
|
+
--seed-icon-color: var(--seed-color-fg-disabled);
|
|
8878
|
+
}
|
|
8879
|
+
|
|
8880
|
+
.seed-pagination-button:is(:disabled, [disabled], [data-disabled]):before {
|
|
8881
|
+
background-color: var(--seed-color-bg-transparent);
|
|
8882
|
+
}
|
|
8883
|
+
|
|
8884
|
+
.seed-pagination-button {
|
|
8885
|
+
transition: scale var(--seed-duration-pressed-scale) var(--seed-timing-function-pressed-scale), outline-color var(--seed-duration-d3) var(--seed-timing-function-easing);
|
|
8886
|
+
}
|
|
8887
|
+
|
|
8888
|
+
.seed-pagination-page-item {
|
|
8889
|
+
box-sizing: border-box;
|
|
8890
|
+
cursor: pointer;
|
|
8891
|
+
text-transform: none;
|
|
8892
|
+
white-space: nowrap;
|
|
8893
|
+
vertical-align: middle;
|
|
8894
|
+
-webkit-font-smoothing: antialiased;
|
|
8895
|
+
-moz-osx-font-smoothing: grayscale;
|
|
8896
|
+
width: var(--seed-dimension-x10);
|
|
8897
|
+
height: var(--seed-dimension-x10);
|
|
8898
|
+
border-radius: var(--seed-radius-r2);
|
|
8899
|
+
isolation: isolate;
|
|
8900
|
+
color: var(--seed-color-fg-neutral);
|
|
8901
|
+
font-family: inherit;
|
|
8902
|
+
font-size: var(--seed-font-size-t4);
|
|
8903
|
+
line-height: var(--seed-line-height-t4);
|
|
8904
|
+
font-weight: var(--seed-font-weight-bold);
|
|
8905
|
+
background: none;
|
|
8906
|
+
border: none;
|
|
8907
|
+
flex-shrink: 0;
|
|
8908
|
+
justify-content: center;
|
|
8909
|
+
align-items: center;
|
|
8910
|
+
padding: 0;
|
|
8911
|
+
text-decoration: none;
|
|
8912
|
+
display: inline-flex;
|
|
8913
|
+
position: relative;
|
|
8914
|
+
}
|
|
8915
|
+
|
|
8916
|
+
.seed-pagination-page-item:before {
|
|
8917
|
+
content: "";
|
|
8918
|
+
z-index: -1;
|
|
8919
|
+
border-radius: inherit;
|
|
8920
|
+
background-color: var(--seed-color-bg-transparent);
|
|
8921
|
+
position: absolute;
|
|
8922
|
+
inset: 0;
|
|
8923
|
+
}
|
|
8924
|
+
|
|
8925
|
+
.seed-pagination-page-item > [data-pagination-page-item-label] {
|
|
8926
|
+
text-overflow: ellipsis;
|
|
8927
|
+
white-space: nowrap;
|
|
8928
|
+
min-width: 0;
|
|
8929
|
+
max-width: 100%;
|
|
8930
|
+
display: block;
|
|
8931
|
+
overflow: hidden;
|
|
8932
|
+
}
|
|
8933
|
+
|
|
8934
|
+
.seed-pagination-page-item {
|
|
8935
|
+
outline: var(--seed-dimension-x0_5) solid transparent;
|
|
8936
|
+
outline-offset: var(--seed-dimension-x0_5);
|
|
8937
|
+
}
|
|
8938
|
+
|
|
8939
|
+
.seed-pagination-page-item:is(:focus-visible, [data-focus-visible]) {
|
|
8940
|
+
outline: var(--seed-dimension-x0_5) solid var(--seed-color-stroke-focus-ring);
|
|
8941
|
+
outline-offset: var(--seed-dimension-x0_5);
|
|
8942
|
+
}
|
|
8943
|
+
|
|
8944
|
+
.seed-pagination-page-item {
|
|
8945
|
+
scale: 1;
|
|
8946
|
+
}
|
|
8947
|
+
|
|
8948
|
+
@media (hover: hover) and (pointer: fine) {
|
|
8949
|
+
.seed-pagination-page-item:is(:hover, [data-hover]):not(:is(:disabled, [disabled], [data-disabled])):before {
|
|
8950
|
+
background-color: var(--seed-color-bg-transparent-pressed);
|
|
8951
|
+
}
|
|
8952
|
+
}
|
|
8953
|
+
|
|
8954
|
+
@media not all and (hover: hover) and (pointer: fine) {
|
|
8955
|
+
.seed-pagination-page-item:is(:active, [data-active]):not(:is(:disabled, [disabled], [data-disabled])):before {
|
|
8956
|
+
background-color: var(--seed-color-bg-transparent-pressed);
|
|
8957
|
+
}
|
|
8958
|
+
}
|
|
8959
|
+
|
|
8960
|
+
.seed-pagination-page-item:not(:is(:disabled, [disabled], [data-disabled])):is(:active, [data-active]) {
|
|
8961
|
+
scale: var(--seed-scale-s97);
|
|
8962
|
+
}
|
|
8963
|
+
|
|
8964
|
+
.seed-pagination-page-item:is([aria-selected="true"], [data-selected]) {
|
|
8965
|
+
color: var(--seed-color-fg-neutral-inverted);
|
|
8966
|
+
}
|
|
8967
|
+
|
|
8968
|
+
.seed-pagination-page-item:is([aria-selected="true"], [data-selected]):before {
|
|
8969
|
+
background-color: var(--seed-color-bg-neutral-inverted);
|
|
8970
|
+
}
|
|
8971
|
+
|
|
8972
|
+
@media (hover: hover) and (pointer: fine) {
|
|
8973
|
+
.seed-pagination-page-item:is([aria-selected="true"], [data-selected]):is(:hover, [data-hover]):not(:is(:disabled, [disabled], [data-disabled])):before {
|
|
8974
|
+
background-color: var(--seed-color-bg-neutral-inverted-pressed);
|
|
8975
|
+
}
|
|
8976
|
+
}
|
|
8977
|
+
|
|
8978
|
+
@media not all and (hover: hover) and (pointer: fine) {
|
|
8979
|
+
.seed-pagination-page-item:is([aria-selected="true"], [data-selected]):is(:active, [data-active]):not(:is(:disabled, [disabled], [data-disabled])):before {
|
|
8980
|
+
background-color: var(--seed-color-bg-neutral-inverted-pressed);
|
|
8981
|
+
}
|
|
8982
|
+
}
|
|
8983
|
+
|
|
8984
|
+
.seed-pagination-page-item:is(:disabled, [disabled], [data-disabled]) {
|
|
8985
|
+
cursor: not-allowed;
|
|
8986
|
+
color: var(--seed-color-fg-disabled);
|
|
8987
|
+
}
|
|
8988
|
+
|
|
8989
|
+
.seed-pagination-page-item:is(:disabled, [disabled], [data-disabled]):before {
|
|
8990
|
+
background-color: var(--seed-color-bg-transparent);
|
|
8991
|
+
}
|
|
8992
|
+
|
|
8993
|
+
.seed-pagination-page-item:is([aria-selected="true"], [data-selected]):is(:disabled, [disabled], [data-disabled]) {
|
|
8994
|
+
color: var(--seed-color-fg-disabled);
|
|
8995
|
+
}
|
|
8996
|
+
|
|
8997
|
+
.seed-pagination-page-item:is([aria-selected="true"], [data-selected]):is(:disabled, [disabled], [data-disabled]):before {
|
|
8998
|
+
background-color: var(--seed-color-bg-disabled);
|
|
8999
|
+
}
|
|
9000
|
+
|
|
9001
|
+
.seed-pagination-page-item {
|
|
9002
|
+
transition: scale var(--seed-duration-pressed-scale) var(--seed-timing-function-pressed-scale), outline-color var(--seed-duration-d3) var(--seed-timing-function-easing);
|
|
9003
|
+
}
|
|
9004
|
+
|
|
8563
9005
|
.seed-progress-circle__root {
|
|
8564
9006
|
box-sizing: border-box;
|
|
8565
9007
|
display: inline-flex;
|
|
@@ -8612,7 +9054,7 @@
|
|
|
8612
9054
|
}
|
|
8613
9055
|
|
|
8614
9056
|
.seed-pull-to-refresh__root {
|
|
8615
|
-
--ptr-size:
|
|
9057
|
+
--ptr-size: calc(var(--seed-dimension-x6) + var(--seed-dimension-x8) * 2);
|
|
8616
9058
|
--ptr-transition-duration: var(--seed-duration-d6);
|
|
8617
9059
|
height: 100%;
|
|
8618
9060
|
}
|
|
@@ -8646,7 +9088,7 @@
|
|
|
8646
9088
|
box-sizing: border-box;
|
|
8647
9089
|
cursor: pointer;
|
|
8648
9090
|
background-color: var(--seed-color-bg-transparent);
|
|
8649
|
-
transition: background-color var(--seed-duration-color-transition) var(--seed-timing-function-easing), outline-color var(--seed-duration-d3) var(--seed-timing-function-easing);
|
|
9091
|
+
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);
|
|
8650
9092
|
outline: var(--seed-dimension-x0_5) solid transparent;
|
|
8651
9093
|
outline-offset: var(--seed-dimension-x0_5);
|
|
8652
9094
|
border: none;
|
|
@@ -8662,6 +9104,10 @@
|
|
|
8662
9104
|
outline-offset: var(--seed-dimension-x0_5);
|
|
8663
9105
|
}
|
|
8664
9106
|
|
|
9107
|
+
.seed-quantity-picker__decrementButton:not(:is(:disabled, [disabled], [data-disabled])):is(:active, [data-active]) {
|
|
9108
|
+
scale: var(--seed-feedback-scale);
|
|
9109
|
+
}
|
|
9110
|
+
|
|
8665
9111
|
@media (hover: hover) and (pointer: fine) {
|
|
8666
9112
|
.seed-quantity-picker__decrementButton:not(:is(:disabled, [disabled], [data-disabled])):is(:hover, [data-hover]) {
|
|
8667
9113
|
background-color: var(--seed-color-bg-transparent-pressed);
|
|
@@ -8729,7 +9175,7 @@
|
|
|
8729
9175
|
box-sizing: border-box;
|
|
8730
9176
|
cursor: pointer;
|
|
8731
9177
|
background-color: var(--seed-color-bg-transparent);
|
|
8732
|
-
transition: background-color var(--seed-duration-color-transition) var(--seed-timing-function-easing), outline-color var(--seed-duration-d3) var(--seed-timing-function-easing);
|
|
9178
|
+
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);
|
|
8733
9179
|
outline: var(--seed-dimension-x0_5) solid transparent;
|
|
8734
9180
|
outline-offset: var(--seed-dimension-x0_5);
|
|
8735
9181
|
border: none;
|
|
@@ -8745,6 +9191,10 @@
|
|
|
8745
9191
|
outline-offset: var(--seed-dimension-x0_5);
|
|
8746
9192
|
}
|
|
8747
9193
|
|
|
9194
|
+
.seed-quantity-picker__incrementButton:not(:is(:disabled, [disabled], [data-disabled])):is(:active, [data-active]) {
|
|
9195
|
+
scale: var(--seed-feedback-scale);
|
|
9196
|
+
}
|
|
9197
|
+
|
|
8748
9198
|
@media (hover: hover) and (pointer: fine) {
|
|
8749
9199
|
.seed-quantity-picker__incrementButton:not(:is(:disabled, [disabled], [data-disabled])):is(:hover, [data-hover]) {
|
|
8750
9200
|
background-color: var(--seed-color-bg-transparent-pressed);
|
|
@@ -8972,9 +9422,6 @@
|
|
|
8972
9422
|
border-color: var(--seed-color-stroke-neutral-weak);
|
|
8973
9423
|
border-radius: var(--seed-radius-full);
|
|
8974
9424
|
margin-top: var(--radiomark-margin-top, 0);
|
|
8975
|
-
transition: background-color var(--seed-duration-color-transition) var(--seed-timing-function-easing), outline-color var(--seed-duration-d3) var(--seed-timing-function-easing);
|
|
8976
|
-
outline: var(--seed-focus-ring, var(--seed-dimension-x0_5) solid transparent);
|
|
8977
|
-
outline-offset: var(--seed-dimension-x0_5);
|
|
8978
9425
|
flex: none;
|
|
8979
9426
|
justify-content: center;
|
|
8980
9427
|
align-items: center;
|
|
@@ -8982,6 +9429,16 @@
|
|
|
8982
9429
|
position: relative;
|
|
8983
9430
|
}
|
|
8984
9431
|
|
|
9432
|
+
.seed-radiomark__root:not(:is(:disabled, [disabled], [data-disabled])):is(:active, [data-active]) {
|
|
9433
|
+
scale: var(--seed-radiomark-feedback-scale, var(--seed-feedback-scale));
|
|
9434
|
+
}
|
|
9435
|
+
|
|
9436
|
+
.seed-radiomark__root {
|
|
9437
|
+
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);
|
|
9438
|
+
outline: var(--seed-focus-ring, var(--seed-dimension-x0_5) solid transparent);
|
|
9439
|
+
outline-offset: var(--seed-dimension-x0_5);
|
|
9440
|
+
}
|
|
9441
|
+
|
|
8985
9442
|
@media (hover: hover) and (pointer: fine) {
|
|
8986
9443
|
.seed-radiomark__root:not(:is(:disabled, [disabled], [data-disabled])):is(:hover, [data-hover]) {
|
|
8987
9444
|
background-color: var(--seed-color-bg-transparent-pressed);
|
|
@@ -9121,8 +9578,12 @@
|
|
|
9121
9578
|
outline-offset: var(--seed-dimension-x0_5);
|
|
9122
9579
|
}
|
|
9123
9580
|
|
|
9581
|
+
.seed-reaction-button:not(:is(:disabled, [disabled], [data-disabled])):is(:active, [data-active]) {
|
|
9582
|
+
scale: var(--seed-feedback-scale);
|
|
9583
|
+
}
|
|
9584
|
+
|
|
9124
9585
|
.seed-reaction-button {
|
|
9125
|
-
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);
|
|
9586
|
+
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);
|
|
9126
9587
|
background: var(--seed-color-bg-transparent);
|
|
9127
9588
|
font-weight: var(--seed-font-weight-medium);
|
|
9128
9589
|
color: var(--seed-color-fg-neutral);
|
|
@@ -9393,7 +9854,7 @@
|
|
|
9393
9854
|
}
|
|
9394
9855
|
|
|
9395
9856
|
.seed-select__scrollArea {
|
|
9396
|
-
max-height: min(480px, var(--seed-select-available-height, 480px));
|
|
9857
|
+
max-height: min(var(--seed-select-max-height, 480px), var(--seed-select-available-height, var(--seed-select-max-height, 480px)));
|
|
9397
9858
|
box-sizing: border-box;
|
|
9398
9859
|
padding-block: var(--seed-dimension-x2);
|
|
9399
9860
|
gap: var(--seed-dimension-x2);
|
|
@@ -9876,7 +10337,7 @@
|
|
|
9876
10337
|
cursor: pointer;
|
|
9877
10338
|
border-radius: var(--seed-radius-r3);
|
|
9878
10339
|
background-color: var(--seed-color-bg-transparent);
|
|
9879
|
-
box-shadow: inset 0 0 0 1px var(--seed-color-stroke-neutral-
|
|
10340
|
+
box-shadow: inset 0 0 0 1px var(--seed-color-stroke-neutral-weak);
|
|
9880
10341
|
transition: background-color var(--seed-duration-color-transition) var(--seed-timing-function-easing), outline-color var(--seed-duration-d3) var(--seed-timing-function-easing);
|
|
9881
10342
|
flex-direction: column;
|
|
9882
10343
|
display: flex;
|
|
@@ -9913,11 +10374,11 @@
|
|
|
9913
10374
|
|
|
9914
10375
|
.seed-select-box__root:is(:disabled, [disabled], [data-disabled]) {
|
|
9915
10376
|
cursor: not-allowed;
|
|
9916
|
-
box-shadow: inset 0 0 0 1px var(--seed-color-stroke-neutral-
|
|
10377
|
+
box-shadow: inset 0 0 0 1px var(--seed-color-stroke-neutral-weak);
|
|
9917
10378
|
}
|
|
9918
10379
|
|
|
9919
10380
|
.seed-select-box__root:is(:disabled, [disabled], [data-disabled]):is(:checked, [data-checked]) {
|
|
9920
|
-
box-shadow: inset 0 0 0 2px var(--seed-color-stroke-neutral-
|
|
10381
|
+
box-shadow: inset 0 0 0 2px var(--seed-color-stroke-neutral-weak);
|
|
9921
10382
|
}
|
|
9922
10383
|
|
|
9923
10384
|
.seed-select-box__root {
|
|
@@ -10611,11 +11072,6 @@
|
|
|
10611
11072
|
top: calc(28px + var(--seed-safe-area-top));
|
|
10612
11073
|
border-radius: var(--seed-radius-r3);
|
|
10613
11074
|
cursor: pointer;
|
|
10614
|
-
transition: background var(--seed-duration-color-transition) var(--seed-timing-function-easing), outline-color var(--seed-duration-d3) var(--seed-timing-function-easing);
|
|
10615
|
-
--seed-icon-size: 22px;
|
|
10616
|
-
--seed-icon-color: var(--seed-color-fg-neutral-subtle);
|
|
10617
|
-
outline: var(--seed-dimension-x0_5) solid transparent;
|
|
10618
|
-
outline-offset: var(--seed-dimension-x0_5);
|
|
10619
11075
|
border: none;
|
|
10620
11076
|
justify-content: center;
|
|
10621
11077
|
align-items: center;
|
|
@@ -10626,6 +11082,18 @@
|
|
|
10626
11082
|
right: 24px;
|
|
10627
11083
|
}
|
|
10628
11084
|
|
|
11085
|
+
.seed-side-panel__closeButton:is(:active, [data-active]) {
|
|
11086
|
+
scale: var(--seed-feedback-scale);
|
|
11087
|
+
}
|
|
11088
|
+
|
|
11089
|
+
.seed-side-panel__closeButton {
|
|
11090
|
+
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);
|
|
11091
|
+
--seed-icon-size: 22px;
|
|
11092
|
+
--seed-icon-color: var(--seed-color-fg-neutral-subtle);
|
|
11093
|
+
outline: var(--seed-dimension-x0_5) solid transparent;
|
|
11094
|
+
outline-offset: var(--seed-dimension-x0_5);
|
|
11095
|
+
}
|
|
11096
|
+
|
|
10629
11097
|
.seed-side-panel__closeButton:is(:focus-visible, [data-focus-visible]) {
|
|
10630
11098
|
outline: var(--seed-dimension-x0_5) solid var(--seed-color-stroke-focus-ring);
|
|
10631
11099
|
outline-offset: var(--seed-dimension-x0_5);
|
|
@@ -11041,7 +11509,7 @@
|
|
|
11041
11509
|
background: var(--seed-color-bg-neutral-inverted);
|
|
11042
11510
|
border-radius: var(--seed-radius-r2);
|
|
11043
11511
|
width: 100%;
|
|
11044
|
-
max-width:
|
|
11512
|
+
max-width: 464px;
|
|
11045
11513
|
padding-inline: var(--seed-dimension-x2_5);
|
|
11046
11514
|
padding-block: var(--seed-dimension-x2_5);
|
|
11047
11515
|
min-height: 44px;
|
|
@@ -11122,6 +11590,14 @@
|
|
|
11122
11590
|
position: relative;
|
|
11123
11591
|
}
|
|
11124
11592
|
|
|
11593
|
+
.seed-snackbar__actionButton:is(:active, [data-active]) {
|
|
11594
|
+
scale: var(--seed-feedback-scale);
|
|
11595
|
+
}
|
|
11596
|
+
|
|
11597
|
+
.seed-snackbar__actionButton {
|
|
11598
|
+
transition: scale var(--seed-duration-pressed-scale) var(--seed-timing-function-pressed-scale);
|
|
11599
|
+
}
|
|
11600
|
+
|
|
11125
11601
|
.seed-snackbar__actionButton:after {
|
|
11126
11602
|
content: "";
|
|
11127
11603
|
top: 50%;
|
|
@@ -11238,11 +11714,15 @@
|
|
|
11238
11714
|
border-radius: var(--seed-radius-full);
|
|
11239
11715
|
background: var(--seed-color-palette-gray-600);
|
|
11240
11716
|
margin: var(--switchmark-margin-top, 0) 0;
|
|
11241
|
-
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);
|
|
11717
|
+
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);
|
|
11242
11718
|
display: block;
|
|
11243
11719
|
position: relative;
|
|
11244
11720
|
}
|
|
11245
11721
|
|
|
11722
|
+
.seed-switchmark__root:not(:is(:disabled, [disabled], [data-disabled])):is(:active, [data-active]) {
|
|
11723
|
+
scale: var(--seed-switchmark-feedback-scale, var(--seed-feedback-scale));
|
|
11724
|
+
}
|
|
11725
|
+
|
|
11246
11726
|
.seed-switchmark__root:is(:disabled, [disabled], [data-disabled]) {
|
|
11247
11727
|
opacity: .38;
|
|
11248
11728
|
}
|
|
@@ -11428,8 +11908,12 @@
|
|
|
11428
11908
|
bottom: 0;
|
|
11429
11909
|
}
|
|
11430
11910
|
|
|
11911
|
+
.seed-tabs__trigger:not(:is(:disabled, [disabled], [data-disabled])):is(:active, [data-active]) {
|
|
11912
|
+
scale: var(--seed-feedback-scale);
|
|
11913
|
+
}
|
|
11914
|
+
|
|
11431
11915
|
.seed-tabs__trigger {
|
|
11432
|
-
transition: outline-color var(--seed-duration-d3) var(--seed-timing-function-easing);
|
|
11916
|
+
transition: scale var(--seed-duration-pressed-scale) var(--seed-timing-function-pressed-scale), outline-color var(--seed-duration-d3) var(--seed-timing-function-easing);
|
|
11433
11917
|
outline: var(--seed-dimension-x0_5) solid transparent;
|
|
11434
11918
|
outline-offset: calc(var(--seed-dimension-x0_5) * -1);
|
|
11435
11919
|
}
|
|
@@ -12921,8 +13405,12 @@
|
|
|
12921
13405
|
cursor: not-allowed;
|
|
12922
13406
|
}
|
|
12923
13407
|
|
|
13408
|
+
.seed-toggle-button:not(:is(:disabled, [disabled], [data-disabled])):is(:active, [data-active]) {
|
|
13409
|
+
scale: var(--seed-feedback-scale);
|
|
13410
|
+
}
|
|
13411
|
+
|
|
12924
13412
|
.seed-toggle-button {
|
|
12925
|
-
transition: background-color var(--seed-duration-color-transition) var(--seed-timing-function-easing), outline-color var(--seed-duration-d3) var(--seed-timing-function-easing);
|
|
13413
|
+
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);
|
|
12926
13414
|
font-weight: var(--seed-font-weight-bold);
|
|
12927
13415
|
}
|
|
12928
13416
|
|
|
@@ -13161,7 +13649,7 @@
|
|
|
13161
13649
|
|
|
13162
13650
|
.seed-wheel-picker__selectionIndicator {
|
|
13163
13651
|
z-index: 0;
|
|
13164
|
-
inset-inline:
|
|
13652
|
+
inset-inline: var(--seed-dimension-x4);
|
|
13165
13653
|
height: var(--seed-wheel-picker-item-size);
|
|
13166
13654
|
pointer-events: none;
|
|
13167
13655
|
position: absolute;
|
|
@@ -13169,6 +13657,145 @@
|
|
|
13169
13657
|
transform: translateY(-50%);
|
|
13170
13658
|
}
|
|
13171
13659
|
|
|
13660
|
+
.seed-wheel-picker-public__root {
|
|
13661
|
+
background-color: var(--seed-color-bg-layer-floating);
|
|
13662
|
+
--seed-wheel-picker-public-item-color: var(--seed-color-fg-disabled);
|
|
13663
|
+
--seed-wheel-picker-public-selected-item-color: var(--seed-color-fg-neutral);
|
|
13664
|
+
--seed-wheel-picker-public-scroll-fog-size: min(calc(.4 * 100%), var(--seed-wheel-picker-public-scroll-fog-max-height));
|
|
13665
|
+
width: 100%;
|
|
13666
|
+
position: relative;
|
|
13667
|
+
overflow: hidden;
|
|
13668
|
+
}
|
|
13669
|
+
|
|
13670
|
+
.seed-wheel-picker-public__scrollFog {
|
|
13671
|
+
z-index: 1;
|
|
13672
|
+
height: 100%;
|
|
13673
|
+
position: relative;
|
|
13674
|
+
overflow: hidden;
|
|
13675
|
+
}
|
|
13676
|
+
|
|
13677
|
+
.seed-wheel-picker-public__columns {
|
|
13678
|
+
justify-content: center;
|
|
13679
|
+
width: 100%;
|
|
13680
|
+
height: 100%;
|
|
13681
|
+
display: flex;
|
|
13682
|
+
}
|
|
13683
|
+
|
|
13684
|
+
.seed-wheel-picker-public__column {
|
|
13685
|
+
box-sizing: border-box;
|
|
13686
|
+
overscroll-behavior-x: none;
|
|
13687
|
+
overscroll-behavior-y: contain;
|
|
13688
|
+
scroll-snap-type: y mandatory;
|
|
13689
|
+
scrollbar-width: none;
|
|
13690
|
+
-ms-overflow-style: none;
|
|
13691
|
+
touch-action: pan-y;
|
|
13692
|
+
cursor: grab;
|
|
13693
|
+
width: max-content;
|
|
13694
|
+
height: 100%;
|
|
13695
|
+
padding-block: var(--seed-wheel-picker-public-center-offset);
|
|
13696
|
+
outline: none;
|
|
13697
|
+
flex: none;
|
|
13698
|
+
overflow: hidden auto;
|
|
13699
|
+
}
|
|
13700
|
+
|
|
13701
|
+
.seed-wheel-picker-public__column:is(:disabled, [disabled], [data-disabled]) {
|
|
13702
|
+
cursor: default;
|
|
13703
|
+
--seed-wheel-picker-public-item-color: var(--seed-color-fg-disabled);
|
|
13704
|
+
--seed-wheel-picker-public-selected-item-color: var(--seed-color-fg-disabled);
|
|
13705
|
+
overflow-y: hidden;
|
|
13706
|
+
}
|
|
13707
|
+
|
|
13708
|
+
.seed-wheel-picker-public__column[data-wheel-picker-dragging] {
|
|
13709
|
+
cursor: grabbing;
|
|
13710
|
+
scroll-snap-type: none;
|
|
13711
|
+
}
|
|
13712
|
+
|
|
13713
|
+
.seed-wheel-picker-public__column[data-wheel-picker-scrolling] {
|
|
13714
|
+
scroll-snap-type: none;
|
|
13715
|
+
}
|
|
13716
|
+
|
|
13717
|
+
.seed-wheel-picker-public__column::-webkit-scrollbar {
|
|
13718
|
+
display: none;
|
|
13719
|
+
}
|
|
13720
|
+
|
|
13721
|
+
.seed-wheel-picker-public__column :is([aria-selected="true"], [data-selected]) {
|
|
13722
|
+
outline: var(--seed-dimension-x0_5) solid transparent;
|
|
13723
|
+
outline-offset: calc(var(--seed-dimension-x0_5) * -1);
|
|
13724
|
+
border-radius: var(--seed-radius-r2);
|
|
13725
|
+
transition: outline-color var(--seed-duration-d3) var(--seed-timing-function-easing);
|
|
13726
|
+
}
|
|
13727
|
+
|
|
13728
|
+
.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]) {
|
|
13729
|
+
outline: var(--seed-dimension-x0_5) solid var(--seed-color-stroke-focus-ring);
|
|
13730
|
+
outline-offset: calc(var(--seed-dimension-x0_5) * -1);
|
|
13731
|
+
}
|
|
13732
|
+
|
|
13733
|
+
.seed-wheel-picker-public__item {
|
|
13734
|
+
height: var(--seed-wheel-picker-public-item-size);
|
|
13735
|
+
min-height: var(--seed-wheel-picker-public-item-size);
|
|
13736
|
+
color: var(--seed-wheel-picker-public-item-color);
|
|
13737
|
+
scroll-snap-align: center;
|
|
13738
|
+
-webkit-user-select: none;
|
|
13739
|
+
user-select: none;
|
|
13740
|
+
justify-content: center;
|
|
13741
|
+
align-items: center;
|
|
13742
|
+
display: flex;
|
|
13743
|
+
}
|
|
13744
|
+
|
|
13745
|
+
.seed-wheel-picker-public__item[data-wheel-picker-indicator-overlap] {
|
|
13746
|
+
color: #0000;
|
|
13747
|
+
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%);
|
|
13748
|
+
-webkit-text-fill-color: transparent;
|
|
13749
|
+
-webkit-background-clip: text;
|
|
13750
|
+
background-clip: text;
|
|
13751
|
+
}
|
|
13752
|
+
|
|
13753
|
+
.seed-wheel-picker-public__itemLabel {
|
|
13754
|
+
box-sizing: border-box;
|
|
13755
|
+
height: 100%;
|
|
13756
|
+
padding-inline: var(--seed-dimension-x4);
|
|
13757
|
+
font-weight: var(--seed-font-weight-medium);
|
|
13758
|
+
white-space: nowrap;
|
|
13759
|
+
flex-shrink: 0;
|
|
13760
|
+
justify-content: center;
|
|
13761
|
+
align-items: center;
|
|
13762
|
+
display: flex;
|
|
13763
|
+
}
|
|
13764
|
+
|
|
13765
|
+
.seed-wheel-picker-public__selectionIndicator {
|
|
13766
|
+
z-index: 0;
|
|
13767
|
+
inset-inline: var(--seed-dimension-x4);
|
|
13768
|
+
height: var(--seed-wheel-picker-public-item-size);
|
|
13769
|
+
border-radius: var(--seed-radius-r2);
|
|
13770
|
+
background-color: var(--seed-color-bg-neutral-weak);
|
|
13771
|
+
pointer-events: none;
|
|
13772
|
+
position: absolute;
|
|
13773
|
+
top: 50%;
|
|
13774
|
+
transform: translateY(-50%);
|
|
13775
|
+
}
|
|
13776
|
+
|
|
13777
|
+
.seed-wheel-picker-public__root--size_small {
|
|
13778
|
+
height: var(--seed-wheel-picker-public-viewport-size, 180px);
|
|
13779
|
+
--seed-wheel-picker-public-item-size: 36px;
|
|
13780
|
+
--seed-wheel-picker-public-scroll-fog-max-height: 108px;
|
|
13781
|
+
}
|
|
13782
|
+
|
|
13783
|
+
.seed-wheel-picker-public__itemLabel--size_small {
|
|
13784
|
+
font-size: var(--seed-font-size-t7-static);
|
|
13785
|
+
line-height: var(--seed-line-height-t7-static);
|
|
13786
|
+
}
|
|
13787
|
+
|
|
13788
|
+
.seed-wheel-picker-public__root--size_medium {
|
|
13789
|
+
height: var(--seed-wheel-picker-public-viewport-size, 220px);
|
|
13790
|
+
--seed-wheel-picker-public-item-size: 44px;
|
|
13791
|
+
--seed-wheel-picker-public-scroll-fog-max-height: 132px;
|
|
13792
|
+
}
|
|
13793
|
+
|
|
13794
|
+
.seed-wheel-picker-public__itemLabel--size_medium {
|
|
13795
|
+
font-size: var(--seed-font-size-t10-static);
|
|
13796
|
+
line-height: var(--seed-line-height-t10-static);
|
|
13797
|
+
}
|
|
13798
|
+
|
|
13172
13799
|
@media (min-width: 480px) {
|
|
13173
13800
|
.seed-action-button {
|
|
13174
13801
|
--seed-box-bleed-bottom: var(--seed-box-bleed-bottom-sm, initial);
|
|
@@ -13195,6 +13822,12 @@
|
|
|
13195
13822
|
--seed-box-max-height: var(--seed-box-max-height-sm, initial);
|
|
13196
13823
|
}
|
|
13197
13824
|
|
|
13825
|
+
.seed-date-picker__root {
|
|
13826
|
+
--seed-box-height: var(--seed-box-height-sm, initial);
|
|
13827
|
+
--seed-box-min-height: var(--seed-box-min-height-sm, initial);
|
|
13828
|
+
--seed-box-max-height: var(--seed-box-max-height-sm, initial);
|
|
13829
|
+
}
|
|
13830
|
+
|
|
13198
13831
|
.seed-help-bubble__content {
|
|
13199
13832
|
--seed-box-max-width: var(--seed-box-max-width-sm, initial);
|
|
13200
13833
|
}
|
|
@@ -13256,6 +13889,12 @@
|
|
|
13256
13889
|
--seed-box-max-height: var(--seed-box-max-height-md, initial);
|
|
13257
13890
|
}
|
|
13258
13891
|
|
|
13892
|
+
.seed-date-picker__root {
|
|
13893
|
+
--seed-box-height: var(--seed-box-height-md, initial);
|
|
13894
|
+
--seed-box-min-height: var(--seed-box-min-height-md, initial);
|
|
13895
|
+
--seed-box-max-height: var(--seed-box-max-height-md, initial);
|
|
13896
|
+
}
|
|
13897
|
+
|
|
13259
13898
|
.seed-help-bubble__content {
|
|
13260
13899
|
--seed-box-max-width: var(--seed-box-max-width-md, initial);
|
|
13261
13900
|
}
|
|
@@ -13317,6 +13956,12 @@
|
|
|
13317
13956
|
--seed-box-max-height: var(--seed-box-max-height-lg, initial);
|
|
13318
13957
|
}
|
|
13319
13958
|
|
|
13959
|
+
.seed-date-picker__root {
|
|
13960
|
+
--seed-box-height: var(--seed-box-height-lg, initial);
|
|
13961
|
+
--seed-box-min-height: var(--seed-box-min-height-lg, initial);
|
|
13962
|
+
--seed-box-max-height: var(--seed-box-max-height-lg, initial);
|
|
13963
|
+
}
|
|
13964
|
+
|
|
13320
13965
|
.seed-help-bubble__content {
|
|
13321
13966
|
--seed-box-max-width: var(--seed-box-max-width-lg, initial);
|
|
13322
13967
|
}
|
|
@@ -13378,6 +14023,12 @@
|
|
|
13378
14023
|
--seed-box-max-height: var(--seed-box-max-height-xl, initial);
|
|
13379
14024
|
}
|
|
13380
14025
|
|
|
14026
|
+
.seed-date-picker__root {
|
|
14027
|
+
--seed-box-height: var(--seed-box-height-xl, initial);
|
|
14028
|
+
--seed-box-min-height: var(--seed-box-min-height-xl, initial);
|
|
14029
|
+
--seed-box-max-height: var(--seed-box-max-height-xl, initial);
|
|
14030
|
+
}
|
|
14031
|
+
|
|
13381
14032
|
.seed-help-bubble__content {
|
|
13382
14033
|
--seed-box-max-width: var(--seed-box-max-width-xl, initial);
|
|
13383
14034
|
}
|