@aivenio/aquarium 1.22.0-rc1 → 1.23.0

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.
Files changed (45) hide show
  1. package/dist/_variables.scss +14 -14
  2. package/dist/_variables_timescale.scss +2 -2
  3. package/dist/atoms.cjs +54 -51
  4. package/dist/atoms.mjs +54 -51
  5. package/dist/src/atoms/Alert/Alert.js +2 -2
  6. package/dist/src/atoms/Banner/Banner.js +3 -3
  7. package/dist/src/atoms/Checkbox/Checkbox.js +6 -6
  8. package/dist/src/atoms/RadioButton/RadioButton.js +4 -4
  9. package/dist/src/atoms/Switch/Switch.js +3 -3
  10. package/dist/src/molecules/Alert/Alert.js +2 -2
  11. package/dist/src/molecules/Banner/Banner.d.ts +3 -3
  12. package/dist/src/molecules/Banner/Banner.js +5 -3
  13. package/dist/src/molecules/Breadcrumbs/Breadcrumbs.js +2 -2
  14. package/dist/src/molecules/Button/Button.js +6 -7
  15. package/dist/src/molecules/DataList/DataList.d.ts +8 -2
  16. package/dist/src/molecules/DataList/DataList.js +5 -3
  17. package/dist/src/molecules/DataList/DataListSkeleton.d.ts +8 -0
  18. package/dist/src/molecules/DataList/DataListSkeleton.js +15 -0
  19. package/dist/src/molecules/DataTable/DataTable.d.ts +8 -2
  20. package/dist/src/molecules/DataTable/DataTable.js +5 -3
  21. package/dist/src/molecules/EmptyState/EmptyState.d.ts +5 -3
  22. package/dist/src/molecules/EmptyState/EmptyState.js +8 -3
  23. package/dist/src/molecules/Link/Link.js +1 -1
  24. package/dist/src/molecules/Navigation/Navigation.js +2 -2
  25. package/dist/src/molecules/PageHeader/PageHeader.d.ts +5 -3
  26. package/dist/src/molecules/PageHeader/PageHeader.js +6 -17
  27. package/dist/src/molecules/Section/Section.d.ts +3 -2
  28. package/dist/src/molecules/Section/Section.js +4 -16
  29. package/dist/src/molecules/Tabs/Tabs.js +3 -3
  30. package/dist/src/utils/ContrastRatio.d.ts +11 -0
  31. package/dist/src/utils/ContrastRatio.js +54 -0
  32. package/dist/src/utils/constants.js +3 -3
  33. package/dist/src/utils/link.d.ts +2 -0
  34. package/dist/src/utils/link.js +2 -0
  35. package/dist/src/utils/table/types.d.ts +4 -0
  36. package/dist/styles.css +133 -156
  37. package/dist/styles_timescaledb.css +112 -135
  38. package/dist/system.cjs +592 -533
  39. package/dist/system.mjs +552 -493
  40. package/dist/tailwind.config.js +0 -3
  41. package/dist/tailwind.theme.json +14 -14
  42. package/dist/tokens.json +16 -14
  43. package/dist/tsconfig.module.tsbuildinfo +1 -1
  44. package/dist/types/tailwindGenerated.d.ts +1 -1
  45. package/package.json +4 -4
