@neo4j-ndl/base 0.1.0 → 0.1.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -418,89 +418,242 @@ Ensure the default browser behavior of the `hidden` attribute.
418
418
  * You should have received a copy of the GNU General Public License
419
419
  * along with this program. If not, see <http://www.gnu.org/licenses/>.
420
420
  */
421
- code{
422
- font-family: "Fira Code";
423
- font-size: 14px;
424
- line-height: 20px;
421
+ /**
422
+ * Do not edit directly
423
+ * Generated on Mon, 14 Mar 2022 11:48:11 GMT
424
+ */
425
+ :root {
426
+ --border-radius-sm: 4px;
427
+ --border-radius-md: 6px;
428
+ --border-radius-lg: 8px;
429
+ --border-radius-xl: 10px;
430
+ --border-radius-1xl: 12px;
431
+ --border-radius-2xl: 14px;
432
+ --border-radius-3xl: 16px;
433
+ --border-radius-4xl: 18px;
434
+ --border-radius-5xl: 20px;
435
+ --border-radius-full: 9999px;;
436
+ --colors-primary-10: 230, 248, 255 /* #e6f8ff */; /* lighest shade of brand primary color */
437
+ --colors-primary-20: 163, 226, 255 /* #a3e2ff */;
438
+ --colors-primary-30: 122, 209, 255 /* #7ad1ff */;
439
+ --colors-primary-40: 1, 139, 255 /* #018bff */;
440
+ --colors-primary-50: 0, 111, 214 /* #006FD6 */;
441
+ --colors-primary-60: 0, 86, 179 /* #0056b3 */;
442
+ --colors-primary-70: 0, 64, 146 /* #004092 */;
443
+ --colors-danger-10: 255, 230, 233 /* #ffe6e9 */;
444
+ --colors-danger-20: 255, 184, 196 /* #ffb8c4 */;
445
+ --colors-danger-30: 255, 102, 138 /* #ff668a */;
446
+ --colors-danger-40: 237, 18, 82 /* #ed1252 */;
447
+ --colors-danger-50: 204, 37, 75 /* #cc254b */;
448
+ --colors-danger-60: 161, 0, 59 /* #a1003b */;
449
+ --colors-danger-70: 122, 0, 49 /* #7a0031 */;
450
+ --colors-success-10: 225, 250, 239 /* #E1FAEF */;
451
+ --colors-success-20: 152, 237, 203 /* #98EDCB */;
452
+ --colors-success-30: 68, 212, 164 /* #44D4A4 */;
453
+ --colors-success-40: 0, 186, 136 /* #00BA88 */;
454
+ --colors-success-50: 50, 125, 96 /* #327D60 */;
455
+ --colors-success-60: 0, 110, 88 /* #006E58 */;
456
+ --colors-success-70: 0, 71, 59 /* #00473B */;
457
+ --colors-warning-10: 255, 251, 222 /* #FFFBDE */;
458
+ --colors-warning-20: 255, 244, 181 /* #FFF4B5 */;
459
+ --colors-warning-30: 255, 234, 140 /* #FFEA8C */;
460
+ --colors-warning-40: 255, 222, 99 /* #FFDE63 */;
461
+ --colors-warning-50: 217, 181, 74 /* #D9B54A */;
462
+ --colors-warning-60: 150, 108, 46 /* #966c2e */;
463
+ --colors-warning-70: 102, 72, 23 /* #664817 */;
464
+ --colors-blueberry-10: 232, 235, 246 /* #E8EBF6 */;
465
+ --colors-blueberry-20: 196, 204, 233 /* #C4CCE9 */;
466
+ --colors-blueberry-30: 157, 171, 217 /* #9DABD9 */;
467
+ --colors-blueberry-40: 118, 138, 202 /* #768ACA */;
468
+ --colors-blueberry-50: 53, 87, 180 /* #3557B4 */;
469
+ --colors-blueberry-60: 37, 69, 158 /* #25459E */;
470
+ --colors-blueberry-70: 11, 41, 125 /* #0B297D */;
471
+ --colors-mint-10: 240, 255, 250 /* #F0FFFA */;
472
+ --colors-mint-20: 209, 255, 244 /* #D1FFF4 */;
473
+ --colors-mint-30: 168, 255, 238 /* #A8FFEE */;
474
+ --colors-mint-40: 85, 249, 226 /* #55F9E2 */;
475
+ --colors-mint-50: 61, 212, 197 /* #3DD4C5 */;
476
+ --colors-mint-60: 42, 173, 165 /* #2AADA5 */;
477
+ --colors-mint-70: 17, 97, 97 /* #116161 */;
478
+ --colors-neutral-10: 255, 255, 255 /* #FFFFFF */;
479
+ --colors-neutral-20: 245, 247, 250 /* #F5F7FA */;
480
+ --colors-neutral-30: 238, 241, 246 /* #EEF1F6 */;
481
+ --colors-neutral-40: 230, 233, 238 /* #E6E9EE */;
482
+ --colors-neutral-50: 196, 200, 205 /* #C4C8CD */;
483
+ --colors-neutral-60: 178, 183, 189 /* #B2B7BD */;
484
+ --colors-neutral-70: 113, 119, 128 /* #717780 */;
485
+ --colors-neutral-80: 83, 91, 102 /* #535B66 */;
486
+ --colors-neutral-90: 21, 30, 41 /* #151E29 */;
487
+ --font-size-h1: 48px;
488
+ --font-size-h2: 40px;
489
+ --font-size-h3: 30px;
490
+ --font-size-h4: 24px;
491
+ --font-size-h5: 20px;
492
+ --font-size-h6: 16px;
493
+ --font-size-subheading-large: 20px;
494
+ --font-size-subheading-medium: 16px;
495
+ --font-size-subheading-small: 14px;
496
+ --font-size-body-large: 16px;
497
+ --font-size-body-medium: 14px;
498
+ --font-size-body-small: 12px;
499
+ --font-size-code: 14px;
500
+ --font-size-label: 14px;
501
+ --font-weight-bold: 700;
502
+ --font-weight-semibold: 600;
503
+ --font-weight-normal: 400;
504
+ --font-weight-light: 300;
505
+ --palette-light-neutral-text-weakest: 178, 183, 189 /* #B2B7BD */;
506
+ --palette-light-neutral-text-weaker: 113, 119, 128 /* #717780 */;
507
+ --palette-light-neutral-text-weak: 83, 91, 102 /* #535B66 */;
508
+ --palette-light-neutral-text-default: 21, 30, 41 /* #151E29 */;
509
+ --palette-light-neutral-text-inverse: 255, 255, 255 /* #FFFFFF */;
510
+ --palette-light-neutral-bg-weak: 255, 255, 255 /* #FFFFFF */;
511
+ --palette-light-neutral-bg-default: 245, 247, 250 /* #F5F7FA */;
512
+ --palette-light-neutral-bg-strong: 230, 233, 238 /* #E6E9EE */;
513
+ --palette-light-neutral-bg-strongest: 83, 91, 102 /* #535B66 */;
514
+ --palette-light-neutral-border-weak: 238, 241, 246 /* #EEF1F6 */;
515
+ --palette-light-neutral-border-strong: 178, 183, 189 /* #B2B7BD */;
516
+ --palette-light-neutral-hover: rgba(113,119,128,0.1);
517
+ --palette-light-neutral-pressed: rgba(113,119,128,0.2);
518
+ --palette-light-primary-text: 0, 111, 214 /* #006FD6 */;
519
+ --palette-light-primary-icon: 0, 111, 214 /* #006FD6 */;
520
+ --palette-light-primary-bg-strong: 0, 111, 214 /* #006FD6 */;
521
+ --palette-light-primary-bg-weak: 230, 248, 255 /* #e6f8ff */;
522
+ --palette-light-primary-border-strong: 0, 111, 214 /* #006FD6 */;
523
+ --palette-light-primary-border-weak: 122, 209, 255 /* #7ad1ff */;
524
+ --palette-light-primary-focus: 1, 139, 255 /* #018bff */;
525
+ --palette-light-primary-hover-weak: rgba(1,139,255,0.08);
526
+ --palette-light-primary-hover-strong: 0, 86, 179 /* #0056b3 */;
527
+ --palette-light-primary-pressed-weak: rgba(1,139,255,0.12);
528
+ --palette-light-primary-pressed-strong: 0, 64, 146 /* #004092 */;
529
+ --palette-light-danger-text: 204, 37, 75 /* #cc254b */;
530
+ --palette-light-danger-icon: 204, 37, 75 /* #cc254b */;
531
+ --palette-light-danger-bg-strong: 204, 37, 75 /* #cc254b */;
532
+ --palette-light-danger-bg-weak: 255, 230, 233 /* #ffe6e9 */;
533
+ --palette-light-danger-border-strong: 204, 37, 75 /* #cc254b */;
534
+ --palette-light-danger-border-weak: 255, 184, 196 /* #ffb8c4 */;
535
+ --palette-light-danger-hover-weak: rgba(237,18,82,0.08);
536
+ --palette-light-danger-hover-strong: 161, 0, 59 /* #a1003b */;
537
+ --palette-light-danger-pressed-weak: rgba(237,18,82,0.12);
538
+ --palette-light-danger-pressed-strong: 122, 0, 49 /* #7a0031 */;
539
+ --palette-light-warning-text: 150, 108, 46 /* #966c2e */;
540
+ --palette-light-warning-icon: 150, 108, 46 /* #966c2e */;
541
+ --palette-light-warning-bg-strong: 150, 108, 46 /* #966c2e */;
542
+ --palette-light-warning-bg-weak: 255, 251, 222 /* #FFFBDE */;
543
+ --palette-light-warning-border-strong: 150, 108, 46 /* #966c2e */;
544
+ --palette-light-warning-border-weak: 255, 234, 140 /* #FFEA8C */;
545
+ --palette-light-success-text: 50, 125, 96 /* #327D60 */;
546
+ --palette-light-success-icon: 50, 125, 96 /* #327D60 */;
547
+ --palette-light-success-bg-strong: 50, 125, 96 /* #327D60 */;
548
+ --palette-light-success-bg-weak: 225, 250, 239 /* #E1FAEF */;
549
+ --palette-light-success-border-strong: 50, 125, 96 /* #327D60 */;
550
+ --palette-light-success-border-weak: 152, 237, 203 /* #98EDCB */;
551
+ --box-shadow-l2: 0px 1px 2px 0px rgba(12, 26, 37, 0.18);
552
+ --box-shadow-l3: 0px 4px 8px 0px rgba(12, 26, 37, 0.04);
553
+ --box-shadow-l4: 0px 4px 8px 0px rgba(12, 26, 37, 0.08);
554
+ --box-shadow-l5: 0px 8px 20px 0px rgba(12, 26, 37, 0.12);
555
+ --space-1: 0.25rem;
556
+ --space-2: 0.5rem;
557
+ --space-3: 0.75rem;
558
+ --space-4: 1rem;
559
+ --space-6: 1.5rem;
560
+ --space-8: 2rem;
561
+ --space-12: 3rem;
562
+ --space-16: 4rem;
563
+ --space-20: 5rem;
564
+ --space-24: 6rem;
565
+ --space-32: 8rem;
566
+ }
567
+ code,
568
+ .code {
569
+ font-size: var(--font-size-code);
570
+ font-weight: var(--font-weight-normal);
425
571
  letter-spacing: 0px;
572
+ line-height: 20px;
426
573
  }
427
- h1{
428
- font-size: 48px;
574
+ h1,
575
+ .h1 {
576
+ font-size: var(--font-size-h1);
577
+ font-weight: var(--font-weight-bold);
578
+ letter-spacing: 0.25px;
429
579
  line-height: 60px;
430
- letter-spacing: -0.25px;
431
- font-weight: 700;
432
580
  }
433
- h2{
434
- font-size: 40px;
435
- line-height: 48px;
581
+ h2,
582
+ .h2 {
583
+ font-size: var(--font-size-h2);
584
+ font-weight: var(--font-weight-bold);
436
585
  letter-spacing: 0px;
437
- font-weight: 700;
586
+ line-height: 60px;
438
587
  }
439
- h3{
440
- font-size: 30px;
441
- line-height: 40px;
588
+ h3,
589
+ .h3 {
590
+ font-size: var(--font-size-h3);
591
+ font-weight: var(--font-weight-bold);
442
592
  letter-spacing: 0.25px;
443
- font-weight: 700;
593
+ line-height: 40px;
444
594
  }
445
- h4{
446
- font-size: 24px;
447
- line-height: 32px;
595
+ h4,
596
+ .h4 {
597
+ font-size: var(--font-size-h4);
598
+ font-weight: var(--font-weight-bold);
448
599
  letter-spacing: 0.25px;
449
- font-weight: 700;
600
+ line-height: 32px;
450
601
  }
451
- h5{
452
- font-size: 20px;
453
- line-height: 28px;
602
+ h5,
603
+ .h5 {
604
+ font-size: var(--font-size-h5);
605
+ font-weight: var(--font-weight-bold);
454
606
  letter-spacing: 0.25px;
455
- font-weight: 700;
607
+ line-height: 28px;
456
608
  }
457
- h6{
458
- font-size: 16px;
459
- line-height: 24px;
609
+ h6,
610
+ .h6 {
611
+ font-size: var(--font-size-h6);
612
+ font-weight: var(--font-weight-bold);
460
613
  letter-spacing: 0.25px;
461
- font-weight: 700;
614
+ line-height: 24px;
462
615
  }
463
- .subheading-large{
464
- font-size: 20px;
465
- line-height: 28px;
616
+ .subheading-large {
617
+ font-size: var(--font-size-subheading-large);
618
+ font-weight: var(--font-weight-semibold);
466
619
  letter-spacing: 0.25px;
467
- font-weight: 600;
620
+ line-height: 28px;
468
621
  }
469
- .subheading-medium{
470
- font-size: 16px;
471
- line-height: 24px;
622
+ .subheading-medium {
623
+ font-size: var(--font-size-subheading-medium);
624
+ font-weight: var(--font-weight-semibold);
472
625
  letter-spacing: 0.25px;
473
- font-weight: 600;
626
+ line-height: 24px;
474
627
  }
475
- .subheading-small{
476
- font-size: 14px;
628
+ .subheading-small {
629
+ font-size: var(--font-size-subheading-small);
630
+ font-weight: var(--font-weight-semibold);
631
+ letter-spacing: 0.25px;
477
632
  line-height: 20px;
478
- letter-spacing: 0px;
479
- font-weight: 600;
480
633
  }
481
- .body-large{
482
- font-size: 16px;
634
+ .body-large {
635
+ font-size: var(--font-size-body-large);
636
+ font-weight: var(--font-weight-normal);
637
+ letter-spacing: 0.25px;
483
638
  line-height: 24px;
484
- letter-spacing: 0px;
485
- font-weight: 400;
486
639
  }
487
- .body-medium{
488
- font-size: 14px;
640
+ .body-medium {
641
+ font-size: var(--font-size-body-medium);
642
+ font-weight: var(--font-weight-normal);
643
+ letter-spacing: 0.25px;
489
644
  line-height: 20px;
490
- letter-spacing: 0px;
491
- font-weight: 400;
492
645
  }
493
- .body-small{
494
- font-size: 12px;
646
+ .body-small {
647
+ font-size: var(--font-size-body-small);
648
+ font-weight: var(--font-weight-normal);
649
+ letter-spacing: 0.25px;
495
650
  line-height: 20px;
496
- letter-spacing: 0px;
497
- font-weight: 400;
498
651
  }
499
- .label{
500
- font-size: 14px;
501
- line-height: 20px;
652
+ .label {
653
+ font-size: var(--font-size-label);
654
+ font-weight: var(--font-weight-bold);
502
655
  letter-spacing: 0px;
503
- font-weight: 700;
656
+ line-height: 20px;
504
657
  }
505
658
  /**
506
659
  *
@@ -572,9 +725,10 @@ h6{
572
725
  padding-right: 0.75rem;
573
726
  padding-top: 0.25rem;
574
727
  padding-bottom: 0.25rem;
575
- font-size: 14px;
576
- line-height: 20px;
728
+ font-size: var(--font-size-label);
729
+ font-weight: var(--font-weight-bold);
577
730
  letter-spacing: 0px;
731
+ line-height: 20px;
578
732
  }
579
733
  .ndl-btn.regular{
580
734
  height: 2.25rem;
@@ -582,9 +736,10 @@ h6{
582
736
  padding-right: 1.5rem;
583
737
  padding-top: 0.5rem;
584
738
  padding-bottom: 0.5rem;
585
- font-size: 14px;
586
- line-height: 20px;
739
+ font-size: var(--font-size-label);
740
+ font-weight: var(--font-weight-bold);
587
741
  letter-spacing: 0px;
742
+ line-height: 20px;
588
743
  }
589
744
  .ndl-btn.large{
590
745
  height: 3rem;
@@ -592,17 +747,25 @@ h6{
592
747
  padding-right: 1.5rem;
593
748
  padding-top: 0.75rem;
594
749
  padding-bottom: 0.75rem;
595
- font-size: 16px;
750
+ font-size: var(--font-size-h6);
751
+ font-weight: var(--font-weight-bold);
752
+ letter-spacing: 0.25px;
596
753
  line-height: 24px;
597
- letter-spacing: 0px;
598
754
  }
599
755
  .ndl-btn.rectangle{
600
756
  border-radius: 6px;
601
757
  }
602
- .ndl-btn.small.rectangle{
603
- width: 1.75rem;
604
- padding: 0.5rem;
605
- }
758
+ .ndl-btn.small.rectangle {
759
+ /* This padding value is important as it provides
760
+ 14px of space on small icon buttons for the icons
761
+ to render. This 14px of space is important as the
762
+ loading-spinner is hardcoded to 14px for its
763
+ small size, meaning we need 14px of space minimum
764
+ otherwise it overflows and is off center
765
+ */
766
+ padding: 0.375rem;
767
+ width: 1.75rem;
768
+ }
606
769
  .ndl-btn.regular.rectangle{
607
770
  width: 2.25rem;
608
771
  padding: 0.5rem;
@@ -667,19 +830,19 @@ a.ndl-btn{
667
830
  border-radius: 9999px;;
668
831
  padding-left: 0.5rem;
669
832
  padding-right: 0.5rem;
670
- font-size: 14px;
671
- line-height: 20px;
672
- letter-spacing: 0px;
673
833
  font-weight: 700;
674
834
  text-transform: capitalize;
675
835
  line-height: 1.25rem;
836
+ font-size: var(--font-size-label);
837
+ font-weight: var(--font-weight-bold);
838
+ letter-spacing: 0px;
839
+ line-height: 20px;
676
840
  }
677
841
  .ndl-label .label-content{
678
842
  display: flex;
679
843
  flex-direction: row;
680
844
  align-items: center;
681
845
  gap: 0.25rem;
682
- font-family: "Nunito Sans";
683
846
  }
684
847
  .ndl-label .label-content svg{
685
848
  height: 0.5rem;
@@ -716,11 +879,16 @@ a.ndl-btn{
716
879
  * along with this program. If not, see <http://www.gnu.org/licenses/>.
717
880
  */
718
881
  .ndl-tabs.underline {
719
- border-bottom-width: 1px;
720
882
  border-bottom-style: solid;
721
883
  --tw-border-opacity: 1;
722
884
  border-bottom-color: rgb(238 241 246 / var(--tw-border-opacity));
723
885
  }
886
+ .ndl-tabs.underline.small {
887
+ border-bottom-width: 1px;
888
+ }
889
+ .ndl-tabs.underline.large {
890
+ border-bottom-width: 2px;
891
+ }
724
892
  .ndl-tabs .tab {
725
893
  font-weight: 600;
726
894
  background: none;
@@ -731,18 +899,20 @@ a.ndl-btn{
731
899
  padding-right: 1rem;
732
900
  padding-top: 0.5rem;
733
901
  padding-bottom: 0.5rem;
734
- font-size: 16px;
735
- line-height: 24px;
736
- letter-spacing: 0px;
902
+ font-size: var(--font-size-subheading-medium);
903
+ font-weight: var(--font-weight-semibold);
904
+ letter-spacing: 0.25px;
905
+ line-height: 24px;
737
906
  }
738
907
  .ndl-tabs .tab.small{
739
908
  padding-left: 0.5rem;
740
909
  padding-right: 0.5rem;
741
910
  padding-top: 0.25rem;
742
911
  padding-bottom: 0.25rem;
743
- font-size: 14px;
912
+ font-size: var(--font-size-subheading-small);
913
+ font-weight: var(--font-weight-semibold);
914
+ letter-spacing: 0.25px;
744
915
  line-height: 20px;
745
- letter-spacing: 0px;
746
916
  }
747
917
  .ndl-tabs .tab.small:not(:first-child){
748
918
  margin-left: 0.25rem;
@@ -761,8 +931,13 @@ a.ndl-btn{
761
931
  --tw-text-opacity: 1;
762
932
  color: rgb(178 183 189 / var(--tw-text-opacity));
763
933
  }
764
- .ndl-tabs .tab.underline .tab-underline {
934
+ .ndl-tabs .tab.underline.small > .tab-underline {
765
935
  bottom: -1px;
936
+ }
937
+ .ndl-tabs .tab.underline.large > .tab-underline {
938
+ bottom: -2px;
939
+ }
940
+ .ndl-tabs .tab.underline .tab-underline {
766
941
  height: 4px;
767
942
  position: absolute;
768
943
  left: 0px;
@@ -864,10 +1039,10 @@ a.ndl-btn{
864
1039
  }
865
1040
  .ndl-alert.with-description .alert-title{
866
1041
  margin: 0px;
867
- font-size: 20px;
868
- line-height: 28px;
1042
+ font-size: var(--font-size-h5);
1043
+ font-weight: var(--font-weight-bold);
869
1044
  letter-spacing: 0.25px;
870
- font-weight: 700;
1045
+ line-height: 28px;
871
1046
  }
872
1047
  .ndl-alert .alert-icon{
873
1048
  height: 1.5rem;
@@ -889,12 +1064,12 @@ a.ndl-btn{
889
1064
  }
890
1065
  .ndl-alert .alert-actions a{
891
1066
  cursor: pointer;
892
- font-size: 16px;
893
- line-height: 24px;
894
- letter-spacing: 0px;
895
- font-weight: 700;
896
1067
  -webkit-text-decoration-line: underline;
897
1068
  text-decoration-line: underline;
1069
+ font-size: var(--font-size-label);
1070
+ font-weight: var(--font-weight-bold);
1071
+ letter-spacing: 0px;
1072
+ line-height: 20px;
898
1073
  }
899
1074
  .ndl-alert.info{
900
1075
  --tw-bg-opacity: 1;
@@ -981,11 +1156,12 @@ a.ndl-btn{
981
1156
  padding-right: 0.5rem;
982
1157
  padding-top: 0.75rem;
983
1158
  padding-bottom: 0.75rem;
984
- font-size: 12px;
985
- line-height: 20px;
986
- letter-spacing: 0px;
987
1159
  --tw-text-opacity: 1;
988
1160
  color: rgb(255 255 255 / var(--tw-text-opacity));
1161
+ font-size: var(--font-size-body-small);
1162
+ font-weight: var(--font-weight-normal);
1163
+ letter-spacing: 0.25px;
1164
+ line-height: 20px;
989
1165
  }
990
1166
  .ndl-tooltip-wrapper .tooltip-triangle{
991
1167
  position: absolute;
@@ -1374,45 +1550,51 @@ a.ndl-btn{
1374
1550
  .ndl-progress-bar-wrapper .details .estimated-time{
1375
1551
  font-weight: 600;
1376
1552
  }
1377
- .ndl-progress-bar-wrapper.large .heading{
1378
- font-size: 16px;
1553
+ .ndl-progress-bar-wrapper.large .heading {
1554
+ font-size: var(--font-size-body-large);
1555
+ font-weight: var(--font-weight-normal);
1556
+ letter-spacing: 0.25px;
1379
1557
  line-height: 24px;
1380
- letter-spacing: 0px;
1381
1558
  }
1382
- .ndl-progress-bar-wrapper.large .progress-number{
1383
- font-size: 16px;
1384
- line-height: 24px;
1559
+ .ndl-progress-bar-wrapper.large .progress-number {
1560
+ font-size: var(--font-size-h6);
1561
+ font-weight: var(--font-weight-bold);
1385
1562
  letter-spacing: 0.25px;
1563
+ line-height: 24px;
1386
1564
  }
1387
1565
  .ndl-progress-bar-wrapper.large .progress-bar-container, .ndl-progress-bar-wrapper.large .progress-bar{
1388
1566
  height: 0.5rem;
1389
1567
  min-width: 3%;
1390
1568
  border-radius: 6px;
1391
1569
  }
1392
- .ndl-progress-bar-wrapper.large .details{
1393
- font-size: 14px;
1570
+ .ndl-progress-bar-wrapper.large .details {
1571
+ font-size: var(--font-size-body-medium);
1572
+ font-weight: var(--font-weight-normal);
1573
+ letter-spacing: 0.25px;
1394
1574
  line-height: 20px;
1395
- letter-spacing: 0px;
1396
1575
  }
1397
- .ndl-progress-bar-wrapper.small .heading{
1398
- font-size: 14px;
1576
+ .ndl-progress-bar-wrapper.small .heading {
1577
+ font-size: var(--font-size-body-medium);
1578
+ font-weight: var(--font-weight-normal);
1579
+ letter-spacing: 0.25px;
1399
1580
  line-height: 20px;
1400
- letter-spacing: 0px;
1401
1581
  }
1402
- .ndl-progress-bar-wrapper.small .progress-number{
1403
- font-size: 14px;
1582
+ .ndl-progress-bar-wrapper.small .progress-number {
1583
+ font-size: var(--font-size-body-medium);
1584
+ font-weight: var(--font-weight-normal);
1585
+ letter-spacing: 0.25px;
1404
1586
  line-height: 20px;
1405
- letter-spacing: 0px;
1406
1587
  }
1407
1588
  .ndl-progress-bar-wrapper.small .progress-bar-container, .ndl-progress-bar-wrapper.small .progress-bar{
1408
1589
  height: 0.25rem;
1409
1590
  min-width: 2%;
1410
1591
  border-radius: 4px;
1411
1592
  }
1412
- .ndl-progress-bar-wrapper.small .details{
1413
- font-size: 12px;
1593
+ .ndl-progress-bar-wrapper.small .details {
1594
+ font-size: var(--font-size-body-small);
1595
+ font-weight: var(--font-weight-normal);
1596
+ letter-spacing: 0.25px;
1414
1597
  line-height: 20px;
1415
- letter-spacing: 0px;
1416
1598
  }
1417
1599
  /**
1418
1600
  *
@@ -1447,9 +1629,10 @@ a.ndl-btn{
1447
1629
  padding-bottom: 0.5rem;
1448
1630
  --tw-bg-opacity: 1;
1449
1631
  background-color: rgb(245 247 250 / var(--tw-bg-opacity));
1450
- font-size: 14px;
1632
+ font-size: var(--font-size-body-medium);
1633
+ font-weight: var(--font-weight-normal);
1634
+ letter-spacing: 0.25px;
1451
1635
  line-height: 20px;
1452
- letter-spacing: 0px;
1453
1636
  }
1454
1637
  .ndl-tag .remove-icon{
1455
1638
  height: 1rem;
@@ -1494,15 +1677,17 @@ a.ndl-btn{
1494
1677
  }
1495
1678
  .ndl-menu.large .menu-item-title{
1496
1679
  width: 100%;
1497
- font-size: 16px;
1498
- line-height: 24px;
1680
+ font-size: var(--font-size-h6);
1681
+ font-weight: var(--font-weight-bold);
1499
1682
  letter-spacing: 0.25px;
1683
+ line-height: 24px;
1500
1684
  }
1501
1685
  .ndl-menu.large .menu-item-description{
1502
1686
  padding-top: 0.25rem;
1503
- font-size: 14px;
1687
+ font-size: var(--font-size-body-medium);
1688
+ font-weight: var(--font-weight-normal);
1689
+ letter-spacing: 0.25px;
1504
1690
  line-height: 20px;
1505
- letter-spacing: 0px;
1506
1691
  }
1507
1692
  .ndl-menu.large .menu-item-icon{
1508
1693
  height: 1rem;
@@ -1512,20 +1697,23 @@ a.ndl-btn{
1512
1697
  padding-left: 1.25rem;
1513
1698
  padding-right: 1.25rem;
1514
1699
  padding-top: 0.75rem;
1515
- font-size: 16px;
1516
- line-height: 24px;
1700
+ font-size: var(--font-size-h6);
1701
+ font-weight: var(--font-weight-bold);
1517
1702
  letter-spacing: 0.25px;
1703
+ line-height: 24px;
1518
1704
  }
1519
- .ndl-menu.large .menu-header .menu-header-title{
1520
- font-size: 20px;
1521
- line-height: 28px;
1705
+ .ndl-menu.large .menu-header .menu-header-title {
1706
+ font-size: var(--font-size-h5);
1707
+ font-weight: var(--font-weight-bold);
1522
1708
  letter-spacing: 0.25px;
1709
+ line-height: 28px;
1523
1710
  }
1524
1711
  .ndl-menu.large .menu-header .menu-header-description{
1525
1712
  padding-top: 0.25rem;
1526
- font-size: 14px;
1713
+ font-size: var(--font-size-body-medium);
1714
+ font-weight: var(--font-weight-normal);
1715
+ letter-spacing: 0.25px;
1527
1716
  line-height: 20px;
1528
- letter-spacing: 0px;
1529
1717
  }
1530
1718
  .ndl-menu.large .menu-header .menu-header-icon {
1531
1719
  width: 22px;
@@ -1541,11 +1729,12 @@ a.ndl-btn{
1541
1729
  z-index: 2;
1542
1730
  cursor: pointer;
1543
1731
  padding: 0.5rem;
1544
- font-size: 14px;
1545
- line-height: 20px;
1546
- letter-spacing: 0px;
1547
1732
  outline: 2px solid transparent;
1548
1733
  outline-offset: 2px;
1734
+ font-size: var(--font-size-body-medium);
1735
+ font-weight: var(--font-weight-normal);
1736
+ letter-spacing: 0.25px;
1737
+ line-height: 20px;
1549
1738
  }
1550
1739
  .ndl-menu .menu-item:hover:not(.disabled), .ndl-menu .menu-item:focus-visible{
1551
1740
  border-radius: 8px;
@@ -1565,16 +1754,18 @@ a.ndl-btn{
1565
1754
  }
1566
1755
  .ndl-menu .menu-item-title{
1567
1756
  width: 100%;
1568
- font-size: 14px;
1757
+ font-size: var(--font-size-body-medium);
1758
+ font-weight: var(--font-weight-normal);
1759
+ letter-spacing: 0.25px;
1569
1760
  line-height: 20px;
1570
- letter-spacing: 0px;
1571
1761
  }
1572
1762
  .ndl-menu .menu-item-description{
1573
- font-size: 12px;
1574
- line-height: 20px;
1575
- letter-spacing: 0px;
1576
1763
  --tw-text-opacity: 1;
1577
1764
  color: rgb(113 119 128 / var(--tw-text-opacity));
1765
+ font-size: var(--font-size-body-small);
1766
+ font-weight: var(--font-weight-normal);
1767
+ letter-spacing: 0.25px;
1768
+ line-height: 20px;
1578
1769
  }
1579
1770
  .ndl-menu .menu-item-icon{
1580
1771
  margin-right: 0.5rem;
@@ -1588,17 +1779,19 @@ a.ndl-btn{
1588
1779
  padding-top: 0.5rem;
1589
1780
  }
1590
1781
  .ndl-menu .menu-header .menu-header-title{
1591
- font-size: 16px;
1592
- line-height: 24px;
1593
- letter-spacing: 0.25px;
1594
1782
  font-weight: 700;
1783
+ font-size: var(--font-size-h6);
1784
+ font-weight: var(--font-weight-bold);
1785
+ letter-spacing: 0.25px;
1786
+ line-height: 24px;
1595
1787
  }
1596
1788
  .ndl-menu .menu-header .menu-header-description{
1597
- font-size: 12px;
1598
- line-height: 20px;
1599
- letter-spacing: 0px;
1600
1789
  --tw-text-opacity: 1;
1601
1790
  color: rgb(113 119 128 / var(--tw-text-opacity));
1791
+ font-size: var(--font-size-body-small);
1792
+ font-weight: var(--font-weight-normal);
1793
+ letter-spacing: 0.25px;
1794
+ line-height: 20px;
1602
1795
  }
1603
1796
  .ndl-menu .menu-header .menu-header-icon {
1604
1797
  width: 17px;
@@ -1729,9 +1922,10 @@ a.ndl-btn{
1729
1922
  }
1730
1923
  .ndl-view-selector.large{
1731
1924
  height: 3rem;
1732
- font-size: 16px;
1733
- line-height: 24px;
1925
+ font-size: var(--font-size-subheading-medium);
1926
+ font-weight: var(--font-weight-semibold);
1734
1927
  letter-spacing: 0.25px;
1928
+ line-height: 24px;
1735
1929
  }
1736
1930
  .ndl-view-selector.large .selector-item{
1737
1931
  padding-left: 1rem;
@@ -1747,9 +1941,10 @@ a.ndl-btn{
1747
1941
  }
1748
1942
  .ndl-view-selector.small{
1749
1943
  height: 2.25rem;
1750
- font-size: 14px;
1944
+ font-size: var(--font-size-subheading-small);
1945
+ font-weight: var(--font-weight-semibold);
1946
+ letter-spacing: 0.25px;
1751
1947
  line-height: 20px;
1752
- letter-spacing: 0px;
1753
1948
  }
1754
1949
  .ndl-view-selector.small .selector-item{
1755
1950
  padding-left: 0.75rem;
@@ -1844,6 +2039,10 @@ a.ndl-btn{
1844
2039
  margin-top: 0.5rem;
1845
2040
  margin-bottom: 0.5rem;
1846
2041
  }
2042
+ .n-my-auto{
2043
+ margin-top: auto;
2044
+ margin-bottom: auto;
2045
+ }
1847
2046
  .n-mx-4{
1848
2047
  margin-left: 1rem;
1849
2048
  margin-right: 1rem;
@@ -1852,6 +2051,10 @@ a.ndl-btn{
1852
2051
  margin-top: 1.25rem;
1853
2052
  margin-bottom: 1.25rem;
1854
2053
  }
2054
+ .n-mx-3{
2055
+ margin-left: 0.75rem;
2056
+ margin-right: 0.75rem;
2057
+ }
1855
2058
  .n-mr-1{
1856
2059
  margin-right: 0.25rem;
1857
2060
  }
@@ -1870,6 +2073,9 @@ a.ndl-btn{
1870
2073
  .n-h-5{
1871
2074
  height: 1.25rem;
1872
2075
  }
2076
+ .n-h-4{
2077
+ height: 1rem;
2078
+ }
1873
2079
  .n-h-10{
1874
2080
  height: 2.5rem;
1875
2081
  }
@@ -1882,12 +2088,15 @@ a.ndl-btn{
1882
2088
  .n-h-12{
1883
2089
  height: 3rem;
1884
2090
  }
1885
- .n-h-52{
1886
- height: 13rem;
2091
+ .n-h-36{
2092
+ height: 9rem;
1887
2093
  }
1888
2094
  .n-w-5{
1889
2095
  width: 1.25rem;
1890
2096
  }
2097
+ .n-w-4{
2098
+ width: 1rem;
2099
+ }
1891
2100
  .n-w-10{
1892
2101
  width: 2.5rem;
1893
2102
  }
@@ -1897,11 +2106,11 @@ a.ndl-btn{
1897
2106
  .n-w-full{
1898
2107
  width: 100%;
1899
2108
  }
1900
- .n-w-60{
1901
- width: 15rem;
2109
+ .n-w-48{
2110
+ width: 12rem;
1902
2111
  }
1903
- .n-w-52{
1904
- width: 13rem;
2112
+ .n-w-36{
2113
+ width: 9rem;
1905
2114
  }
1906
2115
  .n-transform{
1907
2116
  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));
@@ -1927,9 +2136,6 @@ a.ndl-btn{
1927
2136
  .n-gap-12{
1928
2137
  gap: 3rem;
1929
2138
  }
1930
- .n-gap-2{
1931
- gap: 0.5rem;
1932
- }
1933
2139
  .n-gap-x-12{
1934
2140
  -moz-column-gap: 3rem;
1935
2141
  column-gap: 3rem;
@@ -1953,9 +2159,15 @@ a.ndl-btn{
1953
2159
  .n-whitespace-nowrap{
1954
2160
  white-space: nowrap;
1955
2161
  }
2162
+ .n-rounded-sm{
2163
+ border-radius: 4px;
2164
+ }
1956
2165
  .n-rounded-lg{
1957
2166
  border-radius: 8px;
1958
2167
  }
2168
+ .n-rounded-md{
2169
+ border-radius: 6px;
2170
+ }
1959
2171
  .n-border-neutral-70{
1960
2172
  --tw-border-opacity: 1;
1961
2173
  border-color: rgb(113 119 128 / var(--tw-border-opacity));
@@ -2172,106 +2384,299 @@ a.ndl-btn{
2172
2384
  --tw-bg-opacity: 1;
2173
2385
  background-color: rgb(21 30 41 / var(--tw-bg-opacity));
2174
2386
  }
2175
- .n-p-4{
2176
- padding: 1rem;
2387
+ .n-bg-light-neutral-text-weakest{
2388
+ --tw-bg-opacity: 1;
2389
+ background-color: rgb(178 183 189 / var(--tw-bg-opacity));
2177
2390
  }
2178
- .n-p-14{
2179
- padding: 3.5rem;
2391
+ .n-bg-light-neutral-text-weaker{
2392
+ --tw-bg-opacity: 1;
2393
+ background-color: rgb(113 119 128 / var(--tw-bg-opacity));
2180
2394
  }
2181
- .n-px-3{
2182
- padding-left: 0.75rem;
2183
- padding-right: 0.75rem;
2395
+ .n-bg-light-neutral-text-weak{
2396
+ --tw-bg-opacity: 1;
2397
+ background-color: rgb(83 91 102 / var(--tw-bg-opacity));
2184
2398
  }
2185
- .n-px-8{
2186
- padding-left: 2rem;
2187
- padding-right: 2rem;
2399
+ .n-bg-light-neutral-text-default{
2400
+ --tw-bg-opacity: 1;
2401
+ background-color: rgb(21 30 41 / var(--tw-bg-opacity));
2188
2402
  }
2189
- .n-font-sans{
2190
- font-family: "Nunito Sans";
2403
+ .n-bg-light-neutral-text-inverse{
2404
+ --tw-bg-opacity: 1;
2405
+ background-color: rgb(255 255 255 / var(--tw-bg-opacity));
2191
2406
  }
2192
- .n-text-body-medium{
2193
- font-size: 14px;
2194
- line-height: 20px;
2195
- letter-spacing: 0px;
2407
+ .n-bg-light-neutral-bg-weak{
2408
+ --tw-bg-opacity: 1;
2409
+ background-color: rgb(255 255 255 / var(--tw-bg-opacity));
2196
2410
  }
2197
- .n-capitalize{
2198
- text-transform: capitalize;
2411
+ .n-bg-light-neutral-bg-default{
2412
+ --tw-bg-opacity: 1;
2413
+ background-color: rgb(245 247 250 / var(--tw-bg-opacity));
2199
2414
  }
2200
- .n-text-primary-10{
2201
- --tw-text-opacity: 1;
2202
- color: rgb(230 248 255 / var(--tw-text-opacity));
2415
+ .n-bg-light-neutral-bg-strong{
2416
+ --tw-bg-opacity: 1;
2417
+ background-color: rgb(230 233 238 / var(--tw-bg-opacity));
2203
2418
  }
2204
- .n-text-primary-20{
2205
- --tw-text-opacity: 1;
2206
- color: rgb(163 226 255 / var(--tw-text-opacity));
2419
+ .n-bg-light-neutral-bg-strongest{
2420
+ --tw-bg-opacity: 1;
2421
+ background-color: rgb(83 91 102 / var(--tw-bg-opacity));
2207
2422
  }
2208
- .n-text-primary-30{
2209
- --tw-text-opacity: 1;
2210
- color: rgb(122 209 255 / var(--tw-text-opacity));
2423
+ .n-bg-light-neutral-border-weak{
2424
+ --tw-bg-opacity: 1;
2425
+ background-color: rgb(238 241 246 / var(--tw-bg-opacity));
2211
2426
  }
2212
- .n-text-primary-40{
2213
- --tw-text-opacity: 1;
2214
- color: rgb(1 139 255 / var(--tw-text-opacity));
2427
+ .n-bg-light-neutral-border-strong{
2428
+ --tw-bg-opacity: 1;
2429
+ background-color: rgb(178 183 189 / var(--tw-bg-opacity));
2215
2430
  }
2216
- .n-text-primary-50{
2217
- --tw-text-opacity: 1;
2218
- color: rgb(0 111 214 / var(--tw-text-opacity));
2431
+ .n-bg-light-neutral-hover{
2432
+ background-color: rgba(113,119,128,0.1);
2219
2433
  }
2220
- .n-text-primary-60{
2221
- --tw-text-opacity: 1;
2222
- color: rgb(0 86 179 / var(--tw-text-opacity));
2434
+ .n-bg-light-neutral-pressed{
2435
+ background-color: rgba(113,119,128,0.2);
2223
2436
  }
2224
- .n-text-primary-70{
2225
- --tw-text-opacity: 1;
2226
- color: rgb(0 64 146 / var(--tw-text-opacity));
2437
+ .n-bg-light-primary-text{
2438
+ --tw-bg-opacity: 1;
2439
+ background-color: rgb(0 111 214 / var(--tw-bg-opacity));
2227
2440
  }
2228
- .n-text-danger-10{
2229
- --tw-text-opacity: 1;
2230
- color: rgb(255 230 233 / var(--tw-text-opacity));
2441
+ .n-bg-light-primary-icon{
2442
+ --tw-bg-opacity: 1;
2443
+ background-color: rgb(0 111 214 / var(--tw-bg-opacity));
2231
2444
  }
2232
- .n-text-danger-20{
2233
- --tw-text-opacity: 1;
2234
- color: rgb(255 184 196 / var(--tw-text-opacity));
2445
+ .n-bg-light-primary-bg-strong{
2446
+ --tw-bg-opacity: 1;
2447
+ background-color: rgb(0 111 214 / var(--tw-bg-opacity));
2235
2448
  }
2236
- .n-text-danger-30{
2237
- --tw-text-opacity: 1;
2238
- color: rgb(255 102 138 / var(--tw-text-opacity));
2449
+ .n-bg-light-primary-bg-weak{
2450
+ --tw-bg-opacity: 1;
2451
+ background-color: rgb(230 248 255 / var(--tw-bg-opacity));
2239
2452
  }
2240
- .n-text-danger-40{
2241
- --tw-text-opacity: 1;
2242
- color: rgb(237 18 82 / var(--tw-text-opacity));
2453
+ .n-bg-light-primary-border-strong{
2454
+ --tw-bg-opacity: 1;
2455
+ background-color: rgb(0 111 214 / var(--tw-bg-opacity));
2243
2456
  }
2244
- .n-text-danger-50{
2245
- --tw-text-opacity: 1;
2246
- color: rgb(204 37 75 / var(--tw-text-opacity));
2457
+ .n-bg-light-primary-border-weak{
2458
+ --tw-bg-opacity: 1;
2459
+ background-color: rgb(122 209 255 / var(--tw-bg-opacity));
2247
2460
  }
2248
- .n-text-danger-60{
2249
- --tw-text-opacity: 1;
2250
- color: rgb(161 0 59 / var(--tw-text-opacity));
2461
+ .n-bg-light-primary-focus{
2462
+ --tw-bg-opacity: 1;
2463
+ background-color: rgb(1 139 255 / var(--tw-bg-opacity));
2251
2464
  }
2252
- .n-text-danger-70{
2253
- --tw-text-opacity: 1;
2254
- color: rgb(122 0 49 / var(--tw-text-opacity));
2465
+ .n-bg-light-primary-hover-weak{
2466
+ background-color: rgba(1,139,255,0.08);
2255
2467
  }
2256
- .n-text-success-10{
2257
- --tw-text-opacity: 1;
2258
- color: rgb(225 250 239 / var(--tw-text-opacity));
2468
+ .n-bg-light-primary-hover-strong{
2469
+ --tw-bg-opacity: 1;
2470
+ background-color: rgb(0 86 179 / var(--tw-bg-opacity));
2259
2471
  }
2260
- .n-text-success-20{
2261
- --tw-text-opacity: 1;
2262
- color: rgb(152 237 203 / var(--tw-text-opacity));
2472
+ .n-bg-light-primary-pressed-weak{
2473
+ background-color: rgba(1,139,255,0.12);
2263
2474
  }
2264
- .n-text-success-30{
2265
- --tw-text-opacity: 1;
2266
- color: rgb(68 212 164 / var(--tw-text-opacity));
2475
+ .n-bg-light-primary-pressed-strong{
2476
+ --tw-bg-opacity: 1;
2477
+ background-color: rgb(0 64 146 / var(--tw-bg-opacity));
2267
2478
  }
2268
- .n-text-success-40{
2269
- --tw-text-opacity: 1;
2270
- color: rgb(0 186 136 / var(--tw-text-opacity));
2479
+ .n-bg-light-danger-text{
2480
+ --tw-bg-opacity: 1;
2481
+ background-color: rgb(204 37 75 / var(--tw-bg-opacity));
2271
2482
  }
2272
- .n-text-success-50{
2273
- --tw-text-opacity: 1;
2274
- color: rgb(50 125 96 / var(--tw-text-opacity));
2483
+ .n-bg-light-danger-icon{
2484
+ --tw-bg-opacity: 1;
2485
+ background-color: rgb(204 37 75 / var(--tw-bg-opacity));
2486
+ }
2487
+ .n-bg-light-danger-bg-strong{
2488
+ --tw-bg-opacity: 1;
2489
+ background-color: rgb(204 37 75 / var(--tw-bg-opacity));
2490
+ }
2491
+ .n-bg-light-danger-bg-weak{
2492
+ --tw-bg-opacity: 1;
2493
+ background-color: rgb(255 230 233 / var(--tw-bg-opacity));
2494
+ }
2495
+ .n-bg-light-danger-border-strong{
2496
+ --tw-bg-opacity: 1;
2497
+ background-color: rgb(204 37 75 / var(--tw-bg-opacity));
2498
+ }
2499
+ .n-bg-light-danger-border-weak{
2500
+ --tw-bg-opacity: 1;
2501
+ background-color: rgb(255 184 196 / var(--tw-bg-opacity));
2502
+ }
2503
+ .n-bg-light-danger-hover-weak{
2504
+ background-color: rgba(237,18,82,0.08);
2505
+ }
2506
+ .n-bg-light-danger-hover-strong{
2507
+ --tw-bg-opacity: 1;
2508
+ background-color: rgb(161 0 59 / var(--tw-bg-opacity));
2509
+ }
2510
+ .n-bg-light-danger-pressed-weak{
2511
+ background-color: rgba(237,18,82,0.12);
2512
+ }
2513
+ .n-bg-light-danger-pressed-strong{
2514
+ --tw-bg-opacity: 1;
2515
+ background-color: rgb(122 0 49 / var(--tw-bg-opacity));
2516
+ }
2517
+ .n-bg-light-warning-text{
2518
+ --tw-bg-opacity: 1;
2519
+ background-color: rgb(150 108 46 / var(--tw-bg-opacity));
2520
+ }
2521
+ .n-bg-light-warning-icon{
2522
+ --tw-bg-opacity: 1;
2523
+ background-color: rgb(150 108 46 / var(--tw-bg-opacity));
2524
+ }
2525
+ .n-bg-light-warning-bg-strong{
2526
+ --tw-bg-opacity: 1;
2527
+ background-color: rgb(150 108 46 / var(--tw-bg-opacity));
2528
+ }
2529
+ .n-bg-light-warning-bg-weak{
2530
+ --tw-bg-opacity: 1;
2531
+ background-color: rgb(255 251 222 / var(--tw-bg-opacity));
2532
+ }
2533
+ .n-bg-light-warning-border-strong{
2534
+ --tw-bg-opacity: 1;
2535
+ background-color: rgb(150 108 46 / var(--tw-bg-opacity));
2536
+ }
2537
+ .n-bg-light-warning-border-weak{
2538
+ --tw-bg-opacity: 1;
2539
+ background-color: rgb(255 234 140 / var(--tw-bg-opacity));
2540
+ }
2541
+ .n-bg-light-success-text{
2542
+ --tw-bg-opacity: 1;
2543
+ background-color: rgb(50 125 96 / var(--tw-bg-opacity));
2544
+ }
2545
+ .n-bg-light-success-icon{
2546
+ --tw-bg-opacity: 1;
2547
+ background-color: rgb(50 125 96 / var(--tw-bg-opacity));
2548
+ }
2549
+ .n-bg-light-success-bg-strong{
2550
+ --tw-bg-opacity: 1;
2551
+ background-color: rgb(50 125 96 / var(--tw-bg-opacity));
2552
+ }
2553
+ .n-bg-light-success-bg-weak{
2554
+ --tw-bg-opacity: 1;
2555
+ background-color: rgb(225 250 239 / var(--tw-bg-opacity));
2556
+ }
2557
+ .n-bg-light-success-border-strong{
2558
+ --tw-bg-opacity: 1;
2559
+ background-color: rgb(50 125 96 / var(--tw-bg-opacity));
2560
+ }
2561
+ .n-bg-light-success-border-weak{
2562
+ --tw-bg-opacity: 1;
2563
+ background-color: rgb(152 237 203 / var(--tw-bg-opacity));
2564
+ }
2565
+ .n-bg-transparent{
2566
+ background-color: transparent;
2567
+ }
2568
+ .n-p-4{
2569
+ padding: 1rem;
2570
+ }
2571
+ .n-p-14{
2572
+ padding: 3.5rem;
2573
+ }
2574
+ .n-px-3{
2575
+ padding-left: 0.75rem;
2576
+ padding-right: 0.75rem;
2577
+ }
2578
+ .n-px-8{
2579
+ padding-left: 2rem;
2580
+ padding-right: 2rem;
2581
+ }
2582
+ .n-px-10{
2583
+ padding-left: 2.5rem;
2584
+ padding-right: 2.5rem;
2585
+ }
2586
+ .n-font-sans{
2587
+ font-family: "Nunito Sans";
2588
+ }
2589
+ .n-text-xs{
2590
+ font-size: 0.75rem;
2591
+ line-height: 1rem;
2592
+ }
2593
+ .n-font-semibold{
2594
+ font-weight: 600;
2595
+ }
2596
+ .n-uppercase{
2597
+ text-transform: uppercase;
2598
+ }
2599
+ .n-capitalize{
2600
+ text-transform: capitalize;
2601
+ }
2602
+ .n-tracking-wide{
2603
+ letter-spacing: 0.025em;
2604
+ }
2605
+ .n-text-primary-10{
2606
+ --tw-text-opacity: 1;
2607
+ color: rgb(230 248 255 / var(--tw-text-opacity));
2608
+ }
2609
+ .n-text-primary-20{
2610
+ --tw-text-opacity: 1;
2611
+ color: rgb(163 226 255 / var(--tw-text-opacity));
2612
+ }
2613
+ .n-text-primary-30{
2614
+ --tw-text-opacity: 1;
2615
+ color: rgb(122 209 255 / var(--tw-text-opacity));
2616
+ }
2617
+ .n-text-primary-40{
2618
+ --tw-text-opacity: 1;
2619
+ color: rgb(1 139 255 / var(--tw-text-opacity));
2620
+ }
2621
+ .n-text-primary-50{
2622
+ --tw-text-opacity: 1;
2623
+ color: rgb(0 111 214 / var(--tw-text-opacity));
2624
+ }
2625
+ .n-text-primary-60{
2626
+ --tw-text-opacity: 1;
2627
+ color: rgb(0 86 179 / var(--tw-text-opacity));
2628
+ }
2629
+ .n-text-primary-70{
2630
+ --tw-text-opacity: 1;
2631
+ color: rgb(0 64 146 / var(--tw-text-opacity));
2632
+ }
2633
+ .n-text-danger-10{
2634
+ --tw-text-opacity: 1;
2635
+ color: rgb(255 230 233 / var(--tw-text-opacity));
2636
+ }
2637
+ .n-text-danger-20{
2638
+ --tw-text-opacity: 1;
2639
+ color: rgb(255 184 196 / var(--tw-text-opacity));
2640
+ }
2641
+ .n-text-danger-30{
2642
+ --tw-text-opacity: 1;
2643
+ color: rgb(255 102 138 / var(--tw-text-opacity));
2644
+ }
2645
+ .n-text-danger-40{
2646
+ --tw-text-opacity: 1;
2647
+ color: rgb(237 18 82 / var(--tw-text-opacity));
2648
+ }
2649
+ .n-text-danger-50{
2650
+ --tw-text-opacity: 1;
2651
+ color: rgb(204 37 75 / var(--tw-text-opacity));
2652
+ }
2653
+ .n-text-danger-60{
2654
+ --tw-text-opacity: 1;
2655
+ color: rgb(161 0 59 / var(--tw-text-opacity));
2656
+ }
2657
+ .n-text-danger-70{
2658
+ --tw-text-opacity: 1;
2659
+ color: rgb(122 0 49 / var(--tw-text-opacity));
2660
+ }
2661
+ .n-text-success-10{
2662
+ --tw-text-opacity: 1;
2663
+ color: rgb(225 250 239 / var(--tw-text-opacity));
2664
+ }
2665
+ .n-text-success-20{
2666
+ --tw-text-opacity: 1;
2667
+ color: rgb(152 237 203 / var(--tw-text-opacity));
2668
+ }
2669
+ .n-text-success-30{
2670
+ --tw-text-opacity: 1;
2671
+ color: rgb(68 212 164 / var(--tw-text-opacity));
2672
+ }
2673
+ .n-text-success-40{
2674
+ --tw-text-opacity: 1;
2675
+ color: rgb(0 186 136 / var(--tw-text-opacity));
2676
+ }
2677
+ .n-text-success-50{
2678
+ --tw-text-opacity: 1;
2679
+ color: rgb(50 125 96 / var(--tw-text-opacity));
2275
2680
  }
2276
2681
  .n-text-success-60{
2277
2682
  --tw-text-opacity: 1;
@@ -2401,6 +2806,198 @@ a.ndl-btn{
2401
2806
  --tw-text-opacity: 1;
2402
2807
  color: rgb(21 30 41 / var(--tw-text-opacity));
2403
2808
  }
2809
+ .n-text-light-neutral-text-weakest{
2810
+ --tw-text-opacity: 1;
2811
+ color: rgb(178 183 189 / var(--tw-text-opacity));
2812
+ }
2813
+ .n-text-light-neutral-text-weaker{
2814
+ --tw-text-opacity: 1;
2815
+ color: rgb(113 119 128 / var(--tw-text-opacity));
2816
+ }
2817
+ .n-text-light-neutral-text-weak{
2818
+ --tw-text-opacity: 1;
2819
+ color: rgb(83 91 102 / var(--tw-text-opacity));
2820
+ }
2821
+ .n-text-light-neutral-text-default{
2822
+ --tw-text-opacity: 1;
2823
+ color: rgb(21 30 41 / var(--tw-text-opacity));
2824
+ }
2825
+ .n-text-light-neutral-text-inverse{
2826
+ --tw-text-opacity: 1;
2827
+ color: rgb(255 255 255 / var(--tw-text-opacity));
2828
+ }
2829
+ .n-text-light-neutral-bg-weak{
2830
+ --tw-text-opacity: 1;
2831
+ color: rgb(255 255 255 / var(--tw-text-opacity));
2832
+ }
2833
+ .n-text-light-neutral-bg-default{
2834
+ --tw-text-opacity: 1;
2835
+ color: rgb(245 247 250 / var(--tw-text-opacity));
2836
+ }
2837
+ .n-text-light-neutral-bg-strong{
2838
+ --tw-text-opacity: 1;
2839
+ color: rgb(230 233 238 / var(--tw-text-opacity));
2840
+ }
2841
+ .n-text-light-neutral-bg-strongest{
2842
+ --tw-text-opacity: 1;
2843
+ color: rgb(83 91 102 / var(--tw-text-opacity));
2844
+ }
2845
+ .n-text-light-neutral-border-weak{
2846
+ --tw-text-opacity: 1;
2847
+ color: rgb(238 241 246 / var(--tw-text-opacity));
2848
+ }
2849
+ .n-text-light-neutral-border-strong{
2850
+ --tw-text-opacity: 1;
2851
+ color: rgb(178 183 189 / var(--tw-text-opacity));
2852
+ }
2853
+ .n-text-light-neutral-hover{
2854
+ color: rgba(113,119,128,0.1);
2855
+ }
2856
+ .n-text-light-neutral-pressed{
2857
+ color: rgba(113,119,128,0.2);
2858
+ }
2859
+ .n-text-light-primary-text{
2860
+ --tw-text-opacity: 1;
2861
+ color: rgb(0 111 214 / var(--tw-text-opacity));
2862
+ }
2863
+ .n-text-light-primary-icon{
2864
+ --tw-text-opacity: 1;
2865
+ color: rgb(0 111 214 / var(--tw-text-opacity));
2866
+ }
2867
+ .n-text-light-primary-bg-strong{
2868
+ --tw-text-opacity: 1;
2869
+ color: rgb(0 111 214 / var(--tw-text-opacity));
2870
+ }
2871
+ .n-text-light-primary-bg-weak{
2872
+ --tw-text-opacity: 1;
2873
+ color: rgb(230 248 255 / var(--tw-text-opacity));
2874
+ }
2875
+ .n-text-light-primary-border-strong{
2876
+ --tw-text-opacity: 1;
2877
+ color: rgb(0 111 214 / var(--tw-text-opacity));
2878
+ }
2879
+ .n-text-light-primary-border-weak{
2880
+ --tw-text-opacity: 1;
2881
+ color: rgb(122 209 255 / var(--tw-text-opacity));
2882
+ }
2883
+ .n-text-light-primary-focus{
2884
+ --tw-text-opacity: 1;
2885
+ color: rgb(1 139 255 / var(--tw-text-opacity));
2886
+ }
2887
+ .n-text-light-primary-hover-weak{
2888
+ color: rgba(1,139,255,0.08);
2889
+ }
2890
+ .n-text-light-primary-hover-strong{
2891
+ --tw-text-opacity: 1;
2892
+ color: rgb(0 86 179 / var(--tw-text-opacity));
2893
+ }
2894
+ .n-text-light-primary-pressed-weak{
2895
+ color: rgba(1,139,255,0.12);
2896
+ }
2897
+ .n-text-light-primary-pressed-strong{
2898
+ --tw-text-opacity: 1;
2899
+ color: rgb(0 64 146 / var(--tw-text-opacity));
2900
+ }
2901
+ .n-text-light-danger-text{
2902
+ --tw-text-opacity: 1;
2903
+ color: rgb(204 37 75 / var(--tw-text-opacity));
2904
+ }
2905
+ .n-text-light-danger-icon{
2906
+ --tw-text-opacity: 1;
2907
+ color: rgb(204 37 75 / var(--tw-text-opacity));
2908
+ }
2909
+ .n-text-light-danger-bg-strong{
2910
+ --tw-text-opacity: 1;
2911
+ color: rgb(204 37 75 / var(--tw-text-opacity));
2912
+ }
2913
+ .n-text-light-danger-bg-weak{
2914
+ --tw-text-opacity: 1;
2915
+ color: rgb(255 230 233 / var(--tw-text-opacity));
2916
+ }
2917
+ .n-text-light-danger-border-strong{
2918
+ --tw-text-opacity: 1;
2919
+ color: rgb(204 37 75 / var(--tw-text-opacity));
2920
+ }
2921
+ .n-text-light-danger-border-weak{
2922
+ --tw-text-opacity: 1;
2923
+ color: rgb(255 184 196 / var(--tw-text-opacity));
2924
+ }
2925
+ .n-text-light-danger-hover-weak{
2926
+ color: rgba(237,18,82,0.08);
2927
+ }
2928
+ .n-text-light-danger-hover-strong{
2929
+ --tw-text-opacity: 1;
2930
+ color: rgb(161 0 59 / var(--tw-text-opacity));
2931
+ }
2932
+ .n-text-light-danger-pressed-weak{
2933
+ color: rgba(237,18,82,0.12);
2934
+ }
2935
+ .n-text-light-danger-pressed-strong{
2936
+ --tw-text-opacity: 1;
2937
+ color: rgb(122 0 49 / var(--tw-text-opacity));
2938
+ }
2939
+ .n-text-light-warning-text{
2940
+ --tw-text-opacity: 1;
2941
+ color: rgb(150 108 46 / var(--tw-text-opacity));
2942
+ }
2943
+ .n-text-light-warning-icon{
2944
+ --tw-text-opacity: 1;
2945
+ color: rgb(150 108 46 / var(--tw-text-opacity));
2946
+ }
2947
+ .n-text-light-warning-bg-strong{
2948
+ --tw-text-opacity: 1;
2949
+ color: rgb(150 108 46 / var(--tw-text-opacity));
2950
+ }
2951
+ .n-text-light-warning-bg-weak{
2952
+ --tw-text-opacity: 1;
2953
+ color: rgb(255 251 222 / var(--tw-text-opacity));
2954
+ }
2955
+ .n-text-light-warning-border-strong{
2956
+ --tw-text-opacity: 1;
2957
+ color: rgb(150 108 46 / var(--tw-text-opacity));
2958
+ }
2959
+ .n-text-light-warning-border-weak{
2960
+ --tw-text-opacity: 1;
2961
+ color: rgb(255 234 140 / var(--tw-text-opacity));
2962
+ }
2963
+ .n-text-light-success-text{
2964
+ --tw-text-opacity: 1;
2965
+ color: rgb(50 125 96 / var(--tw-text-opacity));
2966
+ }
2967
+ .n-text-light-success-icon{
2968
+ --tw-text-opacity: 1;
2969
+ color: rgb(50 125 96 / var(--tw-text-opacity));
2970
+ }
2971
+ .n-text-light-success-bg-strong{
2972
+ --tw-text-opacity: 1;
2973
+ color: rgb(50 125 96 / var(--tw-text-opacity));
2974
+ }
2975
+ .n-text-light-success-bg-weak{
2976
+ --tw-text-opacity: 1;
2977
+ color: rgb(225 250 239 / var(--tw-text-opacity));
2978
+ }
2979
+ .n-text-light-success-border-strong{
2980
+ --tw-text-opacity: 1;
2981
+ color: rgb(50 125 96 / var(--tw-text-opacity));
2982
+ }
2983
+ .n-text-light-success-border-weak{
2984
+ --tw-text-opacity: 1;
2985
+ color: rgb(152 237 203 / var(--tw-text-opacity));
2986
+ }
2987
+ .n-underline{
2988
+ -webkit-text-decoration-line: underline;
2989
+ text-decoration-line: underline;
2990
+ }
2991
+ .n-shadow-l2{
2992
+ --tw-shadow: 0px 1px 2px 0px rgba(12, 26, 37, 0.18);
2993
+ --tw-shadow-colored: 0px 1px 2px 0px var(--tw-shadow-color);
2994
+ box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
2995
+ }
2996
+ .n-shadow-l4{
2997
+ --tw-shadow: 0px 4px 8px 0px rgba(12, 26, 37, 0.08);
2998
+ --tw-shadow-colored: 0px 4px 8px 0px var(--tw-shadow-color);
2999
+ box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
3000
+ }
2404
3001
  .n-duration-200{
2405
3002
  transition-duration: 200ms;
2406
3003
  }
@@ -2410,9 +3007,17 @@ a.ndl-btn{
2410
3007
  .\[http\:\/\/neo4j\.com\]{
2411
3008
  http: //neo4j.com;
2412
3009
  }
2413
- * {
3010
+ body, html {
2414
3011
  font-family: 'Nunito Sans', sans-serif;
2415
3012
  }
3013
+ .first\:n-rounded-t-sm:first-child{
3014
+ border-top-left-radius: 4px;
3015
+ border-top-right-radius: 4px;
3016
+ }
3017
+ .last\:n-rounded-b-sm:last-child{
3018
+ border-bottom-right-radius: 4px;
3019
+ border-bottom-left-radius: 4px;
3020
+ }
2416
3021
  .hover\:n-rotate-12:hover{
2417
3022
  --tw-rotate: 12deg;
2418
3023
  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));
@@ -2621,6 +3226,184 @@ a.ndl-btn{
2621
3226
  --tw-bg-opacity: 1;
2622
3227
  background-color: rgb(21 30 41 / var(--tw-bg-opacity));
2623
3228
  }
3229
+ .hover\:n-bg-light-neutral-text-weakest:hover{
3230
+ --tw-bg-opacity: 1;
3231
+ background-color: rgb(178 183 189 / var(--tw-bg-opacity));
3232
+ }
3233
+ .hover\:n-bg-light-neutral-text-weaker:hover{
3234
+ --tw-bg-opacity: 1;
3235
+ background-color: rgb(113 119 128 / var(--tw-bg-opacity));
3236
+ }
3237
+ .hover\:n-bg-light-neutral-text-weak:hover{
3238
+ --tw-bg-opacity: 1;
3239
+ background-color: rgb(83 91 102 / var(--tw-bg-opacity));
3240
+ }
3241
+ .hover\:n-bg-light-neutral-text-default:hover{
3242
+ --tw-bg-opacity: 1;
3243
+ background-color: rgb(21 30 41 / var(--tw-bg-opacity));
3244
+ }
3245
+ .hover\:n-bg-light-neutral-text-inverse:hover{
3246
+ --tw-bg-opacity: 1;
3247
+ background-color: rgb(255 255 255 / var(--tw-bg-opacity));
3248
+ }
3249
+ .hover\:n-bg-light-neutral-bg-weak:hover{
3250
+ --tw-bg-opacity: 1;
3251
+ background-color: rgb(255 255 255 / var(--tw-bg-opacity));
3252
+ }
3253
+ .hover\:n-bg-light-neutral-bg-default:hover{
3254
+ --tw-bg-opacity: 1;
3255
+ background-color: rgb(245 247 250 / var(--tw-bg-opacity));
3256
+ }
3257
+ .hover\:n-bg-light-neutral-bg-strong:hover{
3258
+ --tw-bg-opacity: 1;
3259
+ background-color: rgb(230 233 238 / var(--tw-bg-opacity));
3260
+ }
3261
+ .hover\:n-bg-light-neutral-bg-strongest:hover{
3262
+ --tw-bg-opacity: 1;
3263
+ background-color: rgb(83 91 102 / var(--tw-bg-opacity));
3264
+ }
3265
+ .hover\:n-bg-light-neutral-border-weak:hover{
3266
+ --tw-bg-opacity: 1;
3267
+ background-color: rgb(238 241 246 / var(--tw-bg-opacity));
3268
+ }
3269
+ .hover\:n-bg-light-neutral-border-strong:hover{
3270
+ --tw-bg-opacity: 1;
3271
+ background-color: rgb(178 183 189 / var(--tw-bg-opacity));
3272
+ }
3273
+ .hover\:n-bg-light-neutral-hover:hover{
3274
+ background-color: rgba(113,119,128,0.1);
3275
+ }
3276
+ .hover\:n-bg-light-neutral-pressed:hover{
3277
+ background-color: rgba(113,119,128,0.2);
3278
+ }
3279
+ .hover\:n-bg-light-primary-text:hover{
3280
+ --tw-bg-opacity: 1;
3281
+ background-color: rgb(0 111 214 / var(--tw-bg-opacity));
3282
+ }
3283
+ .hover\:n-bg-light-primary-icon:hover{
3284
+ --tw-bg-opacity: 1;
3285
+ background-color: rgb(0 111 214 / var(--tw-bg-opacity));
3286
+ }
3287
+ .hover\:n-bg-light-primary-bg-strong:hover{
3288
+ --tw-bg-opacity: 1;
3289
+ background-color: rgb(0 111 214 / var(--tw-bg-opacity));
3290
+ }
3291
+ .hover\:n-bg-light-primary-bg-weak:hover{
3292
+ --tw-bg-opacity: 1;
3293
+ background-color: rgb(230 248 255 / var(--tw-bg-opacity));
3294
+ }
3295
+ .hover\:n-bg-light-primary-border-strong:hover{
3296
+ --tw-bg-opacity: 1;
3297
+ background-color: rgb(0 111 214 / var(--tw-bg-opacity));
3298
+ }
3299
+ .hover\:n-bg-light-primary-border-weak:hover{
3300
+ --tw-bg-opacity: 1;
3301
+ background-color: rgb(122 209 255 / var(--tw-bg-opacity));
3302
+ }
3303
+ .hover\:n-bg-light-primary-focus:hover{
3304
+ --tw-bg-opacity: 1;
3305
+ background-color: rgb(1 139 255 / var(--tw-bg-opacity));
3306
+ }
3307
+ .hover\:n-bg-light-primary-hover-weak:hover{
3308
+ background-color: rgba(1,139,255,0.08);
3309
+ }
3310
+ .hover\:n-bg-light-primary-hover-strong:hover{
3311
+ --tw-bg-opacity: 1;
3312
+ background-color: rgb(0 86 179 / var(--tw-bg-opacity));
3313
+ }
3314
+ .hover\:n-bg-light-primary-pressed-weak:hover{
3315
+ background-color: rgba(1,139,255,0.12);
3316
+ }
3317
+ .hover\:n-bg-light-primary-pressed-strong:hover{
3318
+ --tw-bg-opacity: 1;
3319
+ background-color: rgb(0 64 146 / var(--tw-bg-opacity));
3320
+ }
3321
+ .hover\:n-bg-light-danger-text:hover{
3322
+ --tw-bg-opacity: 1;
3323
+ background-color: rgb(204 37 75 / var(--tw-bg-opacity));
3324
+ }
3325
+ .hover\:n-bg-light-danger-icon:hover{
3326
+ --tw-bg-opacity: 1;
3327
+ background-color: rgb(204 37 75 / var(--tw-bg-opacity));
3328
+ }
3329
+ .hover\:n-bg-light-danger-bg-strong:hover{
3330
+ --tw-bg-opacity: 1;
3331
+ background-color: rgb(204 37 75 / var(--tw-bg-opacity));
3332
+ }
3333
+ .hover\:n-bg-light-danger-bg-weak:hover{
3334
+ --tw-bg-opacity: 1;
3335
+ background-color: rgb(255 230 233 / var(--tw-bg-opacity));
3336
+ }
3337
+ .hover\:n-bg-light-danger-border-strong:hover{
3338
+ --tw-bg-opacity: 1;
3339
+ background-color: rgb(204 37 75 / var(--tw-bg-opacity));
3340
+ }
3341
+ .hover\:n-bg-light-danger-border-weak:hover{
3342
+ --tw-bg-opacity: 1;
3343
+ background-color: rgb(255 184 196 / var(--tw-bg-opacity));
3344
+ }
3345
+ .hover\:n-bg-light-danger-hover-weak:hover{
3346
+ background-color: rgba(237,18,82,0.08);
3347
+ }
3348
+ .hover\:n-bg-light-danger-hover-strong:hover{
3349
+ --tw-bg-opacity: 1;
3350
+ background-color: rgb(161 0 59 / var(--tw-bg-opacity));
3351
+ }
3352
+ .hover\:n-bg-light-danger-pressed-weak:hover{
3353
+ background-color: rgba(237,18,82,0.12);
3354
+ }
3355
+ .hover\:n-bg-light-danger-pressed-strong:hover{
3356
+ --tw-bg-opacity: 1;
3357
+ background-color: rgb(122 0 49 / var(--tw-bg-opacity));
3358
+ }
3359
+ .hover\:n-bg-light-warning-text:hover{
3360
+ --tw-bg-opacity: 1;
3361
+ background-color: rgb(150 108 46 / var(--tw-bg-opacity));
3362
+ }
3363
+ .hover\:n-bg-light-warning-icon:hover{
3364
+ --tw-bg-opacity: 1;
3365
+ background-color: rgb(150 108 46 / var(--tw-bg-opacity));
3366
+ }
3367
+ .hover\:n-bg-light-warning-bg-strong:hover{
3368
+ --tw-bg-opacity: 1;
3369
+ background-color: rgb(150 108 46 / var(--tw-bg-opacity));
3370
+ }
3371
+ .hover\:n-bg-light-warning-bg-weak:hover{
3372
+ --tw-bg-opacity: 1;
3373
+ background-color: rgb(255 251 222 / var(--tw-bg-opacity));
3374
+ }
3375
+ .hover\:n-bg-light-warning-border-strong:hover{
3376
+ --tw-bg-opacity: 1;
3377
+ background-color: rgb(150 108 46 / var(--tw-bg-opacity));
3378
+ }
3379
+ .hover\:n-bg-light-warning-border-weak:hover{
3380
+ --tw-bg-opacity: 1;
3381
+ background-color: rgb(255 234 140 / var(--tw-bg-opacity));
3382
+ }
3383
+ .hover\:n-bg-light-success-text:hover{
3384
+ --tw-bg-opacity: 1;
3385
+ background-color: rgb(50 125 96 / var(--tw-bg-opacity));
3386
+ }
3387
+ .hover\:n-bg-light-success-icon:hover{
3388
+ --tw-bg-opacity: 1;
3389
+ background-color: rgb(50 125 96 / var(--tw-bg-opacity));
3390
+ }
3391
+ .hover\:n-bg-light-success-bg-strong:hover{
3392
+ --tw-bg-opacity: 1;
3393
+ background-color: rgb(50 125 96 / var(--tw-bg-opacity));
3394
+ }
3395
+ .hover\:n-bg-light-success-bg-weak:hover{
3396
+ --tw-bg-opacity: 1;
3397
+ background-color: rgb(225 250 239 / var(--tw-bg-opacity));
3398
+ }
3399
+ .hover\:n-bg-light-success-border-strong:hover{
3400
+ --tw-bg-opacity: 1;
3401
+ background-color: rgb(50 125 96 / var(--tw-bg-opacity));
3402
+ }
3403
+ .hover\:n-bg-light-success-border-weak:hover{
3404
+ --tw-bg-opacity: 1;
3405
+ background-color: rgb(152 237 203 / var(--tw-bg-opacity));
3406
+ }
2624
3407
  .hover\:n-text-primary-10:hover{
2625
3408
  --tw-text-opacity: 1;
2626
3409
  color: rgb(230 248 255 / var(--tw-text-opacity));
@@ -2825,6 +3608,184 @@ a.ndl-btn{
2825
3608
  --tw-text-opacity: 1;
2826
3609
  color: rgb(21 30 41 / var(--tw-text-opacity));
2827
3610
  }
3611
+ .hover\:n-text-light-neutral-text-weakest:hover{
3612
+ --tw-text-opacity: 1;
3613
+ color: rgb(178 183 189 / var(--tw-text-opacity));
3614
+ }
3615
+ .hover\:n-text-light-neutral-text-weaker:hover{
3616
+ --tw-text-opacity: 1;
3617
+ color: rgb(113 119 128 / var(--tw-text-opacity));
3618
+ }
3619
+ .hover\:n-text-light-neutral-text-weak:hover{
3620
+ --tw-text-opacity: 1;
3621
+ color: rgb(83 91 102 / var(--tw-text-opacity));
3622
+ }
3623
+ .hover\:n-text-light-neutral-text-default:hover{
3624
+ --tw-text-opacity: 1;
3625
+ color: rgb(21 30 41 / var(--tw-text-opacity));
3626
+ }
3627
+ .hover\:n-text-light-neutral-text-inverse:hover{
3628
+ --tw-text-opacity: 1;
3629
+ color: rgb(255 255 255 / var(--tw-text-opacity));
3630
+ }
3631
+ .hover\:n-text-light-neutral-bg-weak:hover{
3632
+ --tw-text-opacity: 1;
3633
+ color: rgb(255 255 255 / var(--tw-text-opacity));
3634
+ }
3635
+ .hover\:n-text-light-neutral-bg-default:hover{
3636
+ --tw-text-opacity: 1;
3637
+ color: rgb(245 247 250 / var(--tw-text-opacity));
3638
+ }
3639
+ .hover\:n-text-light-neutral-bg-strong:hover{
3640
+ --tw-text-opacity: 1;
3641
+ color: rgb(230 233 238 / var(--tw-text-opacity));
3642
+ }
3643
+ .hover\:n-text-light-neutral-bg-strongest:hover{
3644
+ --tw-text-opacity: 1;
3645
+ color: rgb(83 91 102 / var(--tw-text-opacity));
3646
+ }
3647
+ .hover\:n-text-light-neutral-border-weak:hover{
3648
+ --tw-text-opacity: 1;
3649
+ color: rgb(238 241 246 / var(--tw-text-opacity));
3650
+ }
3651
+ .hover\:n-text-light-neutral-border-strong:hover{
3652
+ --tw-text-opacity: 1;
3653
+ color: rgb(178 183 189 / var(--tw-text-opacity));
3654
+ }
3655
+ .hover\:n-text-light-neutral-hover:hover{
3656
+ color: rgba(113,119,128,0.1);
3657
+ }
3658
+ .hover\:n-text-light-neutral-pressed:hover{
3659
+ color: rgba(113,119,128,0.2);
3660
+ }
3661
+ .hover\:n-text-light-primary-text:hover{
3662
+ --tw-text-opacity: 1;
3663
+ color: rgb(0 111 214 / var(--tw-text-opacity));
3664
+ }
3665
+ .hover\:n-text-light-primary-icon:hover{
3666
+ --tw-text-opacity: 1;
3667
+ color: rgb(0 111 214 / var(--tw-text-opacity));
3668
+ }
3669
+ .hover\:n-text-light-primary-bg-strong:hover{
3670
+ --tw-text-opacity: 1;
3671
+ color: rgb(0 111 214 / var(--tw-text-opacity));
3672
+ }
3673
+ .hover\:n-text-light-primary-bg-weak:hover{
3674
+ --tw-text-opacity: 1;
3675
+ color: rgb(230 248 255 / var(--tw-text-opacity));
3676
+ }
3677
+ .hover\:n-text-light-primary-border-strong:hover{
3678
+ --tw-text-opacity: 1;
3679
+ color: rgb(0 111 214 / var(--tw-text-opacity));
3680
+ }
3681
+ .hover\:n-text-light-primary-border-weak:hover{
3682
+ --tw-text-opacity: 1;
3683
+ color: rgb(122 209 255 / var(--tw-text-opacity));
3684
+ }
3685
+ .hover\:n-text-light-primary-focus:hover{
3686
+ --tw-text-opacity: 1;
3687
+ color: rgb(1 139 255 / var(--tw-text-opacity));
3688
+ }
3689
+ .hover\:n-text-light-primary-hover-weak:hover{
3690
+ color: rgba(1,139,255,0.08);
3691
+ }
3692
+ .hover\:n-text-light-primary-hover-strong:hover{
3693
+ --tw-text-opacity: 1;
3694
+ color: rgb(0 86 179 / var(--tw-text-opacity));
3695
+ }
3696
+ .hover\:n-text-light-primary-pressed-weak:hover{
3697
+ color: rgba(1,139,255,0.12);
3698
+ }
3699
+ .hover\:n-text-light-primary-pressed-strong:hover{
3700
+ --tw-text-opacity: 1;
3701
+ color: rgb(0 64 146 / var(--tw-text-opacity));
3702
+ }
3703
+ .hover\:n-text-light-danger-text:hover{
3704
+ --tw-text-opacity: 1;
3705
+ color: rgb(204 37 75 / var(--tw-text-opacity));
3706
+ }
3707
+ .hover\:n-text-light-danger-icon:hover{
3708
+ --tw-text-opacity: 1;
3709
+ color: rgb(204 37 75 / var(--tw-text-opacity));
3710
+ }
3711
+ .hover\:n-text-light-danger-bg-strong:hover{
3712
+ --tw-text-opacity: 1;
3713
+ color: rgb(204 37 75 / var(--tw-text-opacity));
3714
+ }
3715
+ .hover\:n-text-light-danger-bg-weak:hover{
3716
+ --tw-text-opacity: 1;
3717
+ color: rgb(255 230 233 / var(--tw-text-opacity));
3718
+ }
3719
+ .hover\:n-text-light-danger-border-strong:hover{
3720
+ --tw-text-opacity: 1;
3721
+ color: rgb(204 37 75 / var(--tw-text-opacity));
3722
+ }
3723
+ .hover\:n-text-light-danger-border-weak:hover{
3724
+ --tw-text-opacity: 1;
3725
+ color: rgb(255 184 196 / var(--tw-text-opacity));
3726
+ }
3727
+ .hover\:n-text-light-danger-hover-weak:hover{
3728
+ color: rgba(237,18,82,0.08);
3729
+ }
3730
+ .hover\:n-text-light-danger-hover-strong:hover{
3731
+ --tw-text-opacity: 1;
3732
+ color: rgb(161 0 59 / var(--tw-text-opacity));
3733
+ }
3734
+ .hover\:n-text-light-danger-pressed-weak:hover{
3735
+ color: rgba(237,18,82,0.12);
3736
+ }
3737
+ .hover\:n-text-light-danger-pressed-strong:hover{
3738
+ --tw-text-opacity: 1;
3739
+ color: rgb(122 0 49 / var(--tw-text-opacity));
3740
+ }
3741
+ .hover\:n-text-light-warning-text:hover{
3742
+ --tw-text-opacity: 1;
3743
+ color: rgb(150 108 46 / var(--tw-text-opacity));
3744
+ }
3745
+ .hover\:n-text-light-warning-icon:hover{
3746
+ --tw-text-opacity: 1;
3747
+ color: rgb(150 108 46 / var(--tw-text-opacity));
3748
+ }
3749
+ .hover\:n-text-light-warning-bg-strong:hover{
3750
+ --tw-text-opacity: 1;
3751
+ color: rgb(150 108 46 / var(--tw-text-opacity));
3752
+ }
3753
+ .hover\:n-text-light-warning-bg-weak:hover{
3754
+ --tw-text-opacity: 1;
3755
+ color: rgb(255 251 222 / var(--tw-text-opacity));
3756
+ }
3757
+ .hover\:n-text-light-warning-border-strong:hover{
3758
+ --tw-text-opacity: 1;
3759
+ color: rgb(150 108 46 / var(--tw-text-opacity));
3760
+ }
3761
+ .hover\:n-text-light-warning-border-weak:hover{
3762
+ --tw-text-opacity: 1;
3763
+ color: rgb(255 234 140 / var(--tw-text-opacity));
3764
+ }
3765
+ .hover\:n-text-light-success-text:hover{
3766
+ --tw-text-opacity: 1;
3767
+ color: rgb(50 125 96 / var(--tw-text-opacity));
3768
+ }
3769
+ .hover\:n-text-light-success-icon:hover{
3770
+ --tw-text-opacity: 1;
3771
+ color: rgb(50 125 96 / var(--tw-text-opacity));
3772
+ }
3773
+ .hover\:n-text-light-success-bg-strong:hover{
3774
+ --tw-text-opacity: 1;
3775
+ color: rgb(50 125 96 / var(--tw-text-opacity));
3776
+ }
3777
+ .hover\:n-text-light-success-bg-weak:hover{
3778
+ --tw-text-opacity: 1;
3779
+ color: rgb(225 250 239 / var(--tw-text-opacity));
3780
+ }
3781
+ .hover\:n-text-light-success-border-strong:hover{
3782
+ --tw-text-opacity: 1;
3783
+ color: rgb(50 125 96 / var(--tw-text-opacity));
3784
+ }
3785
+ .hover\:n-text-light-success-border-weak:hover{
3786
+ --tw-text-opacity: 1;
3787
+ color: rgb(152 237 203 / var(--tw-text-opacity));
3788
+ }
2828
3789
  @media (min-width: 640px){
2829
3790
  .sm\:n-space-y-0 > :not([hidden]) ~ :not([hidden]){
2830
3791
  --tw-space-y-reverse: 0;