@seed-design/css 0.1.15 → 0.2.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 +95 -96
- package/all.min.css +1 -1
- package/base.css +36 -28
- package/base.min.css +1 -1
- package/package.json +1 -1
- package/recipes/action-button.css +4 -4
- package/recipes/action-button.d.ts +3 -3
- package/recipes/action-chip.d.ts +2 -2
- package/recipes/action-sheet-item.css +1 -1
- package/recipes/action-sheet-item.d.ts +1 -1
- package/recipes/action-sheet.css +1 -1
- package/recipes/app-bar-main.d.ts +4 -4
- package/recipes/app-bar.css +1 -1
- package/recipes/app-bar.d.ts +3 -3
- package/recipes/app-screen.d.ts +4 -4
- package/recipes/avatar.css +1 -1
- package/recipes/avatar.d.ts +1 -1
- package/recipes/badge.css +6 -6
- package/recipes/badge.d.ts +3 -3
- package/recipes/bottom-sheet.d.ts +1 -1
- package/recipes/callout.d.ts +1 -1
- package/recipes/checkbox.css +2 -2
- package/recipes/checkbox.d.ts +3 -3
- package/recipes/chip-tabs.d.ts +2 -2
- package/recipes/chip.css +36 -36
- package/recipes/chip.d.ts +3 -3
- package/recipes/contextual-floating-button.d.ts +2 -2
- package/recipes/control-chip.css +1 -1
- package/recipes/control-chip.d.ts +2 -2
- package/recipes/extended-action-sheet-item.css +1 -1
- package/recipes/extended-action-sheet-item.d.ts +1 -1
- package/recipes/extended-fab.d.ts +2 -2
- package/recipes/identity-placeholder.d.ts +1 -1
- package/recipes/inline-banner.d.ts +1 -1
- package/recipes/link-content.d.ts +2 -2
- package/recipes/manner-temp-badge.d.ts +1 -1
- package/recipes/manner-temp.d.ts +1 -1
- package/recipes/menu-sheet-item.css +1 -1
- package/recipes/menu-sheet-item.d.ts +2 -2
- package/recipes/notification-badge-positioner.d.ts +2 -2
- package/recipes/notification-badge.d.ts +1 -1
- package/recipes/page-banner.d.ts +2 -2
- package/recipes/progress-circle.d.ts +1 -1
- package/recipes/radio.css +1 -1
- package/recipes/radio.d.ts +1 -1
- package/recipes/reaction-button.css +3 -3
- package/recipes/reaction-button.d.ts +1 -1
- package/recipes/select-box.css +4 -4
- package/recipes/skeleton.d.ts +1 -1
- package/recipes/snackbar.d.ts +1 -1
- package/recipes/tabs.css +1 -1
- package/recipes/tabs.d.ts +3 -3
- package/recipes/text-field.css +3 -3
- package/recipes/text-field.d.ts +1 -1
- package/recipes/text.d.ts +3 -3
- package/recipes/toggle-button.d.ts +2 -2
- package/vars/color/fg.d.ts +3 -3
- package/vars/color/fg.mjs +3 -3
- package/vars/color/stroke.d.ts +14 -10
- package/vars/color/stroke.mjs +14 -10
- package/vars/component/action-button.d.ts +4 -4
- package/vars/component/action-button.mjs +4 -4
- package/vars/component/action-sheet.d.ts +1 -1
- package/vars/component/action-sheet.mjs +1 -1
- package/vars/component/avatar.d.ts +1 -1
- package/vars/component/avatar.mjs +1 -1
- package/vars/component/badge.d.ts +6 -6
- package/vars/component/badge.mjs +6 -6
- package/vars/component/checkbox.d.ts +2 -2
- package/vars/component/checkbox.mjs +2 -2
- package/vars/component/chip.d.ts +3 -94
- package/vars/component/chip.mjs +3 -94
- package/vars/component/control-chip.d.ts +1 -1
- package/vars/component/control-chip.mjs +1 -1
- package/vars/component/extended-action-sheet.d.ts +1 -1
- package/vars/component/extended-action-sheet.mjs +1 -1
- package/vars/component/menu-sheet.d.ts +1 -1
- package/vars/component/menu-sheet.mjs +1 -1
- package/vars/component/radio.d.ts +1 -1
- package/vars/component/radio.mjs +1 -1
- package/vars/component/reaction-button.d.ts +1 -1
- package/vars/component/reaction-button.mjs +1 -1
- package/vars/component/select-box.d.ts +4 -4
- package/vars/component/select-box.mjs +4 -4
- package/vars/component/tablist.d.ts +1 -1
- package/vars/component/tablist.mjs +1 -1
- package/vars/component/text-field.d.ts +4 -4
- package/vars/component/text-field.mjs +4 -4
- package/vars/component/top-navigation.d.ts +1 -1
- package/vars/component/top-navigation.mjs +1 -1
package/all.css
CHANGED
|
@@ -405,13 +405,13 @@
|
|
|
405
405
|
--seed-color-palette-yellow-900: #4f3e1f;
|
|
406
406
|
--seed-color-palette-yellow-1000: #2c2512;
|
|
407
407
|
--seed-color-fg-neutral: var(--seed-color-palette-gray-1000);
|
|
408
|
+
--seed-color-fg-placeholder: var(--seed-color-palette-gray-600);
|
|
409
|
+
--seed-color-fg-disabled: var(--seed-color-palette-gray-500);
|
|
408
410
|
--seed-color-fg-brand: var(--seed-color-palette-carrot-600);
|
|
411
|
+
--seed-color-fg-informative: var(--seed-color-palette-blue-700);
|
|
409
412
|
--seed-color-fg-critical: var(--seed-color-palette-red-700);
|
|
410
413
|
--seed-color-fg-positive: var(--seed-color-palette-green-700);
|
|
411
414
|
--seed-color-fg-warning: var(--seed-color-palette-yellow-700);
|
|
412
|
-
--seed-color-fg-informative: var(--seed-color-palette-blue-700);
|
|
413
|
-
--seed-color-fg-placeholder: var(--seed-color-palette-gray-600);
|
|
414
|
-
--seed-color-fg-disabled: var(--seed-color-palette-gray-500);
|
|
415
415
|
--seed-color-fg-brand-contrast: var(--seed-color-palette-carrot-700);
|
|
416
416
|
--seed-color-fg-critical-contrast: var(--seed-color-palette-red-900);
|
|
417
417
|
--seed-color-fg-informative-contrast: var(--seed-color-palette-blue-900);
|
|
@@ -457,17 +457,21 @@
|
|
|
457
457
|
--seed-color-bg-warning-solid: var(--seed-color-palette-yellow-300);
|
|
458
458
|
--seed-color-bg-warning-solid-pressed: var(--seed-color-palette-yellow-400);
|
|
459
459
|
--seed-color-bg-warning-weak-pressed: var(--seed-color-palette-yellow-200);
|
|
460
|
-
--seed-color-stroke-
|
|
461
|
-
--seed-color-stroke-brand: var(--seed-color-palette-carrot-
|
|
462
|
-
--seed-color-stroke-
|
|
463
|
-
--seed-color-stroke-
|
|
464
|
-
--seed-color-stroke-
|
|
465
|
-
--seed-color-stroke-
|
|
466
|
-
--seed-color-stroke-
|
|
467
|
-
--seed-color-stroke-
|
|
468
|
-
--seed-color-stroke-
|
|
469
|
-
--seed-color-stroke-neutral-muted: var(--seed-color-palette-static-black-alpha-
|
|
470
|
-
--seed-color-stroke-
|
|
460
|
+
--seed-color-stroke-brand-weak: var(--seed-color-palette-carrot-300);
|
|
461
|
+
--seed-color-stroke-brand-solid: var(--seed-color-palette-carrot-700);
|
|
462
|
+
--seed-color-stroke-critical-weak: var(--seed-color-palette-red-300);
|
|
463
|
+
--seed-color-stroke-critical-solid: var(--seed-color-palette-red-700);
|
|
464
|
+
--seed-color-stroke-informative-weak: var(--seed-color-palette-blue-300);
|
|
465
|
+
--seed-color-stroke-informative-solid: var(--seed-color-palette-blue-700);
|
|
466
|
+
--seed-color-stroke-neutral-contrast: var(--seed-color-palette-gray-1000);
|
|
467
|
+
--seed-color-stroke-neutral-solid: var(--seed-color-palette-gray-800);
|
|
468
|
+
--seed-color-stroke-neutral-weak: var(--seed-color-palette-gray-400);
|
|
469
|
+
--seed-color-stroke-neutral-muted: var(--seed-color-palette-static-black-alpha-300);
|
|
470
|
+
--seed-color-stroke-neutral-subtle: var(--seed-color-palette-static-black-alpha-200);
|
|
471
|
+
--seed-color-stroke-positive-weak: var(--seed-color-palette-green-300);
|
|
472
|
+
--seed-color-stroke-positive-solid: var(--seed-color-palette-green-700);
|
|
473
|
+
--seed-color-stroke-warning-weak: var(--seed-color-palette-yellow-300);
|
|
474
|
+
--seed-color-stroke-warning-solid: var(--seed-color-palette-yellow-700);
|
|
471
475
|
--seed-color-manner-temp-l1-text: #62666a;
|
|
472
476
|
--seed-color-manner-temp-l2-text: #2592f7;
|
|
473
477
|
--seed-color-manner-temp-l3-text: #0099c8;
|
|
@@ -586,13 +590,13 @@
|
|
|
586
590
|
--seed-color-palette-yellow-900: #e5d49b;
|
|
587
591
|
--seed-color-palette-yellow-1000: #f7f0cd;
|
|
588
592
|
--seed-color-fg-neutral: var(--seed-color-palette-gray-1000);
|
|
593
|
+
--seed-color-fg-placeholder: var(--seed-color-palette-gray-600);
|
|
594
|
+
--seed-color-fg-disabled: var(--seed-color-palette-gray-500);
|
|
589
595
|
--seed-color-fg-brand: var(--seed-color-palette-carrot-700);
|
|
596
|
+
--seed-color-fg-informative: var(--seed-color-palette-blue-700);
|
|
590
597
|
--seed-color-fg-critical: var(--seed-color-palette-red-700);
|
|
591
598
|
--seed-color-fg-positive: var(--seed-color-palette-green-700);
|
|
592
599
|
--seed-color-fg-warning: var(--seed-color-palette-yellow-700);
|
|
593
|
-
--seed-color-fg-informative: var(--seed-color-palette-blue-700);
|
|
594
|
-
--seed-color-fg-placeholder: var(--seed-color-palette-gray-600);
|
|
595
|
-
--seed-color-fg-disabled: var(--seed-color-palette-gray-500);
|
|
596
600
|
--seed-color-fg-brand-contrast: var(--seed-color-palette-carrot-700);
|
|
597
601
|
--seed-color-fg-critical-contrast: var(--seed-color-palette-red-900);
|
|
598
602
|
--seed-color-fg-informative-contrast: var(--seed-color-palette-blue-900);
|
|
@@ -638,17 +642,21 @@
|
|
|
638
642
|
--seed-color-bg-warning-solid: var(--seed-color-palette-yellow-600);
|
|
639
643
|
--seed-color-bg-warning-solid-pressed: var(--seed-color-palette-yellow-700);
|
|
640
644
|
--seed-color-bg-warning-weak-pressed: var(--seed-color-palette-yellow-200);
|
|
641
|
-
--seed-color-stroke-
|
|
642
|
-
--seed-color-stroke-brand: var(--seed-color-palette-carrot-
|
|
643
|
-
--seed-color-stroke-
|
|
644
|
-
--seed-color-stroke-
|
|
645
|
-
--seed-color-stroke-
|
|
646
|
-
--seed-color-stroke-
|
|
647
|
-
--seed-color-stroke-
|
|
648
|
-
--seed-color-stroke-
|
|
649
|
-
--seed-color-stroke-
|
|
650
|
-
--seed-color-stroke-neutral-muted: var(--seed-color-palette-static-white-alpha-
|
|
651
|
-
--seed-color-stroke-
|
|
645
|
+
--seed-color-stroke-brand-weak: var(--seed-color-palette-carrot-300);
|
|
646
|
+
--seed-color-stroke-brand-solid: var(--seed-color-palette-carrot-700);
|
|
647
|
+
--seed-color-stroke-critical-weak: var(--seed-color-palette-red-300);
|
|
648
|
+
--seed-color-stroke-critical-solid: var(--seed-color-palette-red-700);
|
|
649
|
+
--seed-color-stroke-informative-weak: var(--seed-color-palette-blue-300);
|
|
650
|
+
--seed-color-stroke-informative-solid: var(--seed-color-palette-blue-700);
|
|
651
|
+
--seed-color-stroke-neutral-contrast: var(--seed-color-palette-gray-1000);
|
|
652
|
+
--seed-color-stroke-neutral-solid: var(--seed-color-palette-gray-800);
|
|
653
|
+
--seed-color-stroke-neutral-weak: var(--seed-color-palette-gray-400);
|
|
654
|
+
--seed-color-stroke-neutral-muted: var(--seed-color-palette-static-white-alpha-100);
|
|
655
|
+
--seed-color-stroke-neutral-subtle: var(--seed-color-palette-static-white-alpha-50);
|
|
656
|
+
--seed-color-stroke-positive-weak: var(--seed-color-palette-green-300);
|
|
657
|
+
--seed-color-stroke-positive-solid: var(--seed-color-palette-green-700);
|
|
658
|
+
--seed-color-stroke-warning-weak: var(--seed-color-palette-yellow-300);
|
|
659
|
+
--seed-color-stroke-warning-solid: var(--seed-color-palette-yellow-700);
|
|
652
660
|
--seed-color-manner-temp-l1-text: #b1b5b9;
|
|
653
661
|
--seed-color-manner-temp-l2-text: #7cbaf4;
|
|
654
662
|
--seed-color-manner-temp-l3-text: #47c3eb;
|
|
@@ -830,7 +838,7 @@
|
|
|
830
838
|
background: var(--seed-color-bg-layer-default);
|
|
831
839
|
border-style: solid;
|
|
832
840
|
border-width: 1px;
|
|
833
|
-
border-color: var(--seed-color-stroke-neutral);
|
|
841
|
+
border-color: var(--seed-color-stroke-neutral-muted);
|
|
834
842
|
color: var(--seed-color-fg-brand);
|
|
835
843
|
--seed-prefix-icon-color: var(--seed-color-fg-brand);
|
|
836
844
|
--seed-suffix-icon-color: var(--seed-color-fg-brand);
|
|
@@ -845,7 +853,7 @@
|
|
|
845
853
|
|
|
846
854
|
.seed-action-button--variant_brandOutline:is(:disabled, [disabled], [data-disabled]) {
|
|
847
855
|
background: var(--seed-color-bg-layer-default);
|
|
848
|
-
border-color: var(--seed-color-stroke-neutral);
|
|
856
|
+
border-color: var(--seed-color-stroke-neutral-muted);
|
|
849
857
|
color: var(--seed-color-fg-disabled);
|
|
850
858
|
--seed-prefix-icon-color: var(--seed-color-fg-disabled);
|
|
851
859
|
--seed-suffix-icon-color: var(--seed-color-fg-disabled);
|
|
@@ -860,7 +868,7 @@
|
|
|
860
868
|
background: var(--seed-color-bg-layer-default);
|
|
861
869
|
border-style: solid;
|
|
862
870
|
border-width: 1px;
|
|
863
|
-
border-color: var(--seed-color-stroke-neutral);
|
|
871
|
+
border-color: var(--seed-color-stroke-neutral-muted);
|
|
864
872
|
color: var(--seed-color-fg-neutral);
|
|
865
873
|
--seed-prefix-icon-color: var(--seed-color-fg-neutral);
|
|
866
874
|
--seed-suffix-icon-color: var(--seed-color-fg-neutral);
|
|
@@ -875,7 +883,7 @@
|
|
|
875
883
|
|
|
876
884
|
.seed-action-button--variant_neutralOutline:is(:disabled, [disabled], [data-disabled]) {
|
|
877
885
|
background: var(--seed-color-bg-layer-default);
|
|
878
|
-
border-color: var(--seed-color-stroke-neutral);
|
|
886
|
+
border-color: var(--seed-color-stroke-neutral-muted);
|
|
879
887
|
color: var(--seed-color-fg-disabled);
|
|
880
888
|
--seed-prefix-icon-color: var(--seed-color-fg-disabled);
|
|
881
889
|
--seed-suffix-icon-color: var(--seed-color-fg-disabled);
|
|
@@ -1196,7 +1204,7 @@
|
|
|
1196
1204
|
content: "";
|
|
1197
1205
|
left: var(--seed-dimension-spacing-x-global-gutter);
|
|
1198
1206
|
right: var(--seed-dimension-spacing-x-global-gutter);
|
|
1199
|
-
background: var(--seed-color-stroke-neutral);
|
|
1207
|
+
background: var(--seed-color-stroke-neutral-muted);
|
|
1200
1208
|
height: 1px;
|
|
1201
1209
|
display: block;
|
|
1202
1210
|
position: absolute;
|
|
@@ -1263,7 +1271,7 @@
|
|
|
1263
1271
|
content: "";
|
|
1264
1272
|
left: var(--seed-dimension-spacing-x-global-gutter);
|
|
1265
1273
|
right: var(--seed-dimension-spacing-x-global-gutter);
|
|
1266
|
-
background: var(--seed-color-stroke-neutral);
|
|
1274
|
+
background: var(--seed-color-stroke-neutral-muted);
|
|
1267
1275
|
height: 1px;
|
|
1268
1276
|
display: block;
|
|
1269
1277
|
position: absolute;
|
|
@@ -1500,7 +1508,7 @@
|
|
|
1500
1508
|
}
|
|
1501
1509
|
|
|
1502
1510
|
.seed-app-bar__root--divider_true:before {
|
|
1503
|
-
box-shadow: inset 0px calc(-1 * 1px) 0 var(--seed-color-stroke-neutral-
|
|
1511
|
+
box-shadow: inset 0px calc(-1 * 1px) 0 var(--seed-color-stroke-neutral-subtle);
|
|
1504
1512
|
}
|
|
1505
1513
|
|
|
1506
1514
|
.seed-app-bar-main__root {
|
|
@@ -1890,7 +1898,7 @@
|
|
|
1890
1898
|
content: "";
|
|
1891
1899
|
pointer-events: none;
|
|
1892
1900
|
border-radius: var(--seed-radius-full);
|
|
1893
|
-
box-shadow: inset 0 0 0 var(--avatar-stroke-width) var(--seed-color-stroke-
|
|
1901
|
+
box-shadow: inset 0 0 0 var(--avatar-stroke-width) var(--seed-color-stroke-neutral-subtle);
|
|
1894
1902
|
-webkit-mask-image: url("data:image/svg+xml;utf8,<svg width=\"32\" height=\"32\" viewBox=\"0 0 32 32\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"><circle cx=\"16\" cy=\"16\" r=\"16\" fill=\"white\"/></svg>"), var(--svg-mask-uri);
|
|
1895
1903
|
-webkit-mask-size: 100% 100%, var(--badge-mask-size) var(--badge-mask-size);
|
|
1896
1904
|
-webkit-mask-position: 0 0, var(--badge-mask-offset) var(--badge-mask-offset);
|
|
@@ -2241,7 +2249,7 @@
|
|
|
2241
2249
|
}
|
|
2242
2250
|
|
|
2243
2251
|
.seed-badge__root--tone_neutral-variant_outline {
|
|
2244
|
-
box-shadow: inset 0 0 0 1px var(--seed-color-stroke-neutral);
|
|
2252
|
+
box-shadow: inset 0 0 0 1px var(--seed-color-stroke-neutral-muted);
|
|
2245
2253
|
color: var(--seed-color-fg-neutral-muted);
|
|
2246
2254
|
}
|
|
2247
2255
|
|
|
@@ -2256,7 +2264,7 @@
|
|
|
2256
2264
|
}
|
|
2257
2265
|
|
|
2258
2266
|
.seed-badge__root--tone_brand-variant_outline {
|
|
2259
|
-
box-shadow: inset 0 0 0 1px var(--seed-color-stroke-brand);
|
|
2267
|
+
box-shadow: inset 0 0 0 1px var(--seed-color-stroke-brand-weak);
|
|
2260
2268
|
color: var(--seed-color-fg-brand);
|
|
2261
2269
|
}
|
|
2262
2270
|
|
|
@@ -2271,7 +2279,7 @@
|
|
|
2271
2279
|
}
|
|
2272
2280
|
|
|
2273
2281
|
.seed-badge__root--tone_informative-variant_outline {
|
|
2274
|
-
box-shadow: inset 0 0 0 1px var(--seed-color-stroke-informative);
|
|
2282
|
+
box-shadow: inset 0 0 0 1px var(--seed-color-stroke-informative-weak);
|
|
2275
2283
|
color: var(--seed-color-fg-informative);
|
|
2276
2284
|
}
|
|
2277
2285
|
|
|
@@ -2286,7 +2294,7 @@
|
|
|
2286
2294
|
}
|
|
2287
2295
|
|
|
2288
2296
|
.seed-badge__root--tone_positive-variant_outline {
|
|
2289
|
-
box-shadow: inset 0 0 0 1px var(--seed-color-stroke-positive);
|
|
2297
|
+
box-shadow: inset 0 0 0 1px var(--seed-color-stroke-positive-weak);
|
|
2290
2298
|
color: var(--seed-color-fg-positive);
|
|
2291
2299
|
}
|
|
2292
2300
|
|
|
@@ -2301,7 +2309,7 @@
|
|
|
2301
2309
|
}
|
|
2302
2310
|
|
|
2303
2311
|
.seed-badge__root--tone_warning-variant_outline {
|
|
2304
|
-
box-shadow: inset 0 0 0 1px var(--seed-color-stroke-warning);
|
|
2312
|
+
box-shadow: inset 0 0 0 1px var(--seed-color-stroke-warning-weak);
|
|
2305
2313
|
color: var(--seed-color-fg-warning);
|
|
2306
2314
|
}
|
|
2307
2315
|
|
|
@@ -2316,7 +2324,7 @@
|
|
|
2316
2324
|
}
|
|
2317
2325
|
|
|
2318
2326
|
.seed-badge__root--tone_critical-variant_outline {
|
|
2319
|
-
box-shadow: inset 0 0 0 1px var(--seed-color-stroke-critical);
|
|
2327
|
+
box-shadow: inset 0 0 0 1px var(--seed-color-stroke-critical-weak);
|
|
2320
2328
|
color: var(--seed-color-fg-critical);
|
|
2321
2329
|
}
|
|
2322
2330
|
|
|
@@ -2671,7 +2679,7 @@
|
|
|
2671
2679
|
.seed-checkbox__control--variant_square {
|
|
2672
2680
|
border-style: solid;
|
|
2673
2681
|
border-width: 1px;
|
|
2674
|
-
border-color: var(--seed-color-stroke-
|
|
2682
|
+
border-color: var(--seed-color-stroke-neutral-weak);
|
|
2675
2683
|
}
|
|
2676
2684
|
|
|
2677
2685
|
.seed-checkbox__control--variant_square:is(:checked, :indeterminate, [data-checked], [data-indeterminate]) {
|
|
@@ -2689,7 +2697,7 @@
|
|
|
2689
2697
|
|
|
2690
2698
|
.seed-checkbox__control--variant_square:is(:disabled, [disabled], [data-disabled]) {
|
|
2691
2699
|
background: var(--seed-color-bg-disabled);
|
|
2692
|
-
border-color: var(--seed-color-stroke-neutral);
|
|
2700
|
+
border-color: var(--seed-color-stroke-neutral-muted);
|
|
2693
2701
|
}
|
|
2694
2702
|
|
|
2695
2703
|
.seed-checkbox__control--variant_square:is(:disabled, [disabled], [data-disabled]):is(:active, [data-active]) {
|
|
@@ -2823,14 +2831,9 @@
|
|
|
2823
2831
|
cursor: not-allowed;
|
|
2824
2832
|
}
|
|
2825
2833
|
|
|
2826
|
-
.seed-chip__root {
|
|
2827
|
-
--seed-icon-color: inherit;
|
|
2828
|
-
}
|
|
2829
|
-
|
|
2830
2834
|
.seed-chip__label {
|
|
2831
2835
|
font-weight: var(--seed-font-weight-medium);
|
|
2832
2836
|
padding-inline: var(--seed-dimension-x1_5);
|
|
2833
|
-
color: inherit;
|
|
2834
2837
|
justify-content: center;
|
|
2835
2838
|
align-items: center;
|
|
2836
2839
|
display: inline-flex;
|
|
@@ -2838,7 +2841,6 @@
|
|
|
2838
2841
|
|
|
2839
2842
|
.seed-chip__prefixIcon {
|
|
2840
2843
|
padding-left: var(--seed-dimension-x1_5);
|
|
2841
|
-
--seed-icon-color: inherit;
|
|
2842
2844
|
flex-shrink: 0;
|
|
2843
2845
|
align-items: center;
|
|
2844
2846
|
display: inline-flex;
|
|
@@ -2852,7 +2854,6 @@
|
|
|
2852
2854
|
|
|
2853
2855
|
.seed-chip__suffixIcon {
|
|
2854
2856
|
padding-right: var(--seed-dimension-x1_5);
|
|
2855
|
-
--seed-icon-color: inherit;
|
|
2856
2857
|
flex-shrink: 0;
|
|
2857
2858
|
align-items: center;
|
|
2858
2859
|
display: inline-flex;
|
|
@@ -2860,101 +2861,99 @@
|
|
|
2860
2861
|
|
|
2861
2862
|
.seed-chip__root--variant_solid {
|
|
2862
2863
|
background: var(--seed-color-bg-neutral-weak);
|
|
2863
|
-
color: var(--seed-color-fg-neutral);
|
|
2864
|
+
--seed-icon-color: var(--seed-color-fg-neutral);
|
|
2864
2865
|
}
|
|
2865
2866
|
|
|
2866
2867
|
.seed-chip__root--variant_solid:is(:checked, [data-checked]) {
|
|
2867
2868
|
box-shadow: none;
|
|
2868
2869
|
background: var(--seed-color-bg-neutral-inverted);
|
|
2869
|
-
color: var(--seed-color-fg-neutral-inverted);
|
|
2870
2870
|
--seed-icon-color: var(--seed-color-fg-neutral-inverted);
|
|
2871
2871
|
}
|
|
2872
2872
|
|
|
2873
2873
|
.seed-chip__root--variant_solid:is(:active, [data-active]):not(:is(:disabled, [disabled], [data-disabled])) {
|
|
2874
2874
|
background: var(--seed-color-bg-neutral-weak-pressed);
|
|
2875
|
-
color: var(--seed-color-fg-neutral);
|
|
2876
|
-
--seed-icon-color: var(--seed-color-fg-neutral);
|
|
2877
2875
|
}
|
|
2878
2876
|
|
|
2879
2877
|
.seed-chip__root--variant_solid:is(:checked, [data-checked]):is(:active, [data-active]):not(:is(:disabled, [disabled], [data-disabled])) {
|
|
2880
2878
|
background: var(--seed-color-bg-neutral-inverted-pressed);
|
|
2881
|
-
color: var(--seed-color-fg-neutral-inverted);
|
|
2882
|
-
--seed-icon-color: var(--seed-color-fg-neutral-inverted);
|
|
2883
2879
|
}
|
|
2884
2880
|
|
|
2885
2881
|
.seed-chip__root--variant_solid:is(:disabled, [disabled], [data-disabled]) {
|
|
2886
2882
|
opacity: .5;
|
|
2887
2883
|
}
|
|
2888
2884
|
|
|
2889
|
-
.seed-
|
|
2890
|
-
|
|
2885
|
+
.seed-chip__label--variant_solid {
|
|
2886
|
+
color: var(--seed-color-fg-neutral);
|
|
2887
|
+
}
|
|
2888
|
+
|
|
2889
|
+
.seed-chip__label--variant_solid:is(:checked, [data-checked]) {
|
|
2890
|
+
color: var(--seed-color-fg-neutral-inverted);
|
|
2891
|
+
}
|
|
2892
|
+
|
|
2893
|
+
.seed-chip__prefixIcon--variant_solid, .seed-chip__suffixIcon--variant_solid {
|
|
2894
|
+
color: var(--seed-color-fg-neutral);
|
|
2891
2895
|
}
|
|
2892
2896
|
|
|
2893
2897
|
.seed-chip__root--variant_outlineStrong {
|
|
2894
2898
|
background: var(--seed-color-bg-layer-default);
|
|
2895
|
-
box-shadow: inset 0 0 0 1px var(--seed-color-stroke-neutral);
|
|
2896
|
-
color: var(--seed-color-fg-neutral);
|
|
2899
|
+
box-shadow: inset 0 0 0 1px var(--seed-color-stroke-neutral-muted);
|
|
2900
|
+
--seed-icon-color: var(--seed-color-fg-neutral);
|
|
2897
2901
|
}
|
|
2898
2902
|
|
|
2899
2903
|
.seed-chip__root--variant_outlineStrong:is(:active, [data-active]):not(:is(:disabled, [disabled], [data-disabled])) {
|
|
2900
2904
|
background: var(--seed-color-bg-layer-default-pressed);
|
|
2901
|
-
color: var(--seed-color-fg-neutral);
|
|
2902
|
-
--seed-icon-color: var(--seed-color-fg-neutral);
|
|
2903
2905
|
}
|
|
2904
2906
|
|
|
2905
2907
|
.seed-chip__root--variant_outlineStrong:is(:checked, [data-checked]) {
|
|
2906
2908
|
background: var(--seed-color-bg-neutral-inverted);
|
|
2907
|
-
color: var(--seed-color-fg-neutral-inverted);
|
|
2908
2909
|
--seed-icon-color: var(--seed-color-fg-neutral-inverted);
|
|
2909
2910
|
}
|
|
2910
2911
|
|
|
2911
2912
|
.seed-chip__root--variant_outlineStrong:is(:checked, [data-checked]):is(:active, [data-active]):not(:is(:disabled, [disabled], [data-disabled])) {
|
|
2912
2913
|
background: var(--seed-color-bg-neutral-inverted-pressed);
|
|
2913
|
-
color: var(--seed-color-fg-neutral-inverted);
|
|
2914
|
-
--seed-icon-color: var(--seed-color-fg-neutral-inverted);
|
|
2915
2914
|
}
|
|
2916
2915
|
|
|
2917
2916
|
.seed-chip__root--variant_outlineStrong:is(:disabled, [disabled], [data-disabled]) {
|
|
2918
2917
|
opacity: .5;
|
|
2919
2918
|
}
|
|
2920
2919
|
|
|
2921
|
-
.seed-
|
|
2922
|
-
|
|
2920
|
+
.seed-chip__label--variant_outlineStrong {
|
|
2921
|
+
color: var(--seed-color-fg-neutral);
|
|
2922
|
+
}
|
|
2923
|
+
|
|
2924
|
+
.seed-chip__label--variant_outlineStrong:is(:checked, [data-checked]) {
|
|
2925
|
+
color: var(--seed-color-fg-neutral-inverted);
|
|
2926
|
+
}
|
|
2927
|
+
|
|
2928
|
+
.seed-chip__prefixIcon--variant_outlineStrong, .seed-chip__suffixIcon--variant_outlineStrong {
|
|
2929
|
+
color: var(--seed-color-fg-neutral);
|
|
2923
2930
|
}
|
|
2924
2931
|
|
|
2925
2932
|
.seed-chip__root--variant_outlineWeak {
|
|
2926
2933
|
background: var(--seed-color-bg-layer-default);
|
|
2927
|
-
box-shadow: inset 0 0 0 1px var(--seed-color-stroke-neutral);
|
|
2928
|
-
color: var(--seed-color-fg-neutral);
|
|
2934
|
+
box-shadow: inset 0 0 0 1px var(--seed-color-stroke-neutral-muted);
|
|
2935
|
+
--seed-icon-color: var(--seed-color-fg-neutral);
|
|
2929
2936
|
}
|
|
2930
2937
|
|
|
2931
2938
|
.seed-chip__root--variant_outlineWeak:is(:active, [data-active]):not(:is(:disabled, [disabled], [data-disabled])) {
|
|
2932
2939
|
background: var(--seed-color-bg-layer-default-pressed);
|
|
2933
|
-
box-shadow: inset 0 0 0 1px var(--seed-color-stroke-neutral);
|
|
2934
|
-
color: var(--seed-color-fg-neutral);
|
|
2935
|
-
--seed-icon-color: var(--seed-color-fg-neutral);
|
|
2936
2940
|
}
|
|
2937
2941
|
|
|
2938
2942
|
.seed-chip__root--variant_outlineWeak:is(:checked, [data-checked]) {
|
|
2939
2943
|
background: var(--seed-color-bg-neutral-weak);
|
|
2940
|
-
box-shadow: inset 0 0 0 1px var(--seed-color-stroke-
|
|
2941
|
-
color: var(--seed-color-fg-neutral);
|
|
2942
|
-
--seed-icon-color: var(--seed-color-fg-neutral);
|
|
2944
|
+
box-shadow: inset 0 0 0 1px var(--seed-color-stroke-neutral-contrast);
|
|
2943
2945
|
}
|
|
2944
2946
|
|
|
2945
2947
|
.seed-chip__root--variant_outlineWeak:is(:checked, [data-checked]):is(:active, [data-active]):not(:is(:disabled, [disabled], [data-disabled])) {
|
|
2946
2948
|
background: var(--seed-color-bg-neutral-weak-pressed);
|
|
2947
|
-
box-shadow: inset 0 0 0 1px var(--seed-color-stroke-field-focused);
|
|
2948
|
-
color: var(--seed-color-fg-neutral);
|
|
2949
|
-
--seed-icon-color: var(--seed-color-fg-neutral);
|
|
2950
2949
|
}
|
|
2951
2950
|
|
|
2952
2951
|
.seed-chip__root--variant_outlineWeak:is(:disabled, [disabled], [data-disabled]) {
|
|
2953
2952
|
opacity: .5;
|
|
2954
2953
|
}
|
|
2955
2954
|
|
|
2956
|
-
.seed-
|
|
2957
|
-
|
|
2955
|
+
.seed-chip__label--variant_outlineWeak, .seed-chip__prefixIcon--variant_outlineWeak, .seed-chip__suffixIcon--variant_outlineWeak {
|
|
2956
|
+
color: var(--seed-color-fg-neutral);
|
|
2958
2957
|
}
|
|
2959
2958
|
|
|
2960
2959
|
.seed-chip__root--size_large {
|
|
@@ -3292,7 +3291,7 @@
|
|
|
3292
3291
|
-webkit-font-smoothing: antialiased;
|
|
3293
3292
|
-moz-osx-font-smoothing: grayscale;
|
|
3294
3293
|
border-radius: var(--seed-radius-full);
|
|
3295
|
-
box-shadow: inset 0 0 0 1px var(--seed-color-stroke-neutral);
|
|
3294
|
+
box-shadow: inset 0 0 0 1px var(--seed-color-stroke-neutral-muted);
|
|
3296
3295
|
color: var(--seed-color-fg-neutral);
|
|
3297
3296
|
line-height: 1;
|
|
3298
3297
|
font-weight: var(--seed-font-weight-medium);
|
|
@@ -3628,7 +3627,7 @@
|
|
|
3628
3627
|
justify-content: flex-start;
|
|
3629
3628
|
align-items: center;
|
|
3630
3629
|
gap: var(--seed-dimension-x3_5);
|
|
3631
|
-
box-shadow: inset 0 calc(-1 * 1px) 0 var(--seed-color-stroke-neutral);
|
|
3630
|
+
box-shadow: inset 0 calc(-1 * 1px) 0 var(--seed-color-stroke-neutral-muted);
|
|
3632
3631
|
font-size: var(--seed-font-size-t5);
|
|
3633
3632
|
line-height: var(--seed-line-height-t5);
|
|
3634
3633
|
font-weight: var(--seed-font-weight-regular);
|
|
@@ -4388,7 +4387,7 @@
|
|
|
4388
4387
|
padding-block: var(--seed-dimension-x3_5);
|
|
4389
4388
|
align-items: center;
|
|
4390
4389
|
gap: var(--seed-dimension-x3_5);
|
|
4391
|
-
box-shadow: inset 0 calc(-1 * 1px) 0 var(--seed-color-stroke-neutral);
|
|
4390
|
+
box-shadow: inset 0 calc(-1 * 1px) 0 var(--seed-color-stroke-neutral-muted);
|
|
4392
4391
|
font-size: var(--seed-font-size-t5);
|
|
4393
4392
|
line-height: var(--seed-line-height-t5);
|
|
4394
4393
|
font-weight: var(--seed-font-weight-regular);
|
|
@@ -4787,7 +4786,7 @@
|
|
|
4787
4786
|
background-color: var(--seed-color-bg-layer-default);
|
|
4788
4787
|
border-style: solid;
|
|
4789
4788
|
border-width: 1px;
|
|
4790
|
-
border-color: var(--seed-color-stroke-
|
|
4789
|
+
border-color: var(--seed-color-stroke-neutral-weak);
|
|
4791
4790
|
border-radius: var(--seed-radius-full);
|
|
4792
4791
|
flex: none;
|
|
4793
4792
|
justify-content: center;
|
|
@@ -4901,7 +4900,7 @@
|
|
|
4901
4900
|
.seed-reaction-button:is([aria-pressed="true"], [data-pressed]) {
|
|
4902
4901
|
background: var(--seed-color-bg-layer-default);
|
|
4903
4902
|
color: var(--seed-color-fg-brand);
|
|
4904
|
-
box-shadow: inset 0 0 0 1px var(--seed-color-stroke-brand);
|
|
4903
|
+
box-shadow: inset 0 0 0 1px var(--seed-color-stroke-brand-weak);
|
|
4905
4904
|
--seed-prefix-icon-color: var(--seed-color-fg-brand);
|
|
4906
4905
|
--seed-count-color: var(--seed-color-fg-brand);
|
|
4907
4906
|
}
|
|
@@ -4914,7 +4913,7 @@
|
|
|
4914
4913
|
cursor: not-allowed;
|
|
4915
4914
|
background: var(--seed-color-bg-disabled);
|
|
4916
4915
|
color: var(--seed-color-fg-disabled);
|
|
4917
|
-
box-shadow: inset 0 0 0 0px var(--seed-color-stroke-brand);
|
|
4916
|
+
box-shadow: inset 0 0 0 0px var(--seed-color-stroke-brand-weak);
|
|
4918
4917
|
--seed-prefix-icon-color: var(--seed-color-fg-disabled);
|
|
4919
4918
|
--seed-count-color: var(--seed-color-fg-disabled);
|
|
4920
4919
|
}
|
|
@@ -4925,7 +4924,7 @@
|
|
|
4925
4924
|
|
|
4926
4925
|
.seed-reaction-button:is([aria-pressed="true"], [data-pressed])[data-loading] {
|
|
4927
4926
|
background: var(--seed-color-bg-layer-default-pressed);
|
|
4928
|
-
box-shadow: inset 0 0 0 1px var(--seed-color-stroke-brand);
|
|
4927
|
+
box-shadow: inset 0 0 0 1px var(--seed-color-stroke-brand-weak);
|
|
4929
4928
|
--track-color: var(--seed-color-palette-carrot-200);
|
|
4930
4929
|
--range-color: var(--seed-color-fg-brand);
|
|
4931
4930
|
}
|
|
@@ -5030,7 +5029,7 @@
|
|
|
5030
5029
|
padding-inline: var(--seed-dimension-x4);
|
|
5031
5030
|
padding-block: var(--seed-dimension-x5);
|
|
5032
5031
|
border-radius: var(--seed-radius-r3);
|
|
5033
|
-
box-shadow: inset 0 0 0 1px var(--seed-color-stroke-neutral);
|
|
5032
|
+
box-shadow: inset 0 0 0 1px var(--seed-color-stroke-neutral-muted);
|
|
5034
5033
|
display: flex;
|
|
5035
5034
|
}
|
|
5036
5035
|
|
|
@@ -5040,7 +5039,7 @@
|
|
|
5040
5039
|
|
|
5041
5040
|
.seed-select-box__root:is(:checked, [data-checked]) {
|
|
5042
5041
|
background-color: var(--seed-color-bg-neutral-weak);
|
|
5043
|
-
box-shadow: inset 0 0 0 1px var(--seed-color-stroke-
|
|
5042
|
+
box-shadow: inset 0 0 0 1px var(--seed-color-stroke-neutral-weak);
|
|
5044
5043
|
}
|
|
5045
5044
|
|
|
5046
5045
|
.seed-select-box__root:is(:checked, [data-checked]):is(:active, [data-active]) {
|
|
@@ -5061,7 +5060,7 @@
|
|
|
5061
5060
|
background-color: var(--seed-color-bg-layer-default);
|
|
5062
5061
|
border-style: solid;
|
|
5063
5062
|
border-width: 1px;
|
|
5064
|
-
border-color: var(--seed-color-stroke-
|
|
5063
|
+
border-color: var(--seed-color-stroke-neutral-weak);
|
|
5065
5064
|
border-radius: var(--seed-radius-r1);
|
|
5066
5065
|
flex: none;
|
|
5067
5066
|
justify-content: center;
|
|
@@ -5100,7 +5099,7 @@
|
|
|
5100
5099
|
background-color: var(--seed-color-bg-layer-default);
|
|
5101
5100
|
border-style: solid;
|
|
5102
5101
|
border-width: 1px;
|
|
5103
|
-
border-color: var(--seed-color-stroke-
|
|
5102
|
+
border-color: var(--seed-color-stroke-neutral-weak);
|
|
5104
5103
|
border-radius: var(--seed-radius-full);
|
|
5105
5104
|
flex: none;
|
|
5106
5105
|
justify-content: center;
|
|
@@ -5468,7 +5467,7 @@
|
|
|
5468
5467
|
|
|
5469
5468
|
.seed-tabs__list {
|
|
5470
5469
|
background: var(--seed-color-bg-layer-default);
|
|
5471
|
-
box-shadow: inset 0 -1px var(--seed-color-stroke-neutral);
|
|
5470
|
+
box-shadow: inset 0 -1px var(--seed-color-stroke-neutral-muted);
|
|
5472
5471
|
}
|
|
5473
5472
|
|
|
5474
5473
|
.seed-tabs__carousel {
|
|
@@ -5865,19 +5864,19 @@
|
|
|
5865
5864
|
background-color: var(--seed-color-bg-layer-default);
|
|
5866
5865
|
border-style: solid;
|
|
5867
5866
|
border-width: 1px;
|
|
5868
|
-
border-color: var(--seed-color-stroke-
|
|
5867
|
+
border-color: var(--seed-color-stroke-neutral-weak);
|
|
5869
5868
|
align-items: center;
|
|
5870
5869
|
display: flex;
|
|
5871
5870
|
overflow: hidden;
|
|
5872
5871
|
}
|
|
5873
5872
|
|
|
5874
5873
|
.seed-text-field__field:not([data-readonly]):is(:focus, [data-focus]) {
|
|
5875
|
-
border-color: var(--seed-color-stroke-
|
|
5874
|
+
border-color: var(--seed-color-stroke-neutral-contrast);
|
|
5876
5875
|
}
|
|
5877
5876
|
|
|
5878
5877
|
.seed-text-field__field:is(:invalid, [data-invalid]) {
|
|
5879
5878
|
background-color: var(--seed-color-bg-critical-weak);
|
|
5880
|
-
border-color: var(--seed-color-stroke-critical);
|
|
5879
|
+
border-color: var(--seed-color-stroke-critical-weak);
|
|
5881
5880
|
}
|
|
5882
5881
|
|
|
5883
5882
|
.seed-text-field__field:is(:invalid, [data-invalid]):is(:focus, [data-focus]) {
|