@seed-design/css 0.1.13 → 0.1.14
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 +3677 -3418
- package/all.min.css +1 -1
- package/base.css +59 -47
- package/base.min.css +1 -1
- package/package.json +1 -1
- package/recipes/badge.css +42 -29
- package/recipes/badge.d.ts +4 -2
- package/recipes/badge.mjs +31 -4
- package/recipes/page-banner.css +247 -0
- package/recipes/page-banner.d.ts +28 -0
- package/recipes/page-banner.mjs +108 -0
- package/vars/color/bg.d.ts +9 -6
- package/vars/color/bg.mjs +9 -6
- package/vars/color/fg.d.ts +6 -4
- package/vars/color/fg.mjs +6 -4
- package/vars/color/manner-temp/l1.d.ts +2 -2
- package/vars/color/manner-temp/l1.mjs +2 -2
- package/vars/color/manner-temp/l2.d.ts +2 -2
- package/vars/color/manner-temp/l2.mjs +2 -2
- package/vars/color/manner-temp/l3.d.ts +2 -2
- package/vars/color/manner-temp/l3.mjs +2 -2
- package/vars/color/manner-temp/l4.d.ts +2 -2
- package/vars/color/manner-temp/l4.mjs +2 -2
- package/vars/color/manner-temp/l5.d.ts +2 -2
- package/vars/color/manner-temp/l5.mjs +2 -2
- package/vars/color/manner-temp/l6.d.ts +2 -2
- package/vars/color/manner-temp/l6.mjs +2 -2
- package/vars/color/stroke.d.ts +5 -4
- package/vars/color/stroke.mjs +5 -4
- package/vars/component/badge.d.ts +34 -2
- package/vars/component/badge.mjs +34 -2
- package/vars/component/index.d.ts +1 -0
- package/vars/component/index.mjs +1 -0
- package/vars/component/page-banner.d.ts +309 -0
- package/vars/component/page-banner.mjs +309 -0
- package/vars/gradient.d.ts +3 -3
- package/vars/gradient.mjs +3 -3
package/base.css
CHANGED
|
@@ -375,30 +375,34 @@
|
|
|
375
375
|
--seed-color-palette-yellow-800: #755b22;
|
|
376
376
|
--seed-color-palette-yellow-900: #4f3e1f;
|
|
377
377
|
--seed-color-palette-yellow-1000: #2c2512;
|
|
378
|
+
--seed-color-fg-neutral: var(--seed-color-palette-gray-1000);
|
|
378
379
|
--seed-color-fg-brand: var(--seed-color-palette-carrot-600);
|
|
379
380
|
--seed-color-fg-critical: var(--seed-color-palette-red-700);
|
|
380
|
-
--seed-color-fg-
|
|
381
|
+
--seed-color-fg-positive: var(--seed-color-palette-green-700);
|
|
382
|
+
--seed-color-fg-warning: var(--seed-color-palette-yellow-700);
|
|
381
383
|
--seed-color-fg-informative: var(--seed-color-palette-blue-700);
|
|
382
|
-
--seed-color-fg-neutral: var(--seed-color-palette-gray-1000);
|
|
383
384
|
--seed-color-fg-placeholder: var(--seed-color-palette-gray-600);
|
|
384
|
-
--seed-color-fg-
|
|
385
|
+
--seed-color-fg-disabled: var(--seed-color-palette-gray-500);
|
|
386
|
+
--seed-color-fg-brand-contrast: var(--seed-color-palette-carrot-700);
|
|
385
387
|
--seed-color-fg-critical-contrast: var(--seed-color-palette-red-900);
|
|
386
388
|
--seed-color-fg-informative-contrast: var(--seed-color-palette-blue-900);
|
|
387
|
-
--seed-color-fg-neutral-inverted: var(--seed-color-palette-gray-00);
|
|
388
389
|
--seed-color-fg-neutral-muted: var(--seed-color-palette-gray-800);
|
|
389
390
|
--seed-color-fg-neutral-subtle: var(--seed-color-palette-gray-700);
|
|
391
|
+
--seed-color-fg-neutral-inverted: var(--seed-color-palette-gray-00);
|
|
390
392
|
--seed-color-fg-positive-contrast: var(--seed-color-palette-green-900);
|
|
391
393
|
--seed-color-fg-warning-contrast: var(--seed-color-palette-yellow-900);
|
|
392
|
-
--seed-color-bg-disabled: var(--seed-color-palette-gray-200);
|
|
393
394
|
--seed-color-bg-overlay: var(--seed-color-palette-static-black-alpha-700);
|
|
395
|
+
--seed-color-bg-disabled: var(--seed-color-palette-gray-200);
|
|
396
|
+
--seed-color-bg-brand-weak: var(--seed-color-palette-carrot-100);
|
|
394
397
|
--seed-color-bg-brand-solid: var(--seed-color-palette-carrot-600);
|
|
395
398
|
--seed-color-bg-brand-solid-pressed: var(--seed-color-palette-carrot-700);
|
|
396
|
-
--seed-color-bg-
|
|
399
|
+
--seed-color-bg-brand-weak-pressed: var(--seed-color-palette-carrot-200);
|
|
397
400
|
--seed-color-bg-critical-weak: var(--seed-color-palette-red-100);
|
|
401
|
+
--seed-color-bg-critical-solid: var(--seed-color-palette-red-700);
|
|
398
402
|
--seed-color-bg-critical-solid-pressed: var(--seed-color-palette-red-800);
|
|
399
403
|
--seed-color-bg-critical-weak-pressed: var(--seed-color-palette-red-200);
|
|
400
|
-
--seed-color-bg-informative-solid: var(--seed-color-palette-blue-700);
|
|
401
404
|
--seed-color-bg-informative-weak: var(--seed-color-palette-blue-100);
|
|
405
|
+
--seed-color-bg-informative-solid: var(--seed-color-palette-blue-700);
|
|
402
406
|
--seed-color-bg-informative-solid-pressed: var(--seed-color-palette-blue-800);
|
|
403
407
|
--seed-color-bg-informative-weak-pressed: var(--seed-color-palette-blue-200);
|
|
404
408
|
--seed-color-bg-layer-basement: var(--seed-color-palette-gray-200);
|
|
@@ -408,51 +412,53 @@
|
|
|
408
412
|
--seed-color-bg-layer-default-pressed: var(--seed-color-palette-gray-100);
|
|
409
413
|
--seed-color-bg-layer-floating-pressed: var(--seed-color-palette-gray-100);
|
|
410
414
|
--seed-color-bg-magic-weak: #f9f2ee;
|
|
415
|
+
--seed-color-bg-neutral-weak: var(--seed-color-palette-gray-200);
|
|
411
416
|
--seed-color-bg-neutral-inverted: var(--seed-color-palette-gray-900);
|
|
412
417
|
--seed-color-bg-neutral-solid: var(--seed-color-palette-gray-1000);
|
|
413
|
-
--seed-color-bg-neutral-weak: var(--seed-color-palette-gray-200);
|
|
414
418
|
--seed-color-bg-neutral-inverted-pressed: var(--seed-color-palette-gray-800);
|
|
415
419
|
--seed-color-bg-neutral-solid-muted: var(--seed-color-palette-gray-800);
|
|
416
420
|
--seed-color-bg-neutral-solid-muted-pressed: var(--seed-color-palette-gray-900);
|
|
417
421
|
--seed-color-bg-neutral-weak-pressed: var(--seed-color-palette-gray-300);
|
|
418
422
|
--seed-color-bg-overlay-muted: var(--seed-color-palette-static-black-alpha-500);
|
|
419
|
-
--seed-color-bg-positive-solid: var(--seed-color-palette-green-700);
|
|
420
423
|
--seed-color-bg-positive-weak: var(--seed-color-palette-green-100);
|
|
424
|
+
--seed-color-bg-positive-solid: var(--seed-color-palette-green-700);
|
|
421
425
|
--seed-color-bg-positive-solid-pressed: var(--seed-color-palette-green-800);
|
|
422
426
|
--seed-color-bg-positive-weak-pressed: var(--seed-color-palette-green-200);
|
|
423
|
-
--seed-color-bg-warning-solid: var(--seed-color-palette-yellow-300);
|
|
424
427
|
--seed-color-bg-warning-weak: var(--seed-color-palette-yellow-100);
|
|
428
|
+
--seed-color-bg-warning-solid: var(--seed-color-palette-yellow-300);
|
|
429
|
+
--seed-color-bg-warning-solid-pressed: var(--seed-color-palette-yellow-400);
|
|
425
430
|
--seed-color-bg-warning-weak-pressed: var(--seed-color-palette-yellow-200);
|
|
431
|
+
--seed-color-stroke-neutral: var(--seed-color-palette-static-black-alpha-300);
|
|
426
432
|
--seed-color-stroke-brand: var(--seed-color-palette-carrot-300);
|
|
427
|
-
--seed-color-stroke-
|
|
433
|
+
--seed-color-stroke-positive: var(--seed-color-palette-green-300);
|
|
434
|
+
--seed-color-stroke-informative: var(--seed-color-palette-blue-300);
|
|
435
|
+
--seed-color-stroke-warning: var(--seed-color-palette-yellow-300);
|
|
428
436
|
--seed-color-stroke-critical: var(--seed-color-palette-red-300);
|
|
429
437
|
--seed-color-stroke-field: var(--seed-color-palette-gray-400);
|
|
430
|
-
--seed-color-stroke-
|
|
431
|
-
--seed-color-stroke-neutral: var(--seed-color-palette-static-black-alpha-300);
|
|
432
|
-
--seed-color-stroke-positive: var(--seed-color-palette-green-300);
|
|
438
|
+
--seed-color-stroke-control: var(--seed-color-palette-gray-400);
|
|
433
439
|
--seed-color-stroke-field-focused: var(--seed-color-palette-gray-800);
|
|
434
440
|
--seed-color-stroke-neutral-muted: var(--seed-color-palette-static-black-alpha-200);
|
|
435
441
|
--seed-color-stroke-on-image: var(--seed-color-palette-static-black-alpha-200);
|
|
436
|
-
--seed-color-manner-temp-l1-bg: #eff0f1;
|
|
437
442
|
--seed-color-manner-temp-l1-text: #62666a;
|
|
438
|
-
--seed-color-manner-temp-l2-bg: #e7f2fc;
|
|
439
443
|
--seed-color-manner-temp-l2-text: #2592f7;
|
|
440
|
-
--seed-color-manner-temp-l3-bg: #e3f6fc;
|
|
441
444
|
--seed-color-manner-temp-l3-text: #0099c8;
|
|
442
|
-
--seed-color-manner-temp-l4-bg: #ebf9f4;
|
|
443
445
|
--seed-color-manner-temp-l4-text: #03a07e;
|
|
444
|
-
--seed-color-manner-temp-
|
|
446
|
+
--seed-color-manner-temp-l4-bg: #ebf9f4;
|
|
445
447
|
--seed-color-manner-temp-l5-text: #d28500;
|
|
446
|
-
--seed-color-manner-temp-l6-bg: #fff0e5;
|
|
447
448
|
--seed-color-manner-temp-l6-text: #f06000;
|
|
449
|
+
--seed-color-manner-temp-l1-bg: #eff0f1;
|
|
450
|
+
--seed-color-manner-temp-l2-bg: #e7f2fc;
|
|
451
|
+
--seed-color-manner-temp-l3-bg: #e3f6fc;
|
|
452
|
+
--seed-color-manner-temp-l5-bg: #fff5e5;
|
|
453
|
+
--seed-color-manner-temp-l6-bg: #fff0e5;
|
|
448
454
|
--seed-gradient-fade-layer-floating: #fff0 0%, #000 100%;
|
|
449
|
-
--seed-gradient-fade-layer-default: #
|
|
455
|
+
--seed-gradient-fade-layer-default: #000 0%, #fff0 100%;
|
|
450
456
|
--seed-gradient-glow-magic: #fef6f7 0%, #fef0e7 80%, #f9f7f5 100%;
|
|
451
|
-
--seed-gradient-shimmer-magic: #fff9f500 0%, #fff9f58a 46%, #fff9f58a 54%, #fff9f500 100%;
|
|
452
457
|
--seed-gradient-glow-magic-pressed: #fbf0f2 0%, #ffe8db 80%, #f5f2ef 100%;
|
|
453
458
|
--seed-gradient-shimmer-neutral: #fff0 0%, #fff6 46%, #fff6 54%, #fff0 100%;
|
|
454
|
-
--seed-gradient-
|
|
459
|
+
--seed-gradient-shimmer-magic: #fff9f500 0%, #fff9f58a 46%, #fff9f58a 54%, #fff9f500 100%;
|
|
455
460
|
--seed-gradient-highlight-magic-pressed: #e14f00 20%, #ae58bf 100%;
|
|
461
|
+
--seed-gradient-highlight-magic: #f60 20%, #d25aca 100%;
|
|
456
462
|
}
|
|
457
463
|
|
|
458
464
|
:root[data-seed-color-mode="system"][data-seed-user-color-scheme="dark"], :root[data-seed-color-mode="dark-only"], :root [data-seed-color-mode="dark-only"] {
|
|
@@ -550,30 +556,34 @@
|
|
|
550
556
|
--seed-color-palette-yellow-800: #dab156;
|
|
551
557
|
--seed-color-palette-yellow-900: #e5d49b;
|
|
552
558
|
--seed-color-palette-yellow-1000: #f7f0cd;
|
|
559
|
+
--seed-color-fg-neutral: var(--seed-color-palette-gray-1000);
|
|
553
560
|
--seed-color-fg-brand: var(--seed-color-palette-carrot-700);
|
|
554
561
|
--seed-color-fg-critical: var(--seed-color-palette-red-700);
|
|
555
|
-
--seed-color-fg-
|
|
562
|
+
--seed-color-fg-positive: var(--seed-color-palette-green-700);
|
|
563
|
+
--seed-color-fg-warning: var(--seed-color-palette-yellow-700);
|
|
556
564
|
--seed-color-fg-informative: var(--seed-color-palette-blue-700);
|
|
557
|
-
--seed-color-fg-neutral: var(--seed-color-palette-gray-1000);
|
|
558
565
|
--seed-color-fg-placeholder: var(--seed-color-palette-gray-600);
|
|
559
|
-
--seed-color-fg-
|
|
566
|
+
--seed-color-fg-disabled: var(--seed-color-palette-gray-500);
|
|
567
|
+
--seed-color-fg-brand-contrast: var(--seed-color-palette-carrot-700);
|
|
560
568
|
--seed-color-fg-critical-contrast: var(--seed-color-palette-red-900);
|
|
561
569
|
--seed-color-fg-informative-contrast: var(--seed-color-palette-blue-900);
|
|
562
|
-
--seed-color-fg-neutral-inverted: var(--seed-color-palette-gray-100);
|
|
563
570
|
--seed-color-fg-neutral-muted: var(--seed-color-palette-gray-800);
|
|
564
571
|
--seed-color-fg-neutral-subtle: var(--seed-color-palette-gray-700);
|
|
572
|
+
--seed-color-fg-neutral-inverted: var(--seed-color-palette-gray-100);
|
|
565
573
|
--seed-color-fg-positive-contrast: var(--seed-color-palette-green-900);
|
|
566
574
|
--seed-color-fg-warning-contrast: var(--seed-color-palette-yellow-900);
|
|
567
|
-
--seed-color-bg-disabled: var(--seed-color-palette-gray-300);
|
|
568
575
|
--seed-color-bg-overlay: var(--seed-color-palette-static-black-alpha-700);
|
|
576
|
+
--seed-color-bg-disabled: var(--seed-color-palette-gray-300);
|
|
577
|
+
--seed-color-bg-brand-weak: var(--seed-color-palette-carrot-100);
|
|
569
578
|
--seed-color-bg-brand-solid: var(--seed-color-palette-carrot-700);
|
|
570
579
|
--seed-color-bg-brand-solid-pressed: var(--seed-color-palette-carrot-800);
|
|
571
|
-
--seed-color-bg-
|
|
580
|
+
--seed-color-bg-brand-weak-pressed: var(--seed-color-palette-carrot-200);
|
|
572
581
|
--seed-color-bg-critical-weak: var(--seed-color-palette-red-100);
|
|
582
|
+
--seed-color-bg-critical-solid: var(--seed-color-palette-red-600);
|
|
573
583
|
--seed-color-bg-critical-solid-pressed: var(--seed-color-palette-red-700);
|
|
574
584
|
--seed-color-bg-critical-weak-pressed: var(--seed-color-palette-red-200);
|
|
575
|
-
--seed-color-bg-informative-solid: var(--seed-color-palette-blue-600);
|
|
576
585
|
--seed-color-bg-informative-weak: var(--seed-color-palette-blue-100);
|
|
586
|
+
--seed-color-bg-informative-solid: var(--seed-color-palette-blue-600);
|
|
577
587
|
--seed-color-bg-informative-solid-pressed: var(--seed-color-palette-blue-700);
|
|
578
588
|
--seed-color-bg-informative-weak-pressed: var(--seed-color-palette-blue-200);
|
|
579
589
|
--seed-color-bg-layer-basement: var(--seed-color-palette-gray-00);
|
|
@@ -583,51 +593,53 @@
|
|
|
583
593
|
--seed-color-bg-layer-default-pressed: var(--seed-color-palette-gray-300);
|
|
584
594
|
--seed-color-bg-layer-floating-pressed: var(--seed-color-palette-gray-300);
|
|
585
595
|
--seed-color-bg-magic-weak: #201f1f;
|
|
596
|
+
--seed-color-bg-neutral-weak: var(--seed-color-palette-gray-300);
|
|
586
597
|
--seed-color-bg-neutral-inverted: var(--seed-color-palette-gray-1000);
|
|
587
598
|
--seed-color-bg-neutral-solid: var(--seed-color-palette-gray-300);
|
|
588
|
-
--seed-color-bg-neutral-weak: var(--seed-color-palette-gray-300);
|
|
589
599
|
--seed-color-bg-neutral-inverted-pressed: var(--seed-color-palette-gray-800);
|
|
590
600
|
--seed-color-bg-neutral-solid-muted: var(--seed-color-palette-gray-400);
|
|
591
601
|
--seed-color-bg-neutral-solid-muted-pressed: var(--seed-color-palette-gray-500);
|
|
592
602
|
--seed-color-bg-neutral-weak-pressed: var(--seed-color-palette-gray-400);
|
|
593
603
|
--seed-color-bg-overlay-muted: var(--seed-color-palette-static-black-alpha-500);
|
|
594
|
-
--seed-color-bg-positive-solid: var(--seed-color-palette-green-500);
|
|
595
604
|
--seed-color-bg-positive-weak: var(--seed-color-palette-green-100);
|
|
596
|
-
--seed-color-bg-positive-solid
|
|
605
|
+
--seed-color-bg-positive-solid: var(--seed-color-palette-green-500);
|
|
606
|
+
--seed-color-bg-positive-solid-pressed: var(--seed-color-palette-green-600);
|
|
597
607
|
--seed-color-bg-positive-weak-pressed: var(--seed-color-palette-green-200);
|
|
598
|
-
--seed-color-bg-warning-solid: var(--seed-color-palette-yellow-600);
|
|
599
608
|
--seed-color-bg-warning-weak: var(--seed-color-palette-yellow-100);
|
|
609
|
+
--seed-color-bg-warning-solid: var(--seed-color-palette-yellow-600);
|
|
610
|
+
--seed-color-bg-warning-solid-pressed: var(--seed-color-palette-yellow-700);
|
|
600
611
|
--seed-color-bg-warning-weak-pressed: var(--seed-color-palette-yellow-200);
|
|
612
|
+
--seed-color-stroke-neutral: var(--seed-color-palette-static-white-alpha-100);
|
|
601
613
|
--seed-color-stroke-brand: var(--seed-color-palette-carrot-300);
|
|
602
|
-
--seed-color-stroke-
|
|
614
|
+
--seed-color-stroke-positive: var(--seed-color-palette-green-300);
|
|
615
|
+
--seed-color-stroke-informative: var(--seed-color-palette-blue-300);
|
|
616
|
+
--seed-color-stroke-warning: var(--seed-color-palette-yellow-300);
|
|
603
617
|
--seed-color-stroke-critical: var(--seed-color-palette-red-300);
|
|
604
618
|
--seed-color-stroke-field: var(--seed-color-palette-gray-400);
|
|
605
|
-
--seed-color-stroke-
|
|
606
|
-
--seed-color-stroke-neutral: var(--seed-color-palette-static-white-alpha-100);
|
|
607
|
-
--seed-color-stroke-positive: var(--seed-color-palette-green-300);
|
|
619
|
+
--seed-color-stroke-control: var(--seed-color-palette-gray-400);
|
|
608
620
|
--seed-color-stroke-field-focused: var(--seed-color-palette-gray-800);
|
|
609
621
|
--seed-color-stroke-neutral-muted: var(--seed-color-palette-static-white-alpha-50);
|
|
610
622
|
--seed-color-stroke-on-image: var(--seed-color-palette-static-white-alpha-50);
|
|
611
|
-
--seed-color-manner-temp-l1-bg: #222226;
|
|
612
623
|
--seed-color-manner-temp-l1-text: #b1b5b9;
|
|
613
|
-
--seed-color-manner-temp-l2-bg: #16212b;
|
|
614
624
|
--seed-color-manner-temp-l2-text: #7cbaf4;
|
|
615
|
-
--seed-color-manner-temp-l3-bg: #12262c;
|
|
616
625
|
--seed-color-manner-temp-l3-text: #47c3eb;
|
|
617
|
-
--seed-color-manner-temp-l4-bg: #162822;
|
|
618
626
|
--seed-color-manner-temp-l4-text: #33cc94;
|
|
619
|
-
--seed-color-manner-temp-
|
|
627
|
+
--seed-color-manner-temp-l4-bg: #162822;
|
|
620
628
|
--seed-color-manner-temp-l5-text: #ffa100;
|
|
621
|
-
--seed-color-manner-temp-l6-bg: #2e1d12;
|
|
622
629
|
--seed-color-manner-temp-l6-text: #ff9147;
|
|
630
|
+
--seed-color-manner-temp-l1-bg: #222226;
|
|
631
|
+
--seed-color-manner-temp-l2-bg: #16212b;
|
|
632
|
+
--seed-color-manner-temp-l3-bg: #12262c;
|
|
633
|
+
--seed-color-manner-temp-l5-bg: #2e2312;
|
|
634
|
+
--seed-color-manner-temp-l6-bg: #2e1d12;
|
|
623
635
|
--seed-gradient-fade-layer-floating: #1d202500 0%, #000 100%;
|
|
624
|
-
--seed-gradient-fade-layer-default: #
|
|
636
|
+
--seed-gradient-fade-layer-default: #000 0%, #16171b00 100%;
|
|
625
637
|
--seed-gradient-glow-magic: #2d252d 0%, #3a312b 80%, #333232 100%;
|
|
626
|
-
--seed-gradient-shimmer-magic: #fff9f500 0%, #fff9f51a 46%, #fff9f51a 54%, #fff9f500 100%;
|
|
627
638
|
--seed-gradient-glow-magic-pressed: #3e333e 0%, #51453e 80%, #434242 100%;
|
|
628
639
|
--seed-gradient-shimmer-neutral: #fff0 0%, #ffffff1a 46%, #ffffff1a 54%, #fff0 100%;
|
|
629
|
-
--seed-gradient-
|
|
640
|
+
--seed-gradient-shimmer-magic: #fff9f500 0%, #fff9f51a 46%, #fff9f51a 54%, #fff9f500 100%;
|
|
630
641
|
--seed-gradient-highlight-magic-pressed: #ff9e65 20%, #e89bee 100%;
|
|
642
|
+
--seed-gradient-highlight-magic: #f60 20%, #d25aca 100%;
|
|
631
643
|
}
|
|
632
644
|
|
|
633
645
|
@keyframes seed-enter {
|
package/base.min.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
:root{--seed-safe-area-top:0px;--seed-safe-area-bottom:0px}@supports (left:constant(safe-area-inset-left)){:root{--seed-safe-area-top:constant(safe-area-inset-top);--seed-safe-area-bottom:constant(safe-area-inset-bottom)}}@supports (left:env(safe-area-inset-left)){:root{--seed-safe-area-top:env(safe-area-inset-top);--seed-safe-area-bottom:env(safe-area-inset-bottom)}}:root{--seed-font-size-multiplier:1}@supports (font:-apple-system-body){html[data-seed-platform=ios][data-seed-font-scaling=enabled]{--seed-font-size-multiplier:.9412;font:-apple-system-body}}.seed-loading-indicator{display:inline-flex;position:absolute}.seed-icon,.seed-prefix-icon,.seed-suffix-icon{flex-shrink:0;justify-content:center;align-items:center;display:inline-flex}.seed-icon{width:var(--seed-icon-size);height:var(--seed-icon-size);color:var(--seed-icon-color,currentColor)}.seed-prefix-icon{width:var(--seed-prefix-icon-size);height:var(--seed-prefix-icon-size);margin-left:var(--seed-prefix-icon-margin-left);margin-right:var(--seed-prefix-icon-margin-right);margin-top:var(--seed-prefix-icon-margin-top);color:var(--seed-prefix-icon-color,currentColor)}.seed-suffix-icon{width:var(--seed-suffix-icon-size);height:var(--seed-suffix-icon-size);margin-left:var(--seed-suffix-icon-margin-left);margin-right:var(--seed-suffix-icon-margin-right);margin-top:var(--seed-suffix-icon-margin-top);margin-bottom:var(--seed-suffix-icon-margin-bottom);color:var(--seed-suffix-icon-color,currentColor)}.seed-count{font-size:var(--seed-count-font-size);line-height:var(--seed-count-line-height);font-weight:var(--seed-count-font-weight);color:var(--seed-count-color)}.seed-box{--seed-box-background:initial;--seed-box-color:initial;background:var(--seed-box-background);color:var(--seed-box-color);--seed-box-border-style:solid;--seed-box-border-color:initial;border-style:var(--seed-box-border-style);border-color:var(--seed-box-border-color);--seed-box-border-width:0;--seed-box-border-top-width:var(--seed-box-border-width);--seed-box-border-bottom-width:var(--seed-box-border-width);--seed-box-border-left-width:var(--seed-box-border-width);--seed-box-border-right-width:var(--seed-box-border-width);border-top-width:var(--seed-box-border-top-width);border-bottom-width:var(--seed-box-border-bottom-width);border-left-width:var(--seed-box-border-left-width);border-right-width:var(--seed-box-border-right-width);--seed-box-padding:0;--seed-box-padding-y:var(--seed-box-padding);--seed-box-padding-x:var(--seed-box-padding);--seed-box-padding-bottom:var(--seed-box-padding-y);--seed-box-padding-top:var(--seed-box-padding-y);--seed-box-padding-left:var(--seed-box-padding-x);--seed-box-padding-right:var(--seed-box-padding-x);padding-top:var(--seed-box-padding-top);padding-bottom:var(--seed-box-padding-bottom);padding-left:var(--seed-box-padding-left);padding-right:var(--seed-box-padding-right);--seed-box-bleed-bottom:initial;--seed-box-bleed-top:initial;--seed-box-bleed-left:initial;--seed-box-bleed-right:initial;margin-top:calc(var(--seed-box-bleed-top)*-1);margin-bottom:calc(var(--seed-box-bleed-bottom)*-1);margin-left:calc(var(--seed-box-bleed-left)*-1);margin-right:calc(var(--seed-box-bleed-right)*-1);--seed-box-min-height:initial;--seed-box-max-height:initial;--seed-box-height:initial;--seed-box-min-width:initial;--seed-box-max-width:initial;--seed-box-width:initial;min-height:var(--seed-box-min-height);max-height:var(--seed-box-max-height);height:var(--seed-box-height);min-width:var(--seed-box-min-width);max-width:var(--seed-box-max-width);width:var(--seed-box-width);--seed-box-top:initial;--seed-box-bottom:initial;--seed-box-left:initial;--seed-box-right:initial;top:var(--seed-box-top);bottom:var(--seed-box-bottom);left:var(--seed-box-left);right:var(--seed-box-right);--seed-box-border-radius:initial;--seed-box-border-bottom-left-radius:var(--seed-box-border-radius);--seed-box-border-bottom-right-radius:var(--seed-box-border-radius);--seed-box-border-top-left-radius:var(--seed-box-border-radius);--seed-box-border-top-right-radius:var(--seed-box-border-radius);border-bottom-left-radius:var(--seed-box-border-bottom-left-radius);border-bottom-right-radius:var(--seed-box-border-bottom-right-radius);border-top-left-radius:var(--seed-box-border-top-left-radius);border-top-right-radius:var(--seed-box-border-top-right-radius);--seed-box-display:block;--seed-box-position:initial;display:var(--seed-box-display);position:var(--seed-box-position);--seed-box-unstable-transform:initial;transform:var(--seed-box-unstable-transform);--seed-box-z-index:initial;z-index:var(--seed-box-z-index);--seed-box-overflow-x:initial;--seed-box-overflow-y:initial;overflow-x:var(--seed-box-overflow-x);overflow-y:var(--seed-box-overflow-y);--seed-box-flex-grow:initial;--seed-box-flex-shrink:initial;flex-grow:var(--seed-box-flex-grow);flex-shrink:var(--seed-box-flex-shrink);--seed-box-flex-direction:initial;--seed-box-flex-wrap:initial;--seed-box-justify-content:initial;--seed-box-align-items:stretch;--seed-box-align-content:stretch;--seed-box-align-self:auto;--seed-box-gap:initial;flex-direction:var(--seed-box-flex-direction);flex-wrap:var(--seed-box-flex-wrap);justify-content:var(--seed-box-justify-content);align-items:var(--seed-box-align-items);align-content:var(--seed-box-align-content);align-self:var(--seed-box-align-self);gap:var(--seed-box-gap)}.seed-box:is(:active,[data-active]){--seed-box-background--active:var(--seed-box-background);background:var(--seed-box-background--active)}.seed-consistent-width:before{content:attr(data-text);visibility:hidden;height:0;font-weight:var(--seed-font-weight-regular);display:block}.seed-consistent-width:after{content:attr(data-text);visibility:hidden;height:0;font-weight:var(--seed-font-weight-bold);display:block}:root,[data-seed-color-mode=system]{color-scheme:light dark}[data-seed-color-mode=light-only]{color-scheme:light}[data-seed-color-mode=dark-only]{color-scheme:dark}:root{--seed-dimension-x0_5:2px;--seed-dimension-x1:4px;--seed-dimension-x1_5:6px;--seed-dimension-x2:8px;--seed-dimension-x2_5:10px;--seed-dimension-x3:12px;--seed-dimension-x3_5:14px;--seed-dimension-x4:16px;--seed-dimension-x4_5:18px;--seed-dimension-x5:20px;--seed-dimension-x6:24px;--seed-dimension-x7:28px;--seed-dimension-x8:32px;--seed-dimension-x9:36px;--seed-dimension-x10:40px;--seed-dimension-x12:48px;--seed-dimension-x13:52px;--seed-dimension-x14:56px;--seed-dimension-x16:64px;--seed-dimension-spacing-x-between-chips:var(--seed-dimension-x2);--seed-dimension-spacing-x-global-gutter:var(--seed-dimension-x4);--seed-dimension-spacing-y-component-default:var(--seed-dimension-x3);--seed-dimension-spacing-y-nav-to-title:var(--seed-dimension-x5);--seed-dimension-spacing-y-screen-bottom:var(--seed-dimension-x14);--seed-dimension-spacing-y-between-text:var(--seed-dimension-x1_5);--seed-duration-d1:50ms;--seed-duration-d2:.1s;--seed-duration-d3:.15s;--seed-duration-d4:.2s;--seed-duration-d5:.25s;--seed-duration-d6:.3s;--seed-font-size-t1:clamp(8.8px,calc(.6875rem*var(--seed-font-size-multiplier)),13.98px);--seed-font-size-t2:clamp(9.6px,calc(.75rem*var(--seed-font-size-multiplier)),15.25px);--seed-font-size-t3:clamp(10.4px,calc(.8125rem*var(--seed-font-size-multiplier)),16.52px);--seed-font-size-t4:clamp(11.2px,calc(.875rem*var(--seed-font-size-multiplier)),17.79px);--seed-font-size-t5:clamp(12.8px,calc(1rem*var(--seed-font-size-multiplier)),20.33px);--seed-font-size-t6:clamp(14.4px,calc(1.125rem*var(--seed-font-size-multiplier)),22.87px);--seed-font-size-t7:clamp(16px,calc(1.25rem*var(--seed-font-size-multiplier)),25.41px);--seed-font-size-t8:clamp(17.6px,calc(1.375rem*var(--seed-font-size-multiplier)),27.95px);--seed-font-size-t9:clamp(19.2px,calc(1.5rem*var(--seed-font-size-multiplier)),30.49px);--seed-font-size-t10:clamp(20.8px,calc(1.625rem*var(--seed-font-size-multiplier)),33.04px);--seed-font-size-t2-static:12px;--seed-font-size-t5-static:16px;--seed-font-size-t6-static:18px;--seed-font-weight-regular:400;--seed-font-weight-medium:500;--seed-font-weight-bold:700;--seed-line-height-t1:clamp(12px,calc(.9375rem*var(--seed-font-size-multiplier)),19.06px);--seed-line-height-t2:clamp(12.8px,calc(1rem*var(--seed-font-size-multiplier)),20.33px);--seed-line-height-t3:clamp(14.4px,calc(1.125rem*var(--seed-font-size-multiplier)),22.87px);--seed-line-height-t4:clamp(15.2px,calc(1.1875rem*var(--seed-font-size-multiplier)),24.14px);--seed-line-height-t5:clamp(17.6px,calc(1.375rem*var(--seed-font-size-multiplier)),27.95px);--seed-line-height-t6:clamp(19.2px,calc(1.5rem*var(--seed-font-size-multiplier)),30.49px);--seed-line-height-t7:clamp(21.6px,calc(1.6875rem*var(--seed-font-size-multiplier)),34.31px);--seed-line-height-t8:clamp(24px,calc(1.875rem*var(--seed-font-size-multiplier)),38.12px);--seed-line-height-t9:clamp(25.6px,calc(2rem*var(--seed-font-size-multiplier)),40.66px);--seed-line-height-t10:clamp(28px,calc(2.1875rem*var(--seed-font-size-multiplier)),44.47px);--seed-radius-r0_5:2px;--seed-radius-r1:4px;--seed-radius-r1_5:6px;--seed-radius-r2:8px;--seed-radius-r2_5:10px;--seed-radius-r3:12px;--seed-radius-r3_5:14px;--seed-radius-r4:16px;--seed-radius-r5:20px;--seed-radius-r6:24px;--seed-radius-full:9999px;--seed-timing-function-linear:cubic-bezier(0,0,1,1);--seed-timing-function-easing:cubic-bezier(.35,0,.35,1);--seed-timing-function-enter:cubic-bezier(0,0,.15,1);--seed-timing-function-exit:cubic-bezier(.35,0,1,1);--seed-timing-function-enter-expressive:cubic-bezier(.03,.4,.1,1);--seed-timing-function-exit-expressive:cubic-bezier(.35,0,.95,.55)}:root,:root[data-seed-color-mode=system][data-seed-user-color-scheme=light],:root[data-seed-color-mode=light-only],:root [data-seed-color-mode=light-only]{--seed-color-palette-blue-100:#eff6ff;--seed-color-palette-blue-200:#e2edfc;--seed-color-palette-blue-300:#cbdffa;--seed-color-palette-blue-400:#aacefd;--seed-color-palette-blue-500:#85b8fd;--seed-color-palette-blue-600:#5e98fe;--seed-color-palette-blue-700:#217cf9;--seed-color-palette-blue-800:#135fcd;--seed-color-palette-blue-900:#0b4596;--seed-color-palette-blue-1000:#032451;--seed-color-palette-carrot-100:#fff2ec;--seed-color-palette-carrot-200:#ffe8db;--seed-color-palette-carrot-300:#ffd5c0;--seed-color-palette-carrot-400:#ffb999;--seed-color-palette-carrot-500:#ff9364;--seed-color-palette-carrot-600:#f60;--seed-color-palette-carrot-700:#e14d00;--seed-color-palette-carrot-800:#b93901;--seed-color-palette-carrot-900:#862b00;--seed-color-palette-carrot-1000:#471601;--seed-color-palette-gray-00:#fff;--seed-color-palette-gray-100:#f7f8f9;--seed-color-palette-gray-200:#f3f4f5;--seed-color-palette-gray-300:#eeeff1;--seed-color-palette-gray-400:#dcdee3;--seed-color-palette-gray-500:#d1d3d8;--seed-color-palette-gray-600:#b0b3ba;--seed-color-palette-gray-700:#868b94;--seed-color-palette-gray-800:#555d6d;--seed-color-palette-gray-900:#2a3038;--seed-color-palette-gray-1000:#1a1c20;--seed-color-palette-green-100:#edfaf6;--seed-color-palette-green-200:#d9f6e9;--seed-color-palette-green-300:#b9e9d2;--seed-color-palette-green-400:#7ddcb3;--seed-color-palette-green-500:#42c593;--seed-color-palette-green-600:#10ab7d;--seed-color-palette-green-700:#079171;--seed-color-palette-green-800:#00745f;--seed-color-palette-green-900:#075445;--seed-color-palette-green-1000:#0a2b24;--seed-color-palette-purple-100:#f5f3fe;--seed-color-palette-purple-200:#efeafe;--seed-color-palette-purple-300:#e1d8ff;--seed-color-palette-purple-400:#d0c0ff;--seed-color-palette-purple-500:#b8a1ff;--seed-color-palette-purple-600:#9f84fb;--seed-color-palette-purple-700:#8969ea;--seed-color-palette-purple-800:#6d50cb;--seed-color-palette-purple-900:#50379b;--seed-color-palette-purple-1000:#29175d;--seed-color-palette-red-100:#fdf0f0;--seed-color-palette-red-200:#fde7e7;--seed-color-palette-red-300:#fed4d2;--seed-color-palette-red-400:#feb7b3;--seed-color-palette-red-500:#fe928d;--seed-color-palette-red-600:#fc6a66;--seed-color-palette-red-700:#fa342c;--seed-color-palette-red-800:#ca1d13;--seed-color-palette-red-900:#921708;--seed-color-palette-red-1000:#4a1209;--seed-color-palette-static-black:#000;--seed-color-palette-static-white:#fff;--seed-color-palette-static-black-alpha-100:#00000007;--seed-color-palette-static-black-alpha-200:#0000000c;--seed-color-palette-static-black-alpha-300:#00000010;--seed-color-palette-static-black-alpha-400:#00000021;--seed-color-palette-static-black-alpha-500:#0000002c;--seed-color-palette-static-black-alpha-600:#0000004c;--seed-color-palette-static-black-alpha-700:#00000074;--seed-color-palette-static-black-alpha-800:#000000a2;--seed-color-palette-static-black-alpha-900:#000000d0;--seed-color-palette-static-black-alpha-1000:#000000e3;--seed-color-palette-static-white-alpha-50:#ffffff0d;--seed-color-palette-static-white-alpha-100:#ffffff17;--seed-color-palette-static-white-alpha-200:#ffffff20;--seed-color-palette-static-white-alpha-300:#ffffff2e;--seed-color-palette-static-white-alpha-400:#ffffff3d;--seed-color-palette-static-white-alpha-500:#ffffff60;--seed-color-palette-static-white-alpha-600:#ffffff8b;--seed-color-palette-static-white-alpha-700:#ffffffb3;--seed-color-palette-static-white-alpha-800:#ffffffde;--seed-color-palette-static-white-alpha-900:#ffffffea;--seed-color-palette-static-white-alpha-1000:#fffffff4;--seed-color-palette-yellow-100:#fff7de;--seed-color-palette-yellow-200:#fdefb9;--seed-color-palette-yellow-300:#fbdc65;--seed-color-palette-yellow-400:#e9c647;--seed-color-palette-yellow-500:#d4ab28;--seed-color-palette-yellow-600:#c49725;--seed-color-palette-yellow-700:#9b7821;--seed-color-palette-yellow-800:#755b22;--seed-color-palette-yellow-900:#4f3e1f;--seed-color-palette-yellow-1000:#2c2512;--seed-color-fg-brand:var(--seed-color-palette-carrot-600);--seed-color-fg-critical:var(--seed-color-palette-red-700);--seed-color-fg-disabled:var(--seed-color-palette-gray-500);--seed-color-fg-informative:var(--seed-color-palette-blue-700);--seed-color-fg-neutral:var(--seed-color-palette-gray-1000);--seed-color-fg-placeholder:var(--seed-color-palette-gray-600);--seed-color-fg-positive:var(--seed-color-palette-green-700);--seed-color-fg-critical-contrast:var(--seed-color-palette-red-900);--seed-color-fg-informative-contrast:var(--seed-color-palette-blue-900);--seed-color-fg-neutral-inverted:var(--seed-color-palette-gray-00);--seed-color-fg-neutral-muted:var(--seed-color-palette-gray-800);--seed-color-fg-neutral-subtle:var(--seed-color-palette-gray-700);--seed-color-fg-positive-contrast:var(--seed-color-palette-green-900);--seed-color-fg-warning-contrast:var(--seed-color-palette-yellow-900);--seed-color-bg-disabled:var(--seed-color-palette-gray-200);--seed-color-bg-overlay:var(--seed-color-palette-static-black-alpha-700);--seed-color-bg-brand-solid:var(--seed-color-palette-carrot-600);--seed-color-bg-brand-solid-pressed:var(--seed-color-palette-carrot-700);--seed-color-bg-critical-solid:var(--seed-color-palette-red-700);--seed-color-bg-critical-weak:var(--seed-color-palette-red-100);--seed-color-bg-critical-solid-pressed:var(--seed-color-palette-red-800);--seed-color-bg-critical-weak-pressed:var(--seed-color-palette-red-200);--seed-color-bg-informative-solid:var(--seed-color-palette-blue-700);--seed-color-bg-informative-weak:var(--seed-color-palette-blue-100);--seed-color-bg-informative-solid-pressed:var(--seed-color-palette-blue-800);--seed-color-bg-informative-weak-pressed:var(--seed-color-palette-blue-200);--seed-color-bg-layer-basement:var(--seed-color-palette-gray-200);--seed-color-bg-layer-default:var(--seed-color-palette-gray-00);--seed-color-bg-layer-fill:var(--seed-color-palette-gray-100);--seed-color-bg-layer-floating:var(--seed-color-palette-gray-00);--seed-color-bg-layer-default-pressed:var(--seed-color-palette-gray-100);--seed-color-bg-layer-floating-pressed:var(--seed-color-palette-gray-100);--seed-color-bg-magic-weak:#f9f2ee;--seed-color-bg-neutral-inverted:var(--seed-color-palette-gray-900);--seed-color-bg-neutral-solid:var(--seed-color-palette-gray-1000);--seed-color-bg-neutral-weak:var(--seed-color-palette-gray-200);--seed-color-bg-neutral-inverted-pressed:var(--seed-color-palette-gray-800);--seed-color-bg-neutral-solid-muted:var(--seed-color-palette-gray-800);--seed-color-bg-neutral-solid-muted-pressed:var(--seed-color-palette-gray-900);--seed-color-bg-neutral-weak-pressed:var(--seed-color-palette-gray-300);--seed-color-bg-overlay-muted:var(--seed-color-palette-static-black-alpha-500);--seed-color-bg-positive-solid:var(--seed-color-palette-green-700);--seed-color-bg-positive-weak:var(--seed-color-palette-green-100);--seed-color-bg-positive-solid-pressed:var(--seed-color-palette-green-800);--seed-color-bg-positive-weak-pressed:var(--seed-color-palette-green-200);--seed-color-bg-warning-solid:var(--seed-color-palette-yellow-300);--seed-color-bg-warning-weak:var(--seed-color-palette-yellow-100);--seed-color-bg-warning-weak-pressed:var(--seed-color-palette-yellow-200);--seed-color-stroke-brand:var(--seed-color-palette-carrot-300);--seed-color-stroke-control:var(--seed-color-palette-gray-400);--seed-color-stroke-critical:var(--seed-color-palette-red-300);--seed-color-stroke-field:var(--seed-color-palette-gray-400);--seed-color-stroke-informative:var(--seed-color-palette-blue-300);--seed-color-stroke-neutral:var(--seed-color-palette-static-black-alpha-300);--seed-color-stroke-positive:var(--seed-color-palette-green-300);--seed-color-stroke-field-focused:var(--seed-color-palette-gray-800);--seed-color-stroke-neutral-muted:var(--seed-color-palette-static-black-alpha-200);--seed-color-stroke-on-image:var(--seed-color-palette-static-black-alpha-200);--seed-color-manner-temp-l1-bg:#eff0f1;--seed-color-manner-temp-l1-text:#62666a;--seed-color-manner-temp-l2-bg:#e7f2fc;--seed-color-manner-temp-l2-text:#2592f7;--seed-color-manner-temp-l3-bg:#e3f6fc;--seed-color-manner-temp-l3-text:#0099c8;--seed-color-manner-temp-l4-bg:#ebf9f4;--seed-color-manner-temp-l4-text:#03a07e;--seed-color-manner-temp-l5-bg:#fff5e5;--seed-color-manner-temp-l5-text:#d28500;--seed-color-manner-temp-l6-bg:#fff0e5;--seed-color-manner-temp-l6-text:#f06000;--seed-gradient-fade-layer-floating:#fff0 0%,#000 100%;--seed-gradient-fade-layer-default:#fff0 0%,#000 100%;--seed-gradient-glow-magic:#fef6f7 0%,#fef0e7 80%,#f9f7f5 100%;--seed-gradient-shimmer-magic:#fff9f500 0%,#fff9f58a 46%,#fff9f58a 54%,#fff9f500 100%;--seed-gradient-glow-magic-pressed:#fbf0f2 0%,#ffe8db 80%,#f5f2ef 100%;--seed-gradient-shimmer-neutral:#fff0 0%,#fff6 46%,#fff6 54%,#fff0 100%;--seed-gradient-highlight-magic:#f60 20%,#d25aca 100%;--seed-gradient-highlight-magic-pressed:#e14f00 20%,#ae58bf 100%}:root[data-seed-color-mode=system][data-seed-user-color-scheme=dark],:root[data-seed-color-mode=dark-only],:root [data-seed-color-mode=dark-only]{--seed-color-palette-blue-100:#202742;--seed-color-palette-blue-200:#1e3352;--seed-color-palette-blue-300:#1a4275;--seed-color-palette-blue-400:#0f559e;--seed-color-palette-blue-500:#1964d8;--seed-color-palette-blue-600:#1e82eb;--seed-color-palette-blue-700:#41a2f9;--seed-color-palette-blue-800:#83bcf9;--seed-color-palette-blue-900:#b9d7fb;--seed-color-palette-blue-1000:#e5f0fe;--seed-color-palette-carrot-100:#31241f;--seed-color-palette-carrot-200:#4b291c;--seed-color-palette-carrot-300:#6b311c;--seed-color-palette-carrot-400:#923600;--seed-color-palette-carrot-500:#bd4201;--seed-color-palette-carrot-600:#e65200;--seed-color-palette-carrot-700:#f60;--seed-color-palette-carrot-800:#ff9e65;--seed-color-palette-carrot-900:#eecebc;--seed-color-palette-carrot-1000:#f4eeea;--seed-color-palette-gray-00:#000;--seed-color-palette-gray-100:#16171b;--seed-color-palette-gray-200:#1d2025;--seed-color-palette-gray-300:#2b2e35;--seed-color-palette-gray-400:#393d46;--seed-color-palette-gray-500:#5b606a;--seed-color-palette-gray-600:#868b94;--seed-color-palette-gray-700:#b0b3ba;--seed-color-palette-gray-800:#dcdee3;--seed-color-palette-gray-900:#e9eaec;--seed-color-palette-gray-1000:#f3f4f5;--seed-color-palette-green-100:#202926;--seed-color-palette-green-200:#20362e;--seed-color-palette-green-300:#20493b;--seed-color-palette-green-400:#19604c;--seed-color-palette-green-500:#117956;--seed-color-palette-green-600:#1b946d;--seed-color-palette-green-700:#22b27f;--seed-color-palette-green-800:#35ce9a;--seed-color-palette-green-900:#93e5c0;--seed-color-palette-green-1000:#d4f6ef;--seed-color-palette-purple-100:#28213b;--seed-color-palette-purple-200:#3b2873;--seed-color-palette-purple-300:#443081;--seed-color-palette-purple-400:#5a3bb1;--seed-color-palette-purple-500:#764fd9;--seed-color-palette-purple-600:#8e6bee;--seed-color-palette-purple-700:#a78df0;--seed-color-palette-purple-800:#beadf2;--seed-color-palette-purple-900:#d9cefa;--seed-color-palette-purple-1000:#f0edfc;--seed-color-palette-red-100:#322323;--seed-color-palette-red-200:#4f2624;--seed-color-palette-red-300:#742826;--seed-color-palette-red-400:#a12621;--seed-color-palette-red-500:#ca2319;--seed-color-palette-red-600:#f73526;--seed-color-palette-red-700:#ff6e60;--seed-color-palette-red-800:#ffa299;--seed-color-palette-red-900:#f8c5c3;--seed-color-palette-red-1000:#fdf2f2;--seed-color-palette-static-black:#000;--seed-color-palette-static-white:#fff;--seed-color-palette-static-black-alpha-100:#00000007;--seed-color-palette-static-black-alpha-200:#0000000c;--seed-color-palette-static-black-alpha-300:#00000010;--seed-color-palette-static-black-alpha-400:#00000021;--seed-color-palette-static-black-alpha-500:#0000002c;--seed-color-palette-static-black-alpha-600:#0000004c;--seed-color-palette-static-black-alpha-700:#00000074;--seed-color-palette-static-black-alpha-800:#000000a2;--seed-color-palette-static-black-alpha-900:#000000d0;--seed-color-palette-static-black-alpha-1000:#000000e3;--seed-color-palette-static-white-alpha-50:#ffffff0d;--seed-color-palette-static-white-alpha-100:#ffffff17;--seed-color-palette-static-white-alpha-200:#ffffff20;--seed-color-palette-static-white-alpha-300:#ffffff2e;--seed-color-palette-static-white-alpha-400:#ffffff3d;--seed-color-palette-static-white-alpha-500:#ffffff60;--seed-color-palette-static-white-alpha-600:#ffffff8b;--seed-color-palette-static-white-alpha-700:#ffffffb3;--seed-color-palette-static-white-alpha-800:#ffffffde;--seed-color-palette-static-white-alpha-900:#ffffffea;--seed-color-palette-static-white-alpha-1000:#fffffff4;--seed-color-palette-yellow-100:#302819;--seed-color-palette-yellow-200:#413218;--seed-color-palette-yellow-300:#543e15;--seed-color-palette-yellow-400:#714e15;--seed-color-palette-yellow-500:#91601b;--seed-color-palette-yellow-600:#b6720d;--seed-color-palette-yellow-700:#ca901c;--seed-color-palette-yellow-800:#dab156;--seed-color-palette-yellow-900:#e5d49b;--seed-color-palette-yellow-1000:#f7f0cd;--seed-color-fg-brand:var(--seed-color-palette-carrot-700);--seed-color-fg-critical:var(--seed-color-palette-red-700);--seed-color-fg-disabled:var(--seed-color-palette-gray-500);--seed-color-fg-informative:var(--seed-color-palette-blue-700);--seed-color-fg-neutral:var(--seed-color-palette-gray-1000);--seed-color-fg-placeholder:var(--seed-color-palette-gray-600);--seed-color-fg-positive:var(--seed-color-palette-green-700);--seed-color-fg-critical-contrast:var(--seed-color-palette-red-900);--seed-color-fg-informative-contrast:var(--seed-color-palette-blue-900);--seed-color-fg-neutral-inverted:var(--seed-color-palette-gray-100);--seed-color-fg-neutral-muted:var(--seed-color-palette-gray-800);--seed-color-fg-neutral-subtle:var(--seed-color-palette-gray-700);--seed-color-fg-positive-contrast:var(--seed-color-palette-green-900);--seed-color-fg-warning-contrast:var(--seed-color-palette-yellow-900);--seed-color-bg-disabled:var(--seed-color-palette-gray-300);--seed-color-bg-overlay:var(--seed-color-palette-static-black-alpha-700);--seed-color-bg-brand-solid:var(--seed-color-palette-carrot-700);--seed-color-bg-brand-solid-pressed:var(--seed-color-palette-carrot-800);--seed-color-bg-critical-solid:var(--seed-color-palette-red-600);--seed-color-bg-critical-weak:var(--seed-color-palette-red-100);--seed-color-bg-critical-solid-pressed:var(--seed-color-palette-red-700);--seed-color-bg-critical-weak-pressed:var(--seed-color-palette-red-200);--seed-color-bg-informative-solid:var(--seed-color-palette-blue-600);--seed-color-bg-informative-weak:var(--seed-color-palette-blue-100);--seed-color-bg-informative-solid-pressed:var(--seed-color-palette-blue-700);--seed-color-bg-informative-weak-pressed:var(--seed-color-palette-blue-200);--seed-color-bg-layer-basement:var(--seed-color-palette-gray-00);--seed-color-bg-layer-default:var(--seed-color-palette-gray-100);--seed-color-bg-layer-fill:var(--seed-color-palette-gray-200);--seed-color-bg-layer-floating:var(--seed-color-palette-gray-200);--seed-color-bg-layer-default-pressed:var(--seed-color-palette-gray-300);--seed-color-bg-layer-floating-pressed:var(--seed-color-palette-gray-300);--seed-color-bg-magic-weak:#201f1f;--seed-color-bg-neutral-inverted:var(--seed-color-palette-gray-1000);--seed-color-bg-neutral-solid:var(--seed-color-palette-gray-300);--seed-color-bg-neutral-weak:var(--seed-color-palette-gray-300);--seed-color-bg-neutral-inverted-pressed:var(--seed-color-palette-gray-800);--seed-color-bg-neutral-solid-muted:var(--seed-color-palette-gray-400);--seed-color-bg-neutral-solid-muted-pressed:var(--seed-color-palette-gray-500);--seed-color-bg-neutral-weak-pressed:var(--seed-color-palette-gray-400);--seed-color-bg-overlay-muted:var(--seed-color-palette-static-black-alpha-500);--seed-color-bg-positive-solid:var(--seed-color-palette-green-500);--seed-color-bg-positive-weak:var(--seed-color-palette-green-100);--seed-color-bg-positive-solid-pressed:var(--seed-color-palette-green-500);--seed-color-bg-positive-weak-pressed:var(--seed-color-palette-green-200);--seed-color-bg-warning-solid:var(--seed-color-palette-yellow-600);--seed-color-bg-warning-weak:var(--seed-color-palette-yellow-100);--seed-color-bg-warning-weak-pressed:var(--seed-color-palette-yellow-200);--seed-color-stroke-brand:var(--seed-color-palette-carrot-300);--seed-color-stroke-control:var(--seed-color-palette-gray-400);--seed-color-stroke-critical:var(--seed-color-palette-red-300);--seed-color-stroke-field:var(--seed-color-palette-gray-400);--seed-color-stroke-informative:var(--seed-color-palette-blue-300);--seed-color-stroke-neutral:var(--seed-color-palette-static-white-alpha-100);--seed-color-stroke-positive:var(--seed-color-palette-green-300);--seed-color-stroke-field-focused:var(--seed-color-palette-gray-800);--seed-color-stroke-neutral-muted:var(--seed-color-palette-static-white-alpha-50);--seed-color-stroke-on-image:var(--seed-color-palette-static-white-alpha-50);--seed-color-manner-temp-l1-bg:#222226;--seed-color-manner-temp-l1-text:#b1b5b9;--seed-color-manner-temp-l2-bg:#16212b;--seed-color-manner-temp-l2-text:#7cbaf4;--seed-color-manner-temp-l3-bg:#12262c;--seed-color-manner-temp-l3-text:#47c3eb;--seed-color-manner-temp-l4-bg:#162822;--seed-color-manner-temp-l4-text:#33cc94;--seed-color-manner-temp-l5-bg:#2e2312;--seed-color-manner-temp-l5-text:#ffa100;--seed-color-manner-temp-l6-bg:#2e1d12;--seed-color-manner-temp-l6-text:#ff9147;--seed-gradient-fade-layer-floating:#1d202500 0%,#000 100%;--seed-gradient-fade-layer-default:#16171b00 0%,#000 100%;--seed-gradient-glow-magic:#2d252d 0%,#3a312b 80%,#333232 100%;--seed-gradient-shimmer-magic:#fff9f500 0%,#fff9f51a 46%,#fff9f51a 54%,#fff9f500 100%;--seed-gradient-glow-magic-pressed:#3e333e 0%,#51453e 80%,#434242 100%;--seed-gradient-shimmer-neutral:#fff0 0%,#ffffff1a 46%,#ffffff1a 54%,#fff0 100%;--seed-gradient-highlight-magic:#f60 20%,#d25aca 100%;--seed-gradient-highlight-magic-pressed:#ff9e65 20%,#e89bee 100%}@keyframes seed-enter{0%{opacity:var(--seed-enter-opacity,1);transform:translate3d(var(--seed-enter-translate-x,0),var(--seed-enter-translate-y,0),0)scale3d(var(--seed-enter-scale,1),var(--seed-enter-scale,1),var(--seed-enter-scale,1))rotate(var(--seed-enter-rotate,0))}}@keyframes seed-exit{to{opacity:var(--seed-exit-opacity,1);transform:translate3d(var(--seed-exit-translate-x,0),var(--seed-exit-translate-y,0),0)scale3d(var(--seed-exit-scale,1),var(--seed-exit-scale,1),var(--seed-exit-scale,1))rotate(var(--seed-exit-rotate,0))}}@keyframes rotate{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes slide-x{0%{transform:translate(-100%)}to{transform:translate(100%)}}@keyframes progress-circle-head{0%{stroke-dasharray:0 1000%}75%{stroke-dasharray:var(--circumference),1000%}to{stroke-dasharray:var(--circumference),1000%}}@keyframes progress-circle-tail{0%{stroke-dashoffset:0}33.33%{stroke-dashoffset:0}to{stroke-dashoffset:calc(var(--circumference)*-1)}}
|
|
1
|
+
:root{--seed-safe-area-top:0px;--seed-safe-area-bottom:0px}@supports (left:constant(safe-area-inset-left)){:root{--seed-safe-area-top:constant(safe-area-inset-top);--seed-safe-area-bottom:constant(safe-area-inset-bottom)}}@supports (left:env(safe-area-inset-left)){:root{--seed-safe-area-top:env(safe-area-inset-top);--seed-safe-area-bottom:env(safe-area-inset-bottom)}}:root{--seed-font-size-multiplier:1}@supports (font:-apple-system-body){html[data-seed-platform=ios][data-seed-font-scaling=enabled]{--seed-font-size-multiplier:.9412;font:-apple-system-body}}.seed-loading-indicator{display:inline-flex;position:absolute}.seed-icon,.seed-prefix-icon,.seed-suffix-icon{flex-shrink:0;justify-content:center;align-items:center;display:inline-flex}.seed-icon{width:var(--seed-icon-size);height:var(--seed-icon-size);color:var(--seed-icon-color,currentColor)}.seed-prefix-icon{width:var(--seed-prefix-icon-size);height:var(--seed-prefix-icon-size);margin-left:var(--seed-prefix-icon-margin-left);margin-right:var(--seed-prefix-icon-margin-right);margin-top:var(--seed-prefix-icon-margin-top);color:var(--seed-prefix-icon-color,currentColor)}.seed-suffix-icon{width:var(--seed-suffix-icon-size);height:var(--seed-suffix-icon-size);margin-left:var(--seed-suffix-icon-margin-left);margin-right:var(--seed-suffix-icon-margin-right);margin-top:var(--seed-suffix-icon-margin-top);margin-bottom:var(--seed-suffix-icon-margin-bottom);color:var(--seed-suffix-icon-color,currentColor)}.seed-count{font-size:var(--seed-count-font-size);line-height:var(--seed-count-line-height);font-weight:var(--seed-count-font-weight);color:var(--seed-count-color)}.seed-box{--seed-box-background:initial;--seed-box-color:initial;background:var(--seed-box-background);color:var(--seed-box-color);--seed-box-border-style:solid;--seed-box-border-color:initial;border-style:var(--seed-box-border-style);border-color:var(--seed-box-border-color);--seed-box-border-width:0;--seed-box-border-top-width:var(--seed-box-border-width);--seed-box-border-bottom-width:var(--seed-box-border-width);--seed-box-border-left-width:var(--seed-box-border-width);--seed-box-border-right-width:var(--seed-box-border-width);border-top-width:var(--seed-box-border-top-width);border-bottom-width:var(--seed-box-border-bottom-width);border-left-width:var(--seed-box-border-left-width);border-right-width:var(--seed-box-border-right-width);--seed-box-padding:0;--seed-box-padding-y:var(--seed-box-padding);--seed-box-padding-x:var(--seed-box-padding);--seed-box-padding-bottom:var(--seed-box-padding-y);--seed-box-padding-top:var(--seed-box-padding-y);--seed-box-padding-left:var(--seed-box-padding-x);--seed-box-padding-right:var(--seed-box-padding-x);padding-top:var(--seed-box-padding-top);padding-bottom:var(--seed-box-padding-bottom);padding-left:var(--seed-box-padding-left);padding-right:var(--seed-box-padding-right);--seed-box-bleed-bottom:initial;--seed-box-bleed-top:initial;--seed-box-bleed-left:initial;--seed-box-bleed-right:initial;margin-top:calc(var(--seed-box-bleed-top)*-1);margin-bottom:calc(var(--seed-box-bleed-bottom)*-1);margin-left:calc(var(--seed-box-bleed-left)*-1);margin-right:calc(var(--seed-box-bleed-right)*-1);--seed-box-min-height:initial;--seed-box-max-height:initial;--seed-box-height:initial;--seed-box-min-width:initial;--seed-box-max-width:initial;--seed-box-width:initial;min-height:var(--seed-box-min-height);max-height:var(--seed-box-max-height);height:var(--seed-box-height);min-width:var(--seed-box-min-width);max-width:var(--seed-box-max-width);width:var(--seed-box-width);--seed-box-top:initial;--seed-box-bottom:initial;--seed-box-left:initial;--seed-box-right:initial;top:var(--seed-box-top);bottom:var(--seed-box-bottom);left:var(--seed-box-left);right:var(--seed-box-right);--seed-box-border-radius:initial;--seed-box-border-bottom-left-radius:var(--seed-box-border-radius);--seed-box-border-bottom-right-radius:var(--seed-box-border-radius);--seed-box-border-top-left-radius:var(--seed-box-border-radius);--seed-box-border-top-right-radius:var(--seed-box-border-radius);border-bottom-left-radius:var(--seed-box-border-bottom-left-radius);border-bottom-right-radius:var(--seed-box-border-bottom-right-radius);border-top-left-radius:var(--seed-box-border-top-left-radius);border-top-right-radius:var(--seed-box-border-top-right-radius);--seed-box-display:block;--seed-box-position:initial;display:var(--seed-box-display);position:var(--seed-box-position);--seed-box-unstable-transform:initial;transform:var(--seed-box-unstable-transform);--seed-box-z-index:initial;z-index:var(--seed-box-z-index);--seed-box-overflow-x:initial;--seed-box-overflow-y:initial;overflow-x:var(--seed-box-overflow-x);overflow-y:var(--seed-box-overflow-y);--seed-box-flex-grow:initial;--seed-box-flex-shrink:initial;flex-grow:var(--seed-box-flex-grow);flex-shrink:var(--seed-box-flex-shrink);--seed-box-flex-direction:initial;--seed-box-flex-wrap:initial;--seed-box-justify-content:initial;--seed-box-align-items:stretch;--seed-box-align-content:stretch;--seed-box-align-self:auto;--seed-box-gap:initial;flex-direction:var(--seed-box-flex-direction);flex-wrap:var(--seed-box-flex-wrap);justify-content:var(--seed-box-justify-content);align-items:var(--seed-box-align-items);align-content:var(--seed-box-align-content);align-self:var(--seed-box-align-self);gap:var(--seed-box-gap)}.seed-box:is(:active,[data-active]){--seed-box-background--active:var(--seed-box-background);background:var(--seed-box-background--active)}.seed-consistent-width:before{content:attr(data-text);visibility:hidden;height:0;font-weight:var(--seed-font-weight-regular);display:block}.seed-consistent-width:after{content:attr(data-text);visibility:hidden;height:0;font-weight:var(--seed-font-weight-bold);display:block}:root,[data-seed-color-mode=system]{color-scheme:light dark}[data-seed-color-mode=light-only]{color-scheme:light}[data-seed-color-mode=dark-only]{color-scheme:dark}:root{--seed-dimension-x0_5:2px;--seed-dimension-x1:4px;--seed-dimension-x1_5:6px;--seed-dimension-x2:8px;--seed-dimension-x2_5:10px;--seed-dimension-x3:12px;--seed-dimension-x3_5:14px;--seed-dimension-x4:16px;--seed-dimension-x4_5:18px;--seed-dimension-x5:20px;--seed-dimension-x6:24px;--seed-dimension-x7:28px;--seed-dimension-x8:32px;--seed-dimension-x9:36px;--seed-dimension-x10:40px;--seed-dimension-x12:48px;--seed-dimension-x13:52px;--seed-dimension-x14:56px;--seed-dimension-x16:64px;--seed-dimension-spacing-x-between-chips:var(--seed-dimension-x2);--seed-dimension-spacing-x-global-gutter:var(--seed-dimension-x4);--seed-dimension-spacing-y-component-default:var(--seed-dimension-x3);--seed-dimension-spacing-y-nav-to-title:var(--seed-dimension-x5);--seed-dimension-spacing-y-screen-bottom:var(--seed-dimension-x14);--seed-dimension-spacing-y-between-text:var(--seed-dimension-x1_5);--seed-duration-d1:50ms;--seed-duration-d2:.1s;--seed-duration-d3:.15s;--seed-duration-d4:.2s;--seed-duration-d5:.25s;--seed-duration-d6:.3s;--seed-font-size-t1:clamp(8.8px,calc(.6875rem*var(--seed-font-size-multiplier)),13.98px);--seed-font-size-t2:clamp(9.6px,calc(.75rem*var(--seed-font-size-multiplier)),15.25px);--seed-font-size-t3:clamp(10.4px,calc(.8125rem*var(--seed-font-size-multiplier)),16.52px);--seed-font-size-t4:clamp(11.2px,calc(.875rem*var(--seed-font-size-multiplier)),17.79px);--seed-font-size-t5:clamp(12.8px,calc(1rem*var(--seed-font-size-multiplier)),20.33px);--seed-font-size-t6:clamp(14.4px,calc(1.125rem*var(--seed-font-size-multiplier)),22.87px);--seed-font-size-t7:clamp(16px,calc(1.25rem*var(--seed-font-size-multiplier)),25.41px);--seed-font-size-t8:clamp(17.6px,calc(1.375rem*var(--seed-font-size-multiplier)),27.95px);--seed-font-size-t9:clamp(19.2px,calc(1.5rem*var(--seed-font-size-multiplier)),30.49px);--seed-font-size-t10:clamp(20.8px,calc(1.625rem*var(--seed-font-size-multiplier)),33.04px);--seed-font-size-t2-static:12px;--seed-font-size-t5-static:16px;--seed-font-size-t6-static:18px;--seed-font-weight-regular:400;--seed-font-weight-medium:500;--seed-font-weight-bold:700;--seed-line-height-t1:clamp(12px,calc(.9375rem*var(--seed-font-size-multiplier)),19.06px);--seed-line-height-t2:clamp(12.8px,calc(1rem*var(--seed-font-size-multiplier)),20.33px);--seed-line-height-t3:clamp(14.4px,calc(1.125rem*var(--seed-font-size-multiplier)),22.87px);--seed-line-height-t4:clamp(15.2px,calc(1.1875rem*var(--seed-font-size-multiplier)),24.14px);--seed-line-height-t5:clamp(17.6px,calc(1.375rem*var(--seed-font-size-multiplier)),27.95px);--seed-line-height-t6:clamp(19.2px,calc(1.5rem*var(--seed-font-size-multiplier)),30.49px);--seed-line-height-t7:clamp(21.6px,calc(1.6875rem*var(--seed-font-size-multiplier)),34.31px);--seed-line-height-t8:clamp(24px,calc(1.875rem*var(--seed-font-size-multiplier)),38.12px);--seed-line-height-t9:clamp(25.6px,calc(2rem*var(--seed-font-size-multiplier)),40.66px);--seed-line-height-t10:clamp(28px,calc(2.1875rem*var(--seed-font-size-multiplier)),44.47px);--seed-radius-r0_5:2px;--seed-radius-r1:4px;--seed-radius-r1_5:6px;--seed-radius-r2:8px;--seed-radius-r2_5:10px;--seed-radius-r3:12px;--seed-radius-r3_5:14px;--seed-radius-r4:16px;--seed-radius-r5:20px;--seed-radius-r6:24px;--seed-radius-full:9999px;--seed-timing-function-linear:cubic-bezier(0,0,1,1);--seed-timing-function-easing:cubic-bezier(.35,0,.35,1);--seed-timing-function-enter:cubic-bezier(0,0,.15,1);--seed-timing-function-exit:cubic-bezier(.35,0,1,1);--seed-timing-function-enter-expressive:cubic-bezier(.03,.4,.1,1);--seed-timing-function-exit-expressive:cubic-bezier(.35,0,.95,.55)}:root,:root[data-seed-color-mode=system][data-seed-user-color-scheme=light],:root[data-seed-color-mode=light-only],:root [data-seed-color-mode=light-only]{--seed-color-palette-blue-100:#eff6ff;--seed-color-palette-blue-200:#e2edfc;--seed-color-palette-blue-300:#cbdffa;--seed-color-palette-blue-400:#aacefd;--seed-color-palette-blue-500:#85b8fd;--seed-color-palette-blue-600:#5e98fe;--seed-color-palette-blue-700:#217cf9;--seed-color-palette-blue-800:#135fcd;--seed-color-palette-blue-900:#0b4596;--seed-color-palette-blue-1000:#032451;--seed-color-palette-carrot-100:#fff2ec;--seed-color-palette-carrot-200:#ffe8db;--seed-color-palette-carrot-300:#ffd5c0;--seed-color-palette-carrot-400:#ffb999;--seed-color-palette-carrot-500:#ff9364;--seed-color-palette-carrot-600:#f60;--seed-color-palette-carrot-700:#e14d00;--seed-color-palette-carrot-800:#b93901;--seed-color-palette-carrot-900:#862b00;--seed-color-palette-carrot-1000:#471601;--seed-color-palette-gray-00:#fff;--seed-color-palette-gray-100:#f7f8f9;--seed-color-palette-gray-200:#f3f4f5;--seed-color-palette-gray-300:#eeeff1;--seed-color-palette-gray-400:#dcdee3;--seed-color-palette-gray-500:#d1d3d8;--seed-color-palette-gray-600:#b0b3ba;--seed-color-palette-gray-700:#868b94;--seed-color-palette-gray-800:#555d6d;--seed-color-palette-gray-900:#2a3038;--seed-color-palette-gray-1000:#1a1c20;--seed-color-palette-green-100:#edfaf6;--seed-color-palette-green-200:#d9f6e9;--seed-color-palette-green-300:#b9e9d2;--seed-color-palette-green-400:#7ddcb3;--seed-color-palette-green-500:#42c593;--seed-color-palette-green-600:#10ab7d;--seed-color-palette-green-700:#079171;--seed-color-palette-green-800:#00745f;--seed-color-palette-green-900:#075445;--seed-color-palette-green-1000:#0a2b24;--seed-color-palette-purple-100:#f5f3fe;--seed-color-palette-purple-200:#efeafe;--seed-color-palette-purple-300:#e1d8ff;--seed-color-palette-purple-400:#d0c0ff;--seed-color-palette-purple-500:#b8a1ff;--seed-color-palette-purple-600:#9f84fb;--seed-color-palette-purple-700:#8969ea;--seed-color-palette-purple-800:#6d50cb;--seed-color-palette-purple-900:#50379b;--seed-color-palette-purple-1000:#29175d;--seed-color-palette-red-100:#fdf0f0;--seed-color-palette-red-200:#fde7e7;--seed-color-palette-red-300:#fed4d2;--seed-color-palette-red-400:#feb7b3;--seed-color-palette-red-500:#fe928d;--seed-color-palette-red-600:#fc6a66;--seed-color-palette-red-700:#fa342c;--seed-color-palette-red-800:#ca1d13;--seed-color-palette-red-900:#921708;--seed-color-palette-red-1000:#4a1209;--seed-color-palette-static-black:#000;--seed-color-palette-static-white:#fff;--seed-color-palette-static-black-alpha-100:#00000007;--seed-color-palette-static-black-alpha-200:#0000000c;--seed-color-palette-static-black-alpha-300:#00000010;--seed-color-palette-static-black-alpha-400:#00000021;--seed-color-palette-static-black-alpha-500:#0000002c;--seed-color-palette-static-black-alpha-600:#0000004c;--seed-color-palette-static-black-alpha-700:#00000074;--seed-color-palette-static-black-alpha-800:#000000a2;--seed-color-palette-static-black-alpha-900:#000000d0;--seed-color-palette-static-black-alpha-1000:#000000e3;--seed-color-palette-static-white-alpha-50:#ffffff0d;--seed-color-palette-static-white-alpha-100:#ffffff17;--seed-color-palette-static-white-alpha-200:#ffffff20;--seed-color-palette-static-white-alpha-300:#ffffff2e;--seed-color-palette-static-white-alpha-400:#ffffff3d;--seed-color-palette-static-white-alpha-500:#ffffff60;--seed-color-palette-static-white-alpha-600:#ffffff8b;--seed-color-palette-static-white-alpha-700:#ffffffb3;--seed-color-palette-static-white-alpha-800:#ffffffde;--seed-color-palette-static-white-alpha-900:#ffffffea;--seed-color-palette-static-white-alpha-1000:#fffffff4;--seed-color-palette-yellow-100:#fff7de;--seed-color-palette-yellow-200:#fdefb9;--seed-color-palette-yellow-300:#fbdc65;--seed-color-palette-yellow-400:#e9c647;--seed-color-palette-yellow-500:#d4ab28;--seed-color-palette-yellow-600:#c49725;--seed-color-palette-yellow-700:#9b7821;--seed-color-palette-yellow-800:#755b22;--seed-color-palette-yellow-900:#4f3e1f;--seed-color-palette-yellow-1000:#2c2512;--seed-color-fg-neutral:var(--seed-color-palette-gray-1000);--seed-color-fg-brand:var(--seed-color-palette-carrot-600);--seed-color-fg-critical:var(--seed-color-palette-red-700);--seed-color-fg-positive:var(--seed-color-palette-green-700);--seed-color-fg-warning:var(--seed-color-palette-yellow-700);--seed-color-fg-informative:var(--seed-color-palette-blue-700);--seed-color-fg-placeholder:var(--seed-color-palette-gray-600);--seed-color-fg-disabled:var(--seed-color-palette-gray-500);--seed-color-fg-brand-contrast:var(--seed-color-palette-carrot-700);--seed-color-fg-critical-contrast:var(--seed-color-palette-red-900);--seed-color-fg-informative-contrast:var(--seed-color-palette-blue-900);--seed-color-fg-neutral-muted:var(--seed-color-palette-gray-800);--seed-color-fg-neutral-subtle:var(--seed-color-palette-gray-700);--seed-color-fg-neutral-inverted:var(--seed-color-palette-gray-00);--seed-color-fg-positive-contrast:var(--seed-color-palette-green-900);--seed-color-fg-warning-contrast:var(--seed-color-palette-yellow-900);--seed-color-bg-overlay:var(--seed-color-palette-static-black-alpha-700);--seed-color-bg-disabled:var(--seed-color-palette-gray-200);--seed-color-bg-brand-weak:var(--seed-color-palette-carrot-100);--seed-color-bg-brand-solid:var(--seed-color-palette-carrot-600);--seed-color-bg-brand-solid-pressed:var(--seed-color-palette-carrot-700);--seed-color-bg-brand-weak-pressed:var(--seed-color-palette-carrot-200);--seed-color-bg-critical-weak:var(--seed-color-palette-red-100);--seed-color-bg-critical-solid:var(--seed-color-palette-red-700);--seed-color-bg-critical-solid-pressed:var(--seed-color-palette-red-800);--seed-color-bg-critical-weak-pressed:var(--seed-color-palette-red-200);--seed-color-bg-informative-weak:var(--seed-color-palette-blue-100);--seed-color-bg-informative-solid:var(--seed-color-palette-blue-700);--seed-color-bg-informative-solid-pressed:var(--seed-color-palette-blue-800);--seed-color-bg-informative-weak-pressed:var(--seed-color-palette-blue-200);--seed-color-bg-layer-basement:var(--seed-color-palette-gray-200);--seed-color-bg-layer-default:var(--seed-color-palette-gray-00);--seed-color-bg-layer-fill:var(--seed-color-palette-gray-100);--seed-color-bg-layer-floating:var(--seed-color-palette-gray-00);--seed-color-bg-layer-default-pressed:var(--seed-color-palette-gray-100);--seed-color-bg-layer-floating-pressed:var(--seed-color-palette-gray-100);--seed-color-bg-magic-weak:#f9f2ee;--seed-color-bg-neutral-weak:var(--seed-color-palette-gray-200);--seed-color-bg-neutral-inverted:var(--seed-color-palette-gray-900);--seed-color-bg-neutral-solid:var(--seed-color-palette-gray-1000);--seed-color-bg-neutral-inverted-pressed:var(--seed-color-palette-gray-800);--seed-color-bg-neutral-solid-muted:var(--seed-color-palette-gray-800);--seed-color-bg-neutral-solid-muted-pressed:var(--seed-color-palette-gray-900);--seed-color-bg-neutral-weak-pressed:var(--seed-color-palette-gray-300);--seed-color-bg-overlay-muted:var(--seed-color-palette-static-black-alpha-500);--seed-color-bg-positive-weak:var(--seed-color-palette-green-100);--seed-color-bg-positive-solid:var(--seed-color-palette-green-700);--seed-color-bg-positive-solid-pressed:var(--seed-color-palette-green-800);--seed-color-bg-positive-weak-pressed:var(--seed-color-palette-green-200);--seed-color-bg-warning-weak:var(--seed-color-palette-yellow-100);--seed-color-bg-warning-solid:var(--seed-color-palette-yellow-300);--seed-color-bg-warning-solid-pressed:var(--seed-color-palette-yellow-400);--seed-color-bg-warning-weak-pressed:var(--seed-color-palette-yellow-200);--seed-color-stroke-neutral:var(--seed-color-palette-static-black-alpha-300);--seed-color-stroke-brand:var(--seed-color-palette-carrot-300);--seed-color-stroke-positive:var(--seed-color-palette-green-300);--seed-color-stroke-informative:var(--seed-color-palette-blue-300);--seed-color-stroke-warning:var(--seed-color-palette-yellow-300);--seed-color-stroke-critical:var(--seed-color-palette-red-300);--seed-color-stroke-field:var(--seed-color-palette-gray-400);--seed-color-stroke-control:var(--seed-color-palette-gray-400);--seed-color-stroke-field-focused:var(--seed-color-palette-gray-800);--seed-color-stroke-neutral-muted:var(--seed-color-palette-static-black-alpha-200);--seed-color-stroke-on-image:var(--seed-color-palette-static-black-alpha-200);--seed-color-manner-temp-l1-text:#62666a;--seed-color-manner-temp-l2-text:#2592f7;--seed-color-manner-temp-l3-text:#0099c8;--seed-color-manner-temp-l4-text:#03a07e;--seed-color-manner-temp-l4-bg:#ebf9f4;--seed-color-manner-temp-l5-text:#d28500;--seed-color-manner-temp-l6-text:#f06000;--seed-color-manner-temp-l1-bg:#eff0f1;--seed-color-manner-temp-l2-bg:#e7f2fc;--seed-color-manner-temp-l3-bg:#e3f6fc;--seed-color-manner-temp-l5-bg:#fff5e5;--seed-color-manner-temp-l6-bg:#fff0e5;--seed-gradient-fade-layer-floating:#fff0 0%,#000 100%;--seed-gradient-fade-layer-default:#000 0%,#fff0 100%;--seed-gradient-glow-magic:#fef6f7 0%,#fef0e7 80%,#f9f7f5 100%;--seed-gradient-glow-magic-pressed:#fbf0f2 0%,#ffe8db 80%,#f5f2ef 100%;--seed-gradient-shimmer-neutral:#fff0 0%,#fff6 46%,#fff6 54%,#fff0 100%;--seed-gradient-shimmer-magic:#fff9f500 0%,#fff9f58a 46%,#fff9f58a 54%,#fff9f500 100%;--seed-gradient-highlight-magic-pressed:#e14f00 20%,#ae58bf 100%;--seed-gradient-highlight-magic:#f60 20%,#d25aca 100%}:root[data-seed-color-mode=system][data-seed-user-color-scheme=dark],:root[data-seed-color-mode=dark-only],:root [data-seed-color-mode=dark-only]{--seed-color-palette-blue-100:#202742;--seed-color-palette-blue-200:#1e3352;--seed-color-palette-blue-300:#1a4275;--seed-color-palette-blue-400:#0f559e;--seed-color-palette-blue-500:#1964d8;--seed-color-palette-blue-600:#1e82eb;--seed-color-palette-blue-700:#41a2f9;--seed-color-palette-blue-800:#83bcf9;--seed-color-palette-blue-900:#b9d7fb;--seed-color-palette-blue-1000:#e5f0fe;--seed-color-palette-carrot-100:#31241f;--seed-color-palette-carrot-200:#4b291c;--seed-color-palette-carrot-300:#6b311c;--seed-color-palette-carrot-400:#923600;--seed-color-palette-carrot-500:#bd4201;--seed-color-palette-carrot-600:#e65200;--seed-color-palette-carrot-700:#f60;--seed-color-palette-carrot-800:#ff9e65;--seed-color-palette-carrot-900:#eecebc;--seed-color-palette-carrot-1000:#f4eeea;--seed-color-palette-gray-00:#000;--seed-color-palette-gray-100:#16171b;--seed-color-palette-gray-200:#1d2025;--seed-color-palette-gray-300:#2b2e35;--seed-color-palette-gray-400:#393d46;--seed-color-palette-gray-500:#5b606a;--seed-color-palette-gray-600:#868b94;--seed-color-palette-gray-700:#b0b3ba;--seed-color-palette-gray-800:#dcdee3;--seed-color-palette-gray-900:#e9eaec;--seed-color-palette-gray-1000:#f3f4f5;--seed-color-palette-green-100:#202926;--seed-color-palette-green-200:#20362e;--seed-color-palette-green-300:#20493b;--seed-color-palette-green-400:#19604c;--seed-color-palette-green-500:#117956;--seed-color-palette-green-600:#1b946d;--seed-color-palette-green-700:#22b27f;--seed-color-palette-green-800:#35ce9a;--seed-color-palette-green-900:#93e5c0;--seed-color-palette-green-1000:#d4f6ef;--seed-color-palette-purple-100:#28213b;--seed-color-palette-purple-200:#3b2873;--seed-color-palette-purple-300:#443081;--seed-color-palette-purple-400:#5a3bb1;--seed-color-palette-purple-500:#764fd9;--seed-color-palette-purple-600:#8e6bee;--seed-color-palette-purple-700:#a78df0;--seed-color-palette-purple-800:#beadf2;--seed-color-palette-purple-900:#d9cefa;--seed-color-palette-purple-1000:#f0edfc;--seed-color-palette-red-100:#322323;--seed-color-palette-red-200:#4f2624;--seed-color-palette-red-300:#742826;--seed-color-palette-red-400:#a12621;--seed-color-palette-red-500:#ca2319;--seed-color-palette-red-600:#f73526;--seed-color-palette-red-700:#ff6e60;--seed-color-palette-red-800:#ffa299;--seed-color-palette-red-900:#f8c5c3;--seed-color-palette-red-1000:#fdf2f2;--seed-color-palette-static-black:#000;--seed-color-palette-static-white:#fff;--seed-color-palette-static-black-alpha-100:#00000007;--seed-color-palette-static-black-alpha-200:#0000000c;--seed-color-palette-static-black-alpha-300:#00000010;--seed-color-palette-static-black-alpha-400:#00000021;--seed-color-palette-static-black-alpha-500:#0000002c;--seed-color-palette-static-black-alpha-600:#0000004c;--seed-color-palette-static-black-alpha-700:#00000074;--seed-color-palette-static-black-alpha-800:#000000a2;--seed-color-palette-static-black-alpha-900:#000000d0;--seed-color-palette-static-black-alpha-1000:#000000e3;--seed-color-palette-static-white-alpha-50:#ffffff0d;--seed-color-palette-static-white-alpha-100:#ffffff17;--seed-color-palette-static-white-alpha-200:#ffffff20;--seed-color-palette-static-white-alpha-300:#ffffff2e;--seed-color-palette-static-white-alpha-400:#ffffff3d;--seed-color-palette-static-white-alpha-500:#ffffff60;--seed-color-palette-static-white-alpha-600:#ffffff8b;--seed-color-palette-static-white-alpha-700:#ffffffb3;--seed-color-palette-static-white-alpha-800:#ffffffde;--seed-color-palette-static-white-alpha-900:#ffffffea;--seed-color-palette-static-white-alpha-1000:#fffffff4;--seed-color-palette-yellow-100:#302819;--seed-color-palette-yellow-200:#413218;--seed-color-palette-yellow-300:#543e15;--seed-color-palette-yellow-400:#714e15;--seed-color-palette-yellow-500:#91601b;--seed-color-palette-yellow-600:#b6720d;--seed-color-palette-yellow-700:#ca901c;--seed-color-palette-yellow-800:#dab156;--seed-color-palette-yellow-900:#e5d49b;--seed-color-palette-yellow-1000:#f7f0cd;--seed-color-fg-neutral:var(--seed-color-palette-gray-1000);--seed-color-fg-brand:var(--seed-color-palette-carrot-700);--seed-color-fg-critical:var(--seed-color-palette-red-700);--seed-color-fg-positive:var(--seed-color-palette-green-700);--seed-color-fg-warning:var(--seed-color-palette-yellow-700);--seed-color-fg-informative:var(--seed-color-palette-blue-700);--seed-color-fg-placeholder:var(--seed-color-palette-gray-600);--seed-color-fg-disabled:var(--seed-color-palette-gray-500);--seed-color-fg-brand-contrast:var(--seed-color-palette-carrot-700);--seed-color-fg-critical-contrast:var(--seed-color-palette-red-900);--seed-color-fg-informative-contrast:var(--seed-color-palette-blue-900);--seed-color-fg-neutral-muted:var(--seed-color-palette-gray-800);--seed-color-fg-neutral-subtle:var(--seed-color-palette-gray-700);--seed-color-fg-neutral-inverted:var(--seed-color-palette-gray-100);--seed-color-fg-positive-contrast:var(--seed-color-palette-green-900);--seed-color-fg-warning-contrast:var(--seed-color-palette-yellow-900);--seed-color-bg-overlay:var(--seed-color-palette-static-black-alpha-700);--seed-color-bg-disabled:var(--seed-color-palette-gray-300);--seed-color-bg-brand-weak:var(--seed-color-palette-carrot-100);--seed-color-bg-brand-solid:var(--seed-color-palette-carrot-700);--seed-color-bg-brand-solid-pressed:var(--seed-color-palette-carrot-800);--seed-color-bg-brand-weak-pressed:var(--seed-color-palette-carrot-200);--seed-color-bg-critical-weak:var(--seed-color-palette-red-100);--seed-color-bg-critical-solid:var(--seed-color-palette-red-600);--seed-color-bg-critical-solid-pressed:var(--seed-color-palette-red-700);--seed-color-bg-critical-weak-pressed:var(--seed-color-palette-red-200);--seed-color-bg-informative-weak:var(--seed-color-palette-blue-100);--seed-color-bg-informative-solid:var(--seed-color-palette-blue-600);--seed-color-bg-informative-solid-pressed:var(--seed-color-palette-blue-700);--seed-color-bg-informative-weak-pressed:var(--seed-color-palette-blue-200);--seed-color-bg-layer-basement:var(--seed-color-palette-gray-00);--seed-color-bg-layer-default:var(--seed-color-palette-gray-100);--seed-color-bg-layer-fill:var(--seed-color-palette-gray-200);--seed-color-bg-layer-floating:var(--seed-color-palette-gray-200);--seed-color-bg-layer-default-pressed:var(--seed-color-palette-gray-300);--seed-color-bg-layer-floating-pressed:var(--seed-color-palette-gray-300);--seed-color-bg-magic-weak:#201f1f;--seed-color-bg-neutral-weak:var(--seed-color-palette-gray-300);--seed-color-bg-neutral-inverted:var(--seed-color-palette-gray-1000);--seed-color-bg-neutral-solid:var(--seed-color-palette-gray-300);--seed-color-bg-neutral-inverted-pressed:var(--seed-color-palette-gray-800);--seed-color-bg-neutral-solid-muted:var(--seed-color-palette-gray-400);--seed-color-bg-neutral-solid-muted-pressed:var(--seed-color-palette-gray-500);--seed-color-bg-neutral-weak-pressed:var(--seed-color-palette-gray-400);--seed-color-bg-overlay-muted:var(--seed-color-palette-static-black-alpha-500);--seed-color-bg-positive-weak:var(--seed-color-palette-green-100);--seed-color-bg-positive-solid:var(--seed-color-palette-green-500);--seed-color-bg-positive-solid-pressed:var(--seed-color-palette-green-600);--seed-color-bg-positive-weak-pressed:var(--seed-color-palette-green-200);--seed-color-bg-warning-weak:var(--seed-color-palette-yellow-100);--seed-color-bg-warning-solid:var(--seed-color-palette-yellow-600);--seed-color-bg-warning-solid-pressed:var(--seed-color-palette-yellow-700);--seed-color-bg-warning-weak-pressed:var(--seed-color-palette-yellow-200);--seed-color-stroke-neutral:var(--seed-color-palette-static-white-alpha-100);--seed-color-stroke-brand:var(--seed-color-palette-carrot-300);--seed-color-stroke-positive:var(--seed-color-palette-green-300);--seed-color-stroke-informative:var(--seed-color-palette-blue-300);--seed-color-stroke-warning:var(--seed-color-palette-yellow-300);--seed-color-stroke-critical:var(--seed-color-palette-red-300);--seed-color-stroke-field:var(--seed-color-palette-gray-400);--seed-color-stroke-control:var(--seed-color-palette-gray-400);--seed-color-stroke-field-focused:var(--seed-color-palette-gray-800);--seed-color-stroke-neutral-muted:var(--seed-color-palette-static-white-alpha-50);--seed-color-stroke-on-image:var(--seed-color-palette-static-white-alpha-50);--seed-color-manner-temp-l1-text:#b1b5b9;--seed-color-manner-temp-l2-text:#7cbaf4;--seed-color-manner-temp-l3-text:#47c3eb;--seed-color-manner-temp-l4-text:#33cc94;--seed-color-manner-temp-l4-bg:#162822;--seed-color-manner-temp-l5-text:#ffa100;--seed-color-manner-temp-l6-text:#ff9147;--seed-color-manner-temp-l1-bg:#222226;--seed-color-manner-temp-l2-bg:#16212b;--seed-color-manner-temp-l3-bg:#12262c;--seed-color-manner-temp-l5-bg:#2e2312;--seed-color-manner-temp-l6-bg:#2e1d12;--seed-gradient-fade-layer-floating:#1d202500 0%,#000 100%;--seed-gradient-fade-layer-default:#000 0%,#16171b00 100%;--seed-gradient-glow-magic:#2d252d 0%,#3a312b 80%,#333232 100%;--seed-gradient-glow-magic-pressed:#3e333e 0%,#51453e 80%,#434242 100%;--seed-gradient-shimmer-neutral:#fff0 0%,#ffffff1a 46%,#ffffff1a 54%,#fff0 100%;--seed-gradient-shimmer-magic:#fff9f500 0%,#fff9f51a 46%,#fff9f51a 54%,#fff9f500 100%;--seed-gradient-highlight-magic-pressed:#ff9e65 20%,#e89bee 100%;--seed-gradient-highlight-magic:#f60 20%,#d25aca 100%}@keyframes seed-enter{0%{opacity:var(--seed-enter-opacity,1);transform:translate3d(var(--seed-enter-translate-x,0),var(--seed-enter-translate-y,0),0)scale3d(var(--seed-enter-scale,1),var(--seed-enter-scale,1),var(--seed-enter-scale,1))rotate(var(--seed-enter-rotate,0))}}@keyframes seed-exit{to{opacity:var(--seed-exit-opacity,1);transform:translate3d(var(--seed-exit-translate-x,0),var(--seed-exit-translate-y,0),0)scale3d(var(--seed-exit-scale,1),var(--seed-exit-scale,1),var(--seed-exit-scale,1))rotate(var(--seed-exit-rotate,0))}}@keyframes rotate{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes slide-x{0%{transform:translate(-100%)}to{transform:translate(100%)}}@keyframes progress-circle-head{0%{stroke-dasharray:0 1000%}75%{stroke-dasharray:var(--circumference),1000%}to{stroke-dasharray:var(--circumference),1000%}}@keyframes progress-circle-tail{0%{stroke-dashoffset:0}33.33%{stroke-dashoffset:0}to{stroke-dashoffset:calc(var(--circumference)*-1)}}
|
package/package.json
CHANGED
package/recipes/badge.css
CHANGED
|
@@ -1,15 +1,20 @@
|
|
|
1
|
-
.seed-
|
|
1
|
+
.seed-badge__root {
|
|
2
2
|
display: inline-flex;
|
|
3
3
|
box-sizing: border-box;
|
|
4
4
|
align-items: center;
|
|
5
|
-
justify-content: center;
|
|
6
5
|
text-transform: none;
|
|
7
6
|
text-align: start;
|
|
8
7
|
-webkit-font-smoothing: antialiased;
|
|
9
8
|
-moz-osx-font-smoothing: grayscale;
|
|
10
9
|
text-decoration: none
|
|
11
10
|
}
|
|
12
|
-
.seed-
|
|
11
|
+
.seed-badge__label {
|
|
12
|
+
overflow: hidden;
|
|
13
|
+
text-overflow: ellipsis;
|
|
14
|
+
white-space: nowrap
|
|
15
|
+
}
|
|
16
|
+
.seed-badge__root--size_medium {
|
|
17
|
+
max-width: 7.5rem;
|
|
13
18
|
min-height: var(--seed-dimension-x5);
|
|
14
19
|
padding-inline: var(--seed-dimension-x1_5);
|
|
15
20
|
padding-block: var(--seed-dimension-x0_5);
|
|
@@ -17,7 +22,8 @@
|
|
|
17
22
|
font-size: var(--seed-font-size-t1);
|
|
18
23
|
line-height: var(--seed-line-height-t1)
|
|
19
24
|
}
|
|
20
|
-
.seed-
|
|
25
|
+
.seed-badge__root--size_large {
|
|
26
|
+
max-width: 6.75rem;
|
|
21
27
|
min-height: var(--seed-dimension-x6);
|
|
22
28
|
padding-inline: var(--seed-dimension-x2);
|
|
23
29
|
padding-block: var(--seed-dimension-x1);
|
|
@@ -25,77 +31,84 @@
|
|
|
25
31
|
font-size: var(--seed-font-size-t2);
|
|
26
32
|
line-height: var(--seed-line-height-t2)
|
|
27
33
|
}
|
|
28
|
-
.seed-
|
|
34
|
+
.seed-badge__root--variant_weak {
|
|
29
35
|
font-weight: var(--seed-font-weight-medium)
|
|
30
36
|
}
|
|
31
|
-
.seed-
|
|
37
|
+
.seed-badge__root--variant_solid {
|
|
32
38
|
font-weight: var(--seed-font-weight-bold)
|
|
33
39
|
}
|
|
34
|
-
.seed-
|
|
40
|
+
.seed-badge__root--variant_outline {
|
|
35
41
|
font-weight: var(--seed-font-weight-bold)
|
|
36
42
|
}
|
|
37
|
-
.seed-
|
|
38
|
-
.seed-badge--tone_brand {}
|
|
39
|
-
.seed-badge--tone_informative {}
|
|
40
|
-
.seed-badge--tone_positive {}
|
|
41
|
-
.seed-badge--tone_critical {}
|
|
42
|
-
.seed-badge--tone_neutral-variant_weak {
|
|
43
|
+
.seed-badge__root--tone_neutral-variant_weak {
|
|
43
44
|
background-color: var(--seed-color-bg-neutral-weak);
|
|
44
45
|
color: var(--seed-color-fg-neutral-muted)
|
|
45
46
|
}
|
|
46
|
-
.seed-
|
|
47
|
+
.seed-badge__root--tone_neutral-variant_solid {
|
|
47
48
|
background-color: var(--seed-color-palette-gray-800);
|
|
48
49
|
color: var(--seed-color-fg-neutral-inverted)
|
|
49
50
|
}
|
|
50
|
-
.seed-
|
|
51
|
+
.seed-badge__root--tone_neutral-variant_outline {
|
|
51
52
|
box-shadow: inset 0 0 0 1px var(--seed-color-stroke-neutral);
|
|
52
53
|
color: var(--seed-color-fg-neutral-muted)
|
|
53
54
|
}
|
|
54
|
-
.seed-
|
|
55
|
-
background-color: var(--seed-color-
|
|
56
|
-
color: var(--seed-color-
|
|
55
|
+
.seed-badge__root--tone_brand-variant_weak {
|
|
56
|
+
background-color: var(--seed-color-bg-brand-weak);
|
|
57
|
+
color: var(--seed-color-fg-brand-contrast)
|
|
57
58
|
}
|
|
58
|
-
.seed-
|
|
59
|
+
.seed-badge__root--tone_brand-variant_solid {
|
|
59
60
|
background-color: var(--seed-color-bg-brand-solid);
|
|
60
61
|
color: var(--seed-color-palette-static-white)
|
|
61
62
|
}
|
|
62
|
-
.seed-
|
|
63
|
+
.seed-badge__root--tone_brand-variant_outline {
|
|
63
64
|
box-shadow: inset 0 0 0 1px var(--seed-color-stroke-brand);
|
|
64
65
|
color: var(--seed-color-fg-brand)
|
|
65
66
|
}
|
|
66
|
-
.seed-
|
|
67
|
+
.seed-badge__root--tone_informative-variant_weak {
|
|
67
68
|
background-color: var(--seed-color-bg-informative-weak);
|
|
68
69
|
color: var(--seed-color-fg-informative-contrast)
|
|
69
70
|
}
|
|
70
|
-
.seed-
|
|
71
|
+
.seed-badge__root--tone_informative-variant_solid {
|
|
71
72
|
background-color: var(--seed-color-bg-informative-solid);
|
|
72
73
|
color: var(--seed-color-palette-static-white)
|
|
73
74
|
}
|
|
74
|
-
.seed-
|
|
75
|
+
.seed-badge__root--tone_informative-variant_outline {
|
|
75
76
|
box-shadow: inset 0 0 0 1px var(--seed-color-stroke-informative);
|
|
76
77
|
color: var(--seed-color-fg-informative)
|
|
77
78
|
}
|
|
78
|
-
.seed-
|
|
79
|
+
.seed-badge__root--tone_positive-variant_weak {
|
|
79
80
|
background-color: var(--seed-color-bg-positive-weak);
|
|
80
81
|
color: var(--seed-color-fg-positive-contrast)
|
|
81
82
|
}
|
|
82
|
-
.seed-
|
|
83
|
+
.seed-badge__root--tone_positive-variant_solid {
|
|
83
84
|
background-color: var(--seed-color-bg-positive-solid);
|
|
84
85
|
color: var(--seed-color-palette-static-white)
|
|
85
86
|
}
|
|
86
|
-
.seed-
|
|
87
|
+
.seed-badge__root--tone_positive-variant_outline {
|
|
87
88
|
box-shadow: inset 0 0 0 1px var(--seed-color-stroke-positive);
|
|
88
89
|
color: var(--seed-color-fg-positive)
|
|
89
90
|
}
|
|
90
|
-
.seed-
|
|
91
|
+
.seed-badge__root--tone_warning-variant_weak {
|
|
92
|
+
background-color: var(--seed-color-bg-warning-weak);
|
|
93
|
+
color: var(--seed-color-fg-warning-contrast)
|
|
94
|
+
}
|
|
95
|
+
.seed-badge__root--tone_warning-variant_solid {
|
|
96
|
+
background-color: var(--seed-color-bg-warning-solid);
|
|
97
|
+
color: var(--seed-color-fg-neutral)
|
|
98
|
+
}
|
|
99
|
+
.seed-badge__root--tone_warning-variant_outline {
|
|
100
|
+
box-shadow: inset 0 0 0 1px var(--seed-color-stroke-warning);
|
|
101
|
+
color: var(--seed-color-fg-warning)
|
|
102
|
+
}
|
|
103
|
+
.seed-badge__root--tone_critical-variant_weak {
|
|
91
104
|
background-color: var(--seed-color-bg-critical-weak);
|
|
92
105
|
color: var(--seed-color-fg-critical-contrast)
|
|
93
106
|
}
|
|
94
|
-
.seed-
|
|
107
|
+
.seed-badge__root--tone_critical-variant_solid {
|
|
95
108
|
background-color: var(--seed-color-bg-critical-solid);
|
|
96
109
|
color: var(--seed-color-palette-static-white)
|
|
97
110
|
}
|
|
98
|
-
.seed-
|
|
111
|
+
.seed-badge__root--tone_critical-variant_outline {
|
|
99
112
|
box-shadow: inset 0 0 0 1px var(--seed-color-stroke-critical);
|
|
100
113
|
color: var(--seed-color-fg-critical)
|
|
101
114
|
}
|
package/recipes/badge.d.ts
CHANGED
|
@@ -10,7 +10,7 @@ declare interface BadgeVariant {
|
|
|
10
10
|
/**
|
|
11
11
|
* @default neutral
|
|
12
12
|
*/
|
|
13
|
-
tone: "neutral" | "brand" | "informative" | "positive" | "critical";
|
|
13
|
+
tone: "neutral" | "brand" | "informative" | "positive" | "warning" | "critical";
|
|
14
14
|
}
|
|
15
15
|
|
|
16
16
|
declare type BadgeVariantMap = {
|
|
@@ -19,11 +19,13 @@ declare type BadgeVariantMap = {
|
|
|
19
19
|
|
|
20
20
|
export declare type BadgeVariantProps = Partial<BadgeVariant>;
|
|
21
21
|
|
|
22
|
+
export declare type BadgeSlotName = "root" | "label";
|
|
23
|
+
|
|
22
24
|
export declare const badgeVariantMap: BadgeVariantMap;
|
|
23
25
|
|
|
24
26
|
export declare const badge: ((
|
|
25
27
|
props?: BadgeVariantProps,
|
|
26
|
-
) => string) & {
|
|
28
|
+
) => Record<BadgeSlotName, string>) & {
|
|
27
29
|
splitVariantProps: <T extends BadgeVariantProps>(
|
|
28
30
|
props: T,
|
|
29
31
|
) => [BadgeVariantProps, Omit<T, keyof BadgeVariantProps>];
|
package/recipes/badge.mjs
CHANGED
|
@@ -1,6 +1,17 @@
|
|
|
1
1
|
import './badge.css';
|
|
2
2
|
import { createClassName, mergeVariants, splitVariantProps } from "./shared.mjs";
|
|
3
3
|
|
|
4
|
+
const badgeSlotNames = [
|
|
5
|
+
[
|
|
6
|
+
"root",
|
|
7
|
+
"seed-badge__root"
|
|
8
|
+
],
|
|
9
|
+
[
|
|
10
|
+
"label",
|
|
11
|
+
"seed-badge__label"
|
|
12
|
+
]
|
|
13
|
+
];
|
|
14
|
+
|
|
4
15
|
const defaultVariant = {
|
|
5
16
|
"size": "medium",
|
|
6
17
|
"variant": "solid",
|
|
@@ -56,6 +67,18 @@ const compoundVariants = [
|
|
|
56
67
|
"tone": "positive",
|
|
57
68
|
"variant": "outline"
|
|
58
69
|
},
|
|
70
|
+
{
|
|
71
|
+
"tone": "warning",
|
|
72
|
+
"variant": "weak"
|
|
73
|
+
},
|
|
74
|
+
{
|
|
75
|
+
"tone": "warning",
|
|
76
|
+
"variant": "solid"
|
|
77
|
+
},
|
|
78
|
+
{
|
|
79
|
+
"tone": "warning",
|
|
80
|
+
"variant": "outline"
|
|
81
|
+
},
|
|
59
82
|
{
|
|
60
83
|
"tone": "critical",
|
|
61
84
|
"variant": "weak"
|
|
@@ -85,6 +108,7 @@ export const badgeVariantMap = {
|
|
|
85
108
|
"brand",
|
|
86
109
|
"informative",
|
|
87
110
|
"positive",
|
|
111
|
+
"warning",
|
|
88
112
|
"critical"
|
|
89
113
|
]
|
|
90
114
|
};
|
|
@@ -92,10 +116,13 @@ export const badgeVariantMap = {
|
|
|
92
116
|
export const badgeVariantKeys = Object.keys(badgeVariantMap);
|
|
93
117
|
|
|
94
118
|
export function badge(props) {
|
|
95
|
-
return
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
119
|
+
return Object.fromEntries(
|
|
120
|
+
badgeSlotNames.map(([slot, className]) => {
|
|
121
|
+
return [
|
|
122
|
+
slot,
|
|
123
|
+
createClassName(className, mergeVariants(defaultVariant, props), compoundVariants),
|
|
124
|
+
];
|
|
125
|
+
}),
|
|
99
126
|
);
|
|
100
127
|
}
|
|
101
128
|
|