@@ -506,24 +506,24 @@ img,video {
506
506
  --aquarium-colors-secondary-10: #fee8d0;
507
507
  --aquarium-colors-secondary-5: #fff3e8;
508
508
  --aquarium-colors-secondary-0: #fffbf8;
509
- --aquarium-colors-primary-100: 0e1652;
510
- --aquarium-colors-primary-90: #222f95;
511
- --aquarium-colors-primary-80: #3545be;
512
- --aquarium-colors-primary-70: #5865cd;
513
- --aquarium-colors-primary-60: #818eec;
514
- --aquarium-colors-primary-50: #000000;
515
- --aquarium-colors-primary-40: #b9c5ef;
516
- --aquarium-colors-primary-30: #000000;
517
- --aquarium-colors-primary-20: #000000;
518
- --aquarium-colors-primary-10: #e3e9ff;
519
- --aquarium-colors-primary-5: #f3f6ff;
520
- --aquarium-colors-primary-0: #ffffff;
509
+ --aquarium-colors-primary-100: #a70045;
510
+ --aquarium-colors-primary-90: #c60443;
511
+ --aquarium-colors-primary-80: #e41a4a;
512
+ --aquarium-colors-primary-70: #ff3554;
513
+ --aquarium-colors-primary-60: #ff5275;
514
+ --aquarium-colors-primary-50: #ff6f94;
515
+ --aquarium-colors-primary-40: #ff8db0;
516
+ --aquarium-colors-primary-30: #ffa9c9;
517
+ --aquarium-colors-primary-20: #ffc4de;
518
+ --aquarium-colors-primary-10: #ffdeef;
519
+ --aquarium-colors-primary-5: #ffe8f4;
520
+ --aquarium-colors-primary-0: #fff9fc;
521
521
  --aquarium-colors-grey-20: #d2d2d6;
522
+ --aquarium-colors-navy-blue-100: #30375e;
522
523
  --aquarium-colors-transparent: transparent;
523
524
  --aquarium-colors-white: white;
524
525
  --aquarium-colors-black: black;
525
526
  --aquarium-colors-current: currentColor;
526
- --aquarium-colors-navy-blue-100: #30375E;
527
527
  --aquarium-box-shadow-24dp: 0px 24px 48px rgba(90, 91, 106, 0.08), 0px 12px 24px rgba(58, 58, 68, 0.08);
528
528
  --aquarium-box-shadow-16dp: 0px 16px 32px rgba(90, 91, 106, 0.12), 0px 8px 16px rgba(58, 58, 68, 0.12);
529
529
  --aquarium-box-shadow-8dp: 0px 8px 16px rgba(90, 91, 106, 0.16), 0px 4px 8px rgba(58, 58, 68, 0.16);
@@ -1670,13 +1670,9 @@ input[type='number'].no-arrows {
1670
1670
  border-color: #e1e1e3;
1671
1671
  border-color: var(--aquarium-colors-grey-10, #e1e1e3);
1672
1672
  }
1673
- .border-primary-80 {
1674
- border-color: #3545be;
1675
- border-color: var(--aquarium-colors-primary-80, #0788d1);
1676
- }
1677
- .border-primary-40 {
1678
- border-color: #b9c5ef;
1679
- border-color: var(--aquarium-colors-primary-40, #4cc2f7);
1673
+ .border-navyBlue-100 {
1674
+ border-color: #30375e;
1675
+ border-color: var(--aquarium-colors-navyBlue-100, #30375e);
1680
1676
  }
1681
1677
  .border-grey-50 {
1682
1678
  border-color: #787885;
@@ -1702,6 +1698,10 @@ input[type='number'].no-arrows {
1702
1698
  border-color: #19191d;
1703
1699
  border-color: var(--aquarium-colors-grey-100, #19191d);
1704
1700
  }
1701
+ .border-primary-80 {
1702
+ border-color: #e41a4a;
1703
+ border-color: var(--aquarium-colors-primary-80, #0788d1);
1704
+ }
1705
1705
  .bg-grey-10 {
1706
1706
  background-color: #e1e1e3;
1707
1707
  background-color: var(--aquarium-colors-grey-10, #e1e1e3);
@@ -1730,22 +1730,14 @@ input[type='number'].no-arrows {
1730
1730
  background-color: white;
1731
1731
  background-color: var(--aquarium-colors-white, white);
1732
1732
  }
1733
- .bg-primary-80 {
1734
- background-color: #3545be;
1735
- background-color: var(--aquarium-colors-primary-80, #0788d1);
1736
- }
1737
- .bg-primary-40 {
1738
- background-color: #b9c5ef;
1739
- background-color: var(--aquarium-colors-primary-40, #4cc2f7);
1733
+ .bg-navyBlue-100 {
1734
+ background-color: #30375e;
1735
+ background-color: var(--aquarium-colors-navyBlue-100, #30375e);
1740
1736
  }
1741
1737
  .bg-grey-5 {
1742
1738
  background-color: #ededf0;
1743
1739
  background-color: var(--aquarium-colors-grey-5, #ededf0);
1744
1740
  }
1745
- .bg-navyBlue-100 {
1746
- --tw-bg-opacity: 1;
1747
- background-color: rgb(48 55 94 / var(--tw-bg-opacity));
1748
- }
1749
1741
  .bg-info-50 {
1750
1742
  background-color: #28b4f4;
1751
1743
  background-color: var(--aquarium-colors-info-50, #28b4f4);
@@ -1782,6 +1774,10 @@ input[type='number'].no-arrows {
1782
1774
  background-color: currentColor;
1783
1775
  background-color: var(--aquarium-colors-current, currentColor);
1784
1776
  }
1777
+ .bg-primary-80 {
1778
+ background-color: #e41a4a;
1779
+ background-color: var(--aquarium-colors-primary-80, #0788d1);
1780
+ }
1785
1781
  .bg-transparent {
1786
1782
  background-color: transparent;
1787
1783
  background-color: var(--aquarium-colors-transparent, transparent);
@@ -1799,9 +1795,12 @@ input[type='number'].no-arrows {
1799
1795
  background-color: var(--aquarium-colors-error-20, #ffadb3);
1800
1796
  }
1801
1797
  .bg-primary-70 {
1802
- background-color: #5865cd;
1798
+ background-color: #ff3554;
1803
1799
  background-color: var(--aquarium-colors-primary-70, #0399e3);
1804
1800
  }
1801
+ .bg-opacity-40 {
1802
+ --tw-bg-opacity: 0.4;
1803
+ }
1805
1804
  .bg-gradient-to-r {
1806
1805
  background-image: linear-gradient(to right, var(--tw-gradient-stops));
1807
1806
  }
@@ -1820,6 +1819,10 @@ input[type='number'].no-arrows {
1820
1819
  .bg-cover {
1821
1820
  background-size: cover;
1822
1821
  }
1822
+ .stroke-grey-30 {
1823
+ stroke: #b4b4bb;
1824
+ stroke: var(--aquarium-colors-grey-30, #b4b4bb);
1825
+ }
1823
1826
  .object-cover {
1824
1827
  -o-object-fit: cover;
1825
1828
  object-fit: cover;
@@ -2278,53 +2281,57 @@ input[type='number'].no-arrows {
2278
2281
  color: var(--aquarium-colors-secondary-0, #fffbf8);
2279
2282
  }
2280
2283
  .text-primary-100 {
2281
- color: 0e1652;
2284
+ color: #a70045;
2282
2285
  color: var(--aquarium-colors-primary-100, #02569a);
2283
2286
  }
2284
2287
  .text-primary-90 {
2285
- color: #222f95;
2288
+ color: #c60443;
2286
2289
  color: var(--aquarium-colors-primary-90, #0174ba);
2287
2290
  }
2288
2291
  .text-primary-80 {
2289
- color: #3545be;
2292
+ color: #e41a4a;
2290
2293
  color: var(--aquarium-colors-primary-80, #0788d1);
2291
2294
  }
2292
2295
  .text-primary-70 {
2293
- color: #5865cd;
2296
+ color: #ff3554;
2294
2297
  color: var(--aquarium-colors-primary-70, #0399e3);
2295
2298
  }
2296
2299
  .text-primary-60 {
2297
- color: #818eec;
2300
+ color: #ff5275;
2298
2301
  color: var(--aquarium-colors-primary-60, #02a8f3);
2299
2302
  }
2300
2303
  .text-primary-50 {
2301
- color: #000000;
2304
+ color: #ff6f94;
2302
2305
  color: var(--aquarium-colors-primary-50, #28b4f4);
2303
2306
  }
2304
2307
  .text-primary-40 {
2305
- color: #b9c5ef;
2308
+ color: #ff8db0;
2306
2309
  color: var(--aquarium-colors-primary-40, #4cc2f7);
2307
2310
  }
2308
2311
  .text-primary-30 {
2309
- color: #000000;
2312
+ color: #ffa9c9;
2310
2313
  color: var(--aquarium-colors-primary-30, #7fd1f7);
2311
2314
  }
2312
2315
  .text-primary-20 {
2313
- color: #000000;
2316
+ color: #ffc4de;
2314
2317
  color: var(--aquarium-colors-primary-20, #b4e5fb);
2315
2318
  }
2316
2319
  .text-primary-10 {
2317
- color: #e3e9ff;
2320
+ color: #ffdeef;
2318
2321
  color: var(--aquarium-colors-primary-10, #e0f5fe);
2319
2322
  }
2320
2323
  .text-primary-5 {
2321
- color: #f3f6ff;
2324
+ color: #ffe8f4;
2322
2325
  color: var(--aquarium-colors-primary-5, #effaff);
2323
2326
  }
2324
2327
  .text-primary-0 {
2325
- color: #ffffff;
2328
+ color: #fff9fc;
2326
2329
  color: var(--aquarium-colors-primary-0, #f9fdff);
2327
2330
  }
2331
+ .text-navyBlue-100 {
2332
+ color: #30375e;
2333
+ color: var(--aquarium-colors-navyBlue-100, #30375e);
2334
+ }
2328
2335
  .text-transparent {
2329
2336
  color: transparent;
2330
2337
  color: var(--aquarium-colors-transparent, transparent);
@@ -2333,10 +2340,6 @@ input[type='number'].no-arrows {
2333
2340
  color: white;
2334
2341
  color: var(--aquarium-colors-white, white);
2335
2342
  }
2336
- .underline {
2337
- -webkit-text-decoration-line: underline;
2338
- text-decoration-line: underline;
2339
- }
2340
2343
  .no-underline {
2341
2344
  -webkit-text-decoration-line: none;
2342
2345
  text-decoration-line: none;
@@ -2344,6 +2347,9 @@ input[type='number'].no-arrows {
2344
2347
  .opacity-70 {
2345
2348
  opacity: 0.7;
2346
2349
  }
2350
+ .opacity-40 {
2351
+ opacity: 0.4;
2352
+ }
2347
2353
  .shadow-16dp {
2348
2354
  --tw-shadow: var(--aquarium-box-shadow-16dp, 0px 16px 32px rgba(90, 91, 106, 0.12), 0px 8px 16px rgba(58, 58, 68, 0.12));
2349
2355
  --tw-shadow-colored: 0px 16px 32px 0px var(--tw-shadow-color);
@@ -2387,9 +2393,6 @@ input[type='number'].no-arrows {
2387
2393
  .ring-inset {
2388
2394
  --tw-ring-inset: inset;
2389
2395
  }
2390
- .ring-primary-80 {
2391
- --tw-ring-color: var(--aquarium-colors-primary-80, #0788d1);
2392
- }
2393
2396
  .ring-grey-30 {
2394
2397
  --tw-ring-color: var(--aquarium-colors-grey-30, #b4b4bb);
2395
2398
  }
@@ -2483,24 +2486,16 @@ input[type='number'].no-arrows {
2483
2486
  margin-top: 0;
2484
2487
  }
2485
2488
  .visited\:text-primary-80:visited {
2486
- color: #3545be;
2489
+ color: #e41a4a;
2487
2490
  color: var(--aquarium-colors-primary-80, #0788d1);
2488
2491
  }
2489
- .checked\:border-primary-80:checked {
2490
- border-color: #3545be;
2491
- border-color: var(--aquarium-colors-primary-80, #0788d1);
2492
- }
2493
- .checked\:border-primary-40:checked {
2494
- border-color: #b9c5ef;
2495
- border-color: var(--aquarium-colors-primary-40, #4cc2f7);
2492
+ .checked\:border-navyBlue-100:checked {
2493
+ border-color: #30375e;
2494
+ border-color: var(--aquarium-colors-navyBlue-100, #30375e);
2496
2495
  }
2497
- .checked\:bg-primary-80:checked {
2498
- background-color: #3545be;
2499
- background-color: var(--aquarium-colors-primary-80, #0788d1);
2500
- }
2501
- .checked\:bg-primary-40:checked {
2502
- background-color: #b9c5ef;
2503
- background-color: var(--aquarium-colors-primary-40, #4cc2f7);
2496
+ .checked\:bg-navyBlue-100:checked {
2497
+ background-color: #30375e;
2498
+ background-color: var(--aquarium-colors-navyBlue-100, #30375e);
2504
2499
  }
2505
2500
  .checked\:bg-opacity-40:checked {
2506
2501
  --tw-bg-opacity: 0.4;
@@ -2538,7 +2533,7 @@ input[type='number'].no-arrows {
2538
2533
  background-color: var(--aquarium-colors-grey-30, #b4b4bb);
2539
2534
  }
2540
2535
  .hover\:bg-primary-70:hover {
2541
- background-color: #5865cd;
2536
+ background-color: #ff3554;
2542
2537
  background-color: var(--aquarium-colors-primary-70, #0399e3);
2543
2538
  }
2544
2539
  .hover\:bg-error-10:hover {
@@ -2550,7 +2545,7 @@ input[type='number'].no-arrows {
2550
2545
  background-color: var(--aquarium-colors-grey-10, #e1e1e3);
2551
2546
  }
2552
2547
  .hover\:text-primary-70:hover {
2553
- color: #5865cd;
2548
+ color: #ff3554;
2554
2549
  color: var(--aquarium-colors-primary-70, #0399e3);
2555
2550
  }
2556
2551
  .hover\:text-grey-80:hover {
@@ -2562,19 +2557,15 @@ input[type='number'].no-arrows {
2562
2557
  color: var(--aquarium-colors-grey-90, #292a31);
2563
2558
  }
2564
2559
  .hover\:text-primary-80:hover {
2565
- color: #3545be;
2560
+ color: #e41a4a;
2566
2561
  color: var(--aquarium-colors-primary-80, #0788d1);
2567
2562
  }
2568
- .hover\:no-underline:hover {
2569
- -webkit-text-decoration-line: none;
2570
- text-decoration-line: none;
2571
- }
2572
- .hover\:ring-primary-70:hover {
2573
- --tw-ring-color: var(--aquarium-colors-primary-70, #0399e3);
2563
+ .hover\:ring-grey-50:hover {
2564
+ --tw-ring-color: var(--aquarium-colors-grey-50, #787885);
2574
2565
  }
2575
- .hover\:checked\:bg-primary-80:checked:hover {
2576
- background-color: #3545be;
2577
- background-color: var(--aquarium-colors-primary-80, #0788d1);
2566
+ .hover\:checked\:bg-navyBlue-100:checked:hover {
2567
+ background-color: #30375e;
2568
+ background-color: var(--aquarium-colors-navyBlue-100, #30375e);
2578
2569
  }
2579
2570
  .focus\:border:focus {
2580
2571
  border-width: 1px;
@@ -2596,7 +2587,7 @@ input[type='number'].no-arrows {
2596
2587
  background-color: var(--aquarium-colors-grey-20, #d2d2d6);
2597
2588
  }
2598
2589
  .focus\:text-primary-80:focus {
2599
- color: #3545be;
2590
+ color: #e41a4a;
2600
2591
  color: var(--aquarium-colors-primary-80, #0788d1);
2601
2592
  }
2602
2593
  .focus\:outline-none:focus {
@@ -2643,21 +2634,13 @@ input[type='number'].no-arrows {
2643
2634
  background-color: #f7f7fa;
2644
2635
  background-color: var(--aquarium-colors-grey-0, #f7f7fa);
2645
2636
  }
2646
- .focus-visible\:text-primary-90.focus-visible {
2647
- color: #222f95;
2648
- color: var(--aquarium-colors-primary-90, #0174ba);
2649
- }
2650
- .focus-visible\:text-primary-90:focus-visible {
2651
- color: #222f95;
2652
- color: var(--aquarium-colors-primary-90, #0174ba);
2653
- }
2654
- .focus-visible\:text-primary-80.focus-visible {
2655
- color: #3545be;
2656
- color: var(--aquarium-colors-primary-80, #0788d1);
2637
+ .focus-visible\:text-grey-90.focus-visible {
2638
+ color: #292a31;
2639
+ color: var(--aquarium-colors-grey-90, #292a31);
2657
2640
  }
2658
- .focus-visible\:text-primary-80:focus-visible {
2659
- color: #3545be;
2660
- color: var(--aquarium-colors-primary-80, #0788d1);
2641
+ .focus-visible\:text-grey-90:focus-visible {
2642
+ color: #292a31;
2643
+ color: var(--aquarium-colors-grey-90, #292a31);
2661
2644
  }
2662
2645
  .focus-visible\:text-grey-80.focus-visible {
2663
2646
  color: #3a3a44;
@@ -2667,14 +2650,6 @@ input[type='number'].no-arrows {
2667
2650
  color: #3a3a44;
2668
2651
  color: var(--aquarium-colors-grey-80, #3a3a44);
2669
2652
  }
2670
- .focus-visible\:text-grey-90.focus-visible {
2671
- color: #292a31;
2672
- color: var(--aquarium-colors-grey-90, #292a31);
2673
- }
2674
- .focus-visible\:text-grey-90:focus-visible {
2675
- color: #292a31;
2676
- color: var(--aquarium-colors-grey-90, #292a31);
2677
- }
2678
2653
  .focus-visible\:outline-0.focus-visible {
2679
2654
  outline-width: 0px;
2680
2655
  }
@@ -2711,11 +2686,17 @@ input[type='number'].no-arrows {
2711
2686
  .focus-visible\:ring-inset:focus-visible {
2712
2687
  --tw-ring-inset: inset;
2713
2688
  }
2714
- .focus-visible\:ring-primary-90.focus-visible {
2715
- --tw-ring-color: var(--aquarium-colors-primary-90, #0174ba);
2689
+ .focus-visible\:ring-primary-100.focus-visible {
2690
+ --tw-ring-color: var(--aquarium-colors-primary-100, #02569a);
2716
2691
  }
2717
- .focus-visible\:ring-primary-90:focus-visible {
2718
- --tw-ring-color: var(--aquarium-colors-primary-90, #0174ba);
2692
+ .focus-visible\:ring-primary-100:focus-visible {
2693
+ --tw-ring-color: var(--aquarium-colors-primary-100, #02569a);
2694
+ }
2695
+ .focus-visible\:ring-grey-50.focus-visible {
2696
+ --tw-ring-color: var(--aquarium-colors-grey-50, #787885);
2697
+ }
2698
+ .focus-visible\:ring-grey-50:focus-visible {
2699
+ --tw-ring-color: var(--aquarium-colors-grey-50, #787885);
2719
2700
  }
2720
2701
  .focus-visible\:ring-info-70.focus-visible {
2721
2702
  --tw-ring-color: var(--aquarium-colors-info-70, #0399e3);
@@ -2728,13 +2709,9 @@ input[type='number'].no-arrows {
2728
2709
  background-color: var(--aquarium-colors-grey-5, #ededf0);
2729
2710
  }
2730
2711
  .active\:bg-primary-90:active {
2731
- background-color: #222f95;
2712
+ background-color: #c60443;
2732
2713
  background-color: var(--aquarium-colors-primary-90, #0174ba);
2733
2714
  }
2734
- .active\:bg-primary-5:active {
2735
- background-color: #f3f6ff;
2736
- background-color: var(--aquarium-colors-primary-5, #effaff);
2737
- }
2738
2715
  .active\:bg-transparent:active {
2739
2716
  background-color: transparent;
2740
2717
  background-color: var(--aquarium-colors-transparent, transparent);
@@ -2744,12 +2721,12 @@ input[type='number'].no-arrows {
2744
2721
  background-color: var(--aquarium-colors-grey-10, #e1e1e3);
2745
2722
  }
2746
2723
  .active\:text-primary-70:active {
2747
- color: #5865cd;
2724
+ color: #ff3554;
2748
2725
  color: var(--aquarium-colors-primary-70, #0399e3);
2749
2726
  }
2750
- .active\:text-primary-80:active {
2751
- color: #3545be;
2752
- color: var(--aquarium-colors-primary-80, #0788d1);
2727
+ .active\:text-grey-80:active {
2728
+ color: #3a3a44;
2729
+ color: var(--aquarium-colors-grey-80, #3a3a44);
2753
2730
  }
2754
2731
  .active\:text-grey-50:active {
2755
2732
  color: #787885;
@@ -2765,8 +2742,8 @@ input[type='number'].no-arrows {
2765
2742
  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), 0 0 rgba(0,0,0,0);
2766
2743
  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 rgba(0,0,0,0));
2767
2744
  }
2768
- .active\:ring-primary-90:active {
2769
- --tw-ring-color: var(--aquarium-colors-primary-90, #0174ba);
2745
+ .active\:ring-grey-50:active {
2746
+ --tw-ring-color: var(--aquarium-colors-grey-50, #787885);
2770
2747
  }
2771
2748
  .disabled\:cursor-not-allowed:disabled {
2772
2749
  cursor: not-allowed;
@@ -2779,9 +2756,13 @@ input[type='number'].no-arrows {
2779
2756
  background-color: #ededf0;
2780
2757
  background-color: var(--aquarium-colors-grey-5, #ededf0);
2781
2758
  }
2782
- .disabled\:bg-primary-40:disabled {
2783
- background-color: #b9c5ef;
2784
- background-color: var(--aquarium-colors-primary-40, #4cc2f7);
2759
+ .disabled\:bg-primary-5:disabled {
2760
+ background-color: #ffe8f4;
2761
+ background-color: var(--aquarium-colors-primary-5, #effaff);
2762
+ }
2763
+ .disabled\:bg-grey-0:disabled {
2764
+ background-color: #f7f7fa;
2765
+ background-color: var(--aquarium-colors-grey-0, #f7f7fa);
2785
2766
  }
2786
2767
  .disabled\:bg-transparent:disabled {
2787
2768
  background-color: transparent;
@@ -2792,7 +2773,7 @@ input[type='number'].no-arrows {
2792
2773
  color: var(--aquarium-colors-grey-40, #9696a0);
2793
2774
  }
2794
2775
  .disabled\:text-primary-40:disabled {
2795
- color: #b9c5ef;
2776
+ color: #ff8db0;
2796
2777
  color: var(--aquarium-colors-primary-40, #4cc2f7);
2797
2778
  }
2798
2779
  .disabled\:text-grey-30:disabled {
@@ -2803,8 +2784,8 @@ input[type='number'].no-arrows {
2803
2784
  color: #d2d2d6;
2804
2785
  color: var(--aquarium-colors-grey-20, #d2d2d6);
2805
2786
  }
2806
- .disabled\:ring-primary-40:disabled {
2807
- --tw-ring-color: var(--aquarium-colors-primary-40, #4cc2f7);
2787
+ .disabled\:ring-grey-20:disabled {
2788
+ --tw-ring-color: var(--aquarium-colors-grey-20, #d2d2d6);
2808
2789
  }
2809
2790
  .group:last-child .group-last\:border-b-0 {
2810
2791
  border-bottom-width: 0px;
@@ -2823,21 +2804,17 @@ input[type='number'].no-arrows {
2823
2804
  --tw-translate-x: 16px;
2824
2805
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
2825
2806
  }
2826
- .peer:checked~.peer-checked\:border-primary-80 {
2827
- border-color: #3545be;
2828
- border-color: var(--aquarium-colors-primary-80, #0788d1);
2829
- }
2830
- .peer:checked~.peer-checked\:border-primary-40 {
2831
- border-color: #b9c5ef;
2832
- border-color: var(--aquarium-colors-primary-40, #4cc2f7);
2807
+ .peer:checked~.peer-checked\:border-navyBlue-100 {
2808
+ border-color: #30375e;
2809
+ border-color: var(--aquarium-colors-navyBlue-100, #30375e);
2833
2810
  }
2834
2811
  .peer:checked~.peer-checked\:text-white {
2835
2812
  color: white;
2836
2813
  color: var(--aquarium-colors-white, white);
2837
2814
  }
2838
- .peer:checked~.peer-checked\:text-primary-10 {
2839
- color: #e3e9ff;
2840
- color: var(--aquarium-colors-primary-10, #e0f5fe);
2815
+ .peer:checked~.peer-checked\:text-grey-30 {
2816
+ color: #b4b4bb;
2817
+ color: var(--aquarium-colors-grey-30, #b4b4bb);
2841
2818
  }
2842
2819
  .peer:hover~.peer-hover\:border-grey-50 {
2843
2820
  border-color: #787885;
@@ -2869,9 +2846,9 @@ input[type='number'].no-arrows {
2869
2846
  stroke: white;
2870
2847
  stroke: var(--aquarium-colors-white, white);
2871
2848
  }
2872
- .peer:checked~.peer-checked\:\[\&\>path\]\:stroke-primary-10>path {
2873
- stroke: #e3e9ff;
2874
- stroke: var(--aquarium-colors-primary-10, #e0f5fe);
2849
+ .peer:checked~.peer-checked\:\[\&\>path\]\:stroke-grey-30>path {
2850
+ stroke: #b4b4bb;
2851
+ stroke: var(--aquarium-colors-grey-30, #b4b4bb);
2875
2852
  }
2876
2853
  .\[\&\>button\]\:p-0>button {
2877
2854
  padding: 0;