@rovula/ui 0.0.9 → 0.0.10
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/dist/cjs/bundle.css +429 -3
- package/dist/cjs/bundle.js +1 -1
- package/dist/cjs/bundle.js.map +1 -1
- package/dist/cjs/types/components/AlertDialog/Alert.stories.d.ts +20 -0
- package/dist/cjs/types/components/AlertDialog/AlertDialog.d.ts +20 -0
- package/dist/cjs/types/components/Button/Button.styles.d.ts +1 -1
- package/dist/cjs/types/components/Checkbox/Checkbox.d.ts +4 -0
- package/dist/cjs/types/components/Checkbox/Checkbox.stories.d.ts +308 -0
- package/dist/cjs/types/components/Dialog/Dialog.d.ts +19 -0
- package/dist/cjs/types/components/Dialog/Dialog.stories.d.ts +25 -0
- package/dist/cjs/types/components/Input/Input.d.ts +5 -0
- package/dist/cjs/types/components/Input/Input.stories.d.ts +314 -0
- package/dist/cjs/types/components/Label/Label.d.ts +5 -0
- package/dist/cjs/types/components/Label/Label.stories.d.ts +286 -0
- package/dist/cjs/types/components/RadioGroup/RadioGroup.d.ts +5 -0
- package/dist/cjs/types/components/RadioGroup/RadioGroup.stories.d.ts +299 -0
- package/dist/cjs/types/components/Table/Datagrid.d.ts +11 -0
- package/dist/cjs/types/components/Table/Table.d.ts +10 -11
- package/dist/cjs/types/components/Table/Table.stories.d.ts +283 -0
- package/dist/cjs/types/components/Tabs/Tabs.d.ts +7 -5
- package/dist/cjs/types/components/Tabs/Tabs.stories.d.ts +49 -0
- package/dist/cjs/types/index.d.ts +7 -1
- package/dist/cjs/types/utils/cn.d.ts +2 -0
- package/dist/components/AlertDialog/Alert.stories.js +39 -0
- package/dist/components/AlertDialog/AlertDialog.js +73 -0
- package/dist/components/Button/Button.js +3 -3
- package/dist/components/Button/Button.styles.js +1 -1
- package/dist/components/Checkbox/Checkbox.js +37 -0
- package/dist/components/Checkbox/Checkbox.stories.js +49 -0
- package/dist/components/Dialog/Dialog.js +63 -0
- package/dist/components/Dialog/Dialog.stories.js +52 -0
- package/dist/components/Input/Input.js +31 -0
- package/dist/components/Input/Input.stories.js +37 -0
- package/dist/components/Label/Label.js +35 -0
- package/dist/components/Label/Label.stories.js +38 -0
- package/dist/components/RadioGroup/RadioGroup.js +41 -0
- package/dist/components/RadioGroup/RadioGroup.stories.js +44 -0
- package/dist/components/Table/Datagrid.js +6 -0
- package/dist/components/Table/Table.js +65 -5
- package/dist/components/Table/Table.stories.js +32 -0
- package/dist/components/Tabs/Tabs.js +10 -4
- package/dist/components/Tabs/Tabs.stories.js +60 -0
- package/dist/esm/bundle.css +429 -3
- package/dist/esm/bundle.js +1 -1
- package/dist/esm/bundle.js.map +1 -1
- package/dist/esm/types/components/AlertDialog/Alert.stories.d.ts +20 -0
- package/dist/esm/types/components/AlertDialog/AlertDialog.d.ts +20 -0
- package/dist/esm/types/components/Button/Button.styles.d.ts +1 -1
- package/dist/esm/types/components/Checkbox/Checkbox.d.ts +4 -0
- package/dist/esm/types/components/Checkbox/Checkbox.stories.d.ts +308 -0
- package/dist/esm/types/components/Dialog/Dialog.d.ts +19 -0
- package/dist/esm/types/components/Dialog/Dialog.stories.d.ts +25 -0
- package/dist/esm/types/components/Input/Input.d.ts +5 -0
- package/dist/esm/types/components/Input/Input.stories.d.ts +314 -0
- package/dist/esm/types/components/Label/Label.d.ts +5 -0
- package/dist/esm/types/components/Label/Label.stories.d.ts +286 -0
- package/dist/esm/types/components/RadioGroup/RadioGroup.d.ts +5 -0
- package/dist/esm/types/components/RadioGroup/RadioGroup.stories.d.ts +299 -0
- package/dist/esm/types/components/Table/Datagrid.d.ts +11 -0
- package/dist/esm/types/components/Table/Table.d.ts +10 -11
- package/dist/esm/types/components/Table/Table.stories.d.ts +283 -0
- package/dist/esm/types/components/Tabs/Tabs.d.ts +7 -5
- package/dist/esm/types/components/Tabs/Tabs.stories.d.ts +49 -0
- package/dist/esm/types/index.d.ts +7 -1
- package/dist/esm/types/utils/cn.d.ts +2 -0
- package/dist/index.d.ts +82 -28
- package/dist/index.js +7 -1
- package/dist/src/theme/global.css +511 -3
- package/dist/theme/global.css +57 -0
- package/dist/theme/main-preset.js +29 -1
- package/dist/theme/presets/colors.js +19 -0
- package/dist/utils/cn.js +9 -0
- package/package.json +9 -1
- package/src/components/AlertDialog/Alert.stories.tsx +67 -0
- package/src/components/AlertDialog/AlertDialog.tsx +142 -0
- package/src/components/Button/Button.styles.ts +1 -1
- package/src/components/Button/Button.tsx +4 -4
- package/src/components/Checkbox/Checkbox.stories.tsx +91 -0
- package/src/components/Checkbox/Checkbox.tsx +36 -0
- package/src/components/Dialog/Dialog.stories.tsx +118 -0
- package/src/components/Dialog/Dialog.tsx +119 -0
- package/src/components/Input/Input.stories.tsx +40 -0
- package/src/components/Input/Input.tsx +25 -0
- package/src/components/Label/Label.stories.tsx +45 -0
- package/src/components/Label/Label.tsx +26 -0
- package/src/components/RadioGroup/RadioGroup.stories.tsx +71 -0
- package/src/components/RadioGroup/RadioGroup.tsx +59 -0
- package/src/components/Table/Datagrid.tsx +36 -0
- package/src/components/Table/Table.stories.tsx +79 -0
- package/src/components/Table/Table.tsx +116 -35
- package/src/components/Tabs/Tabs.stories.tsx +75 -0
- package/src/components/Tabs/Tabs.tsx +39 -10
- package/src/index.ts +8 -1
- package/src/theme/global.css +57 -0
- package/src/theme/main-preset.js +29 -1
- package/src/theme/presets/colors.js +19 -0
- package/src/utils/cn.ts +6 -0
package/dist/cjs/bundle.css
CHANGED
|
@@ -534,7 +534,62 @@ video {
|
|
|
534
534
|
--input-disabled-background-color: 247 247 247;
|
|
535
535
|
|
|
536
536
|
--input-label-background-color: 249 251 255;
|
|
537
|
+
|
|
538
|
+
/* Text */
|
|
539
|
+
--text-default-dark: 1 1 68;
|
|
540
|
+
--text-default-medium: 47 78 255;
|
|
541
|
+
--text-default-light: 213 230 255;
|
|
542
|
+
|
|
543
|
+
--text-grey-dark: 29 30 39;
|
|
544
|
+
--text-grey-medium: 117 121 128;
|
|
545
|
+
--text-grey-light: 164 169 178;
|
|
546
|
+
--text-white: 255 255 255;
|
|
547
|
+
|
|
548
|
+
/* Other/Popup */
|
|
549
|
+
--popup-background: 249 251 255;
|
|
550
|
+
/* Other/Popup Curtain */
|
|
551
|
+
--popup-overlay: 0 0 0;
|
|
552
|
+
--popup-overlay-alpha: 0.48;
|
|
553
|
+
--popup-rounded: 24px;
|
|
554
|
+
|
|
555
|
+
/* TODO for shadcn, wait for refactor */
|
|
556
|
+
/* --background: 0 0% 100%; */
|
|
557
|
+
--background: 220 100% 99%;
|
|
558
|
+
--foreground: 222.2 47.4% 11.2%;
|
|
559
|
+
|
|
560
|
+
--muted: 210 40% 96.1%;
|
|
561
|
+
--muted-foreground: 215.4 16.3% 46.9%;
|
|
562
|
+
|
|
563
|
+
--popover: 0 0% 100%;
|
|
564
|
+
--popover-foreground: 222.2 47.4% 11.2%;
|
|
565
|
+
|
|
566
|
+
--border: 214.3 31.8% 91.4%;
|
|
567
|
+
--input: 214.3 31.8% 91.4%;
|
|
568
|
+
|
|
569
|
+
--card: 0 0% 100%;
|
|
570
|
+
--card-foreground: 222.2 47.4% 11.2%;
|
|
571
|
+
|
|
572
|
+
--primary: var(--primary-default);
|
|
573
|
+
|
|
574
|
+
--secondary: var(--secondary-default);
|
|
575
|
+
|
|
576
|
+
--accent: 210 40% 96.1%;
|
|
577
|
+
--accent-foreground: 222.2 47.4% 11.2%;
|
|
578
|
+
|
|
579
|
+
--destructive: 0 100% 50%;
|
|
580
|
+
--destructive-foreground: 210 40% 98%;
|
|
581
|
+
|
|
582
|
+
--ring: 215 20.2% 65.1%;
|
|
583
|
+
|
|
584
|
+
--radius: 0.5rem;
|
|
537
585
|
}
|
|
586
|
+
* {
|
|
587
|
+
border-color: hsl(var(--border));
|
|
588
|
+
}
|
|
589
|
+
body {
|
|
590
|
+
background-color: hsl(var(--background));
|
|
591
|
+
color: hsl(var(--foreground));
|
|
592
|
+
}
|
|
538
593
|
|
|
539
594
|
*, ::before, ::after {
|
|
540
595
|
--tw-border-spacing-x: 0;
|
|
@@ -643,15 +698,45 @@ video {
|
|
|
643
698
|
--tw-contain-paint: ;
|
|
644
699
|
--tw-contain-style: ;
|
|
645
700
|
}
|
|
701
|
+
.container {
|
|
702
|
+
width: 100%;
|
|
703
|
+
margin-right: auto;
|
|
704
|
+
margin-left: auto;
|
|
705
|
+
padding-right: 2rem;
|
|
706
|
+
padding-left: 2rem;
|
|
707
|
+
}
|
|
708
|
+
@media (min-width: 1400px) {
|
|
709
|
+
|
|
710
|
+
.container {
|
|
711
|
+
max-width: 1400px;
|
|
712
|
+
}
|
|
713
|
+
}
|
|
714
|
+
.sr-only {
|
|
715
|
+
position: absolute;
|
|
716
|
+
width: 1px;
|
|
717
|
+
height: 1px;
|
|
718
|
+
padding: 0;
|
|
719
|
+
margin: -1px;
|
|
720
|
+
overflow: hidden;
|
|
721
|
+
clip: rect(0, 0, 0, 0);
|
|
722
|
+
white-space: nowrap;
|
|
723
|
+
border-width: 0;
|
|
724
|
+
}
|
|
646
725
|
.pointer-events-none {
|
|
647
726
|
pointer-events: none;
|
|
648
727
|
}
|
|
728
|
+
.fixed {
|
|
729
|
+
position: fixed;
|
|
730
|
+
}
|
|
649
731
|
.absolute {
|
|
650
732
|
position: absolute;
|
|
651
733
|
}
|
|
652
734
|
.relative {
|
|
653
735
|
position: relative;
|
|
654
736
|
}
|
|
737
|
+
.inset-0 {
|
|
738
|
+
inset: 0px;
|
|
739
|
+
}
|
|
655
740
|
.inset-y-0 {
|
|
656
741
|
top: 0px;
|
|
657
742
|
bottom: 0px;
|
|
@@ -668,15 +753,30 @@ video {
|
|
|
668
753
|
.left-4 {
|
|
669
754
|
left: 1rem;
|
|
670
755
|
}
|
|
756
|
+
.left-\[50\%\] {
|
|
757
|
+
left: 50%;
|
|
758
|
+
}
|
|
671
759
|
.right-0 {
|
|
672
760
|
right: 0px;
|
|
673
761
|
}
|
|
762
|
+
.right-4 {
|
|
763
|
+
right: 1rem;
|
|
764
|
+
}
|
|
765
|
+
.top-4 {
|
|
766
|
+
top: 1rem;
|
|
767
|
+
}
|
|
768
|
+
.top-\[50\%\] {
|
|
769
|
+
top: 50%;
|
|
770
|
+
}
|
|
674
771
|
.z-10 {
|
|
675
772
|
z-index: 10;
|
|
676
773
|
}
|
|
677
774
|
.z-50 {
|
|
678
775
|
z-index: 50;
|
|
679
776
|
}
|
|
777
|
+
.col-span-3 {
|
|
778
|
+
grid-column: span 3 / span 3;
|
|
779
|
+
}
|
|
680
780
|
.mx-auto {
|
|
681
781
|
margin-left: auto;
|
|
682
782
|
margin-right: auto;
|
|
@@ -697,6 +797,12 @@ video {
|
|
|
697
797
|
.mt-1 {
|
|
698
798
|
margin-top: 0.25rem;
|
|
699
799
|
}
|
|
800
|
+
.mt-2 {
|
|
801
|
+
margin-top: 0.5rem;
|
|
802
|
+
}
|
|
803
|
+
.mt-4 {
|
|
804
|
+
margin-top: 1rem;
|
|
805
|
+
}
|
|
700
806
|
.mt-\[6px\] {
|
|
701
807
|
margin-top: 6px;
|
|
702
808
|
}
|
|
@@ -721,6 +827,17 @@ video {
|
|
|
721
827
|
.hidden {
|
|
722
828
|
display: none;
|
|
723
829
|
}
|
|
830
|
+
.aspect-square {
|
|
831
|
+
aspect-ratio: 1 / 1;
|
|
832
|
+
}
|
|
833
|
+
.size-2 {
|
|
834
|
+
width: 0.5rem;
|
|
835
|
+
height: 0.5rem;
|
|
836
|
+
}
|
|
837
|
+
.size-2\.5 {
|
|
838
|
+
width: 0.625rem;
|
|
839
|
+
height: 0.625rem;
|
|
840
|
+
}
|
|
724
841
|
.size-3 {
|
|
725
842
|
width: 0.75rem;
|
|
726
843
|
height: 0.75rem;
|
|
@@ -741,9 +858,27 @@ video {
|
|
|
741
858
|
width: 14px;
|
|
742
859
|
height: 14px;
|
|
743
860
|
}
|
|
861
|
+
.h-10 {
|
|
862
|
+
height: 2.5rem;
|
|
863
|
+
}
|
|
864
|
+
.h-12 {
|
|
865
|
+
height: 3rem;
|
|
866
|
+
}
|
|
867
|
+
.h-4 {
|
|
868
|
+
height: 1rem;
|
|
869
|
+
}
|
|
870
|
+
.h-\[54px\] {
|
|
871
|
+
height: 54px;
|
|
872
|
+
}
|
|
744
873
|
.max-h-60 {
|
|
745
874
|
max-height: 15rem;
|
|
746
875
|
}
|
|
876
|
+
.w-4 {
|
|
877
|
+
width: 1rem;
|
|
878
|
+
}
|
|
879
|
+
.w-\[100px\] {
|
|
880
|
+
width: 100px;
|
|
881
|
+
}
|
|
747
882
|
.w-\[200px\] {
|
|
748
883
|
width: 200px;
|
|
749
884
|
}
|
|
@@ -759,6 +894,23 @@ video {
|
|
|
759
894
|
.max-w-3xl {
|
|
760
895
|
max-width: 48rem;
|
|
761
896
|
}
|
|
897
|
+
.max-w-lg {
|
|
898
|
+
max-width: 32rem;
|
|
899
|
+
}
|
|
900
|
+
.shrink-0 {
|
|
901
|
+
flex-shrink: 0;
|
|
902
|
+
}
|
|
903
|
+
.caption-bottom {
|
|
904
|
+
caption-side: bottom;
|
|
905
|
+
}
|
|
906
|
+
.translate-x-\[-50\%\] {
|
|
907
|
+
--tw-translate-x: -50%;
|
|
908
|
+
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));
|
|
909
|
+
}
|
|
910
|
+
.translate-y-\[-50\%\] {
|
|
911
|
+
--tw-translate-y: -50%;
|
|
912
|
+
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));
|
|
913
|
+
}
|
|
762
914
|
.rotate-180 {
|
|
763
915
|
--tw-rotate: 180deg;
|
|
764
916
|
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));
|
|
@@ -776,6 +928,9 @@ video {
|
|
|
776
928
|
-moz-appearance: none;
|
|
777
929
|
appearance: none;
|
|
778
930
|
}
|
|
931
|
+
.grid-cols-4 {
|
|
932
|
+
grid-template-columns: repeat(4, minmax(0, 1fr));
|
|
933
|
+
}
|
|
779
934
|
.grid-cols-\[auto_1fr\] {
|
|
780
935
|
grid-template-columns: auto 1fr;
|
|
781
936
|
}
|
|
@@ -785,6 +940,9 @@ video {
|
|
|
785
940
|
.flex-col {
|
|
786
941
|
flex-direction: column;
|
|
787
942
|
}
|
|
943
|
+
.flex-col-reverse {
|
|
944
|
+
flex-direction: column-reverse;
|
|
945
|
+
}
|
|
788
946
|
.items-center {
|
|
789
947
|
align-items: center;
|
|
790
948
|
}
|
|
@@ -794,12 +952,21 @@ video {
|
|
|
794
952
|
.gap-1 {
|
|
795
953
|
gap: 0.25rem;
|
|
796
954
|
}
|
|
955
|
+
.gap-1\.5 {
|
|
956
|
+
gap: 0.375rem;
|
|
957
|
+
}
|
|
797
958
|
.gap-2 {
|
|
798
959
|
gap: 0.5rem;
|
|
799
960
|
}
|
|
961
|
+
.gap-3 {
|
|
962
|
+
gap: 0.75rem;
|
|
963
|
+
}
|
|
800
964
|
.gap-4 {
|
|
801
965
|
gap: 1rem;
|
|
802
966
|
}
|
|
967
|
+
.gap-6 {
|
|
968
|
+
gap: 1.5rem;
|
|
969
|
+
}
|
|
803
970
|
.gap-x-8 {
|
|
804
971
|
-moz-column-gap: 2rem;
|
|
805
972
|
column-gap: 2rem;
|
|
@@ -810,6 +977,24 @@ video {
|
|
|
810
977
|
.gap-y-6 {
|
|
811
978
|
row-gap: 1.5rem;
|
|
812
979
|
}
|
|
980
|
+
.space-x-2 > :not([hidden]) ~ :not([hidden]) {
|
|
981
|
+
--tw-space-x-reverse: 0;
|
|
982
|
+
margin-right: calc(0.5rem * var(--tw-space-x-reverse));
|
|
983
|
+
margin-left: calc(0.5rem * calc(1 - var(--tw-space-x-reverse)));
|
|
984
|
+
}
|
|
985
|
+
.space-y-2 > :not([hidden]) ~ :not([hidden]) {
|
|
986
|
+
--tw-space-y-reverse: 0;
|
|
987
|
+
margin-top: calc(0.5rem * calc(1 - var(--tw-space-y-reverse)));
|
|
988
|
+
margin-bottom: calc(0.5rem * var(--tw-space-y-reverse));
|
|
989
|
+
}
|
|
990
|
+
.space-y-4 > :not([hidden]) ~ :not([hidden]) {
|
|
991
|
+
--tw-space-y-reverse: 0;
|
|
992
|
+
margin-top: calc(1rem * calc(1 - var(--tw-space-y-reverse)));
|
|
993
|
+
margin-bottom: calc(1rem * var(--tw-space-y-reverse));
|
|
994
|
+
}
|
|
995
|
+
.overflow-auto {
|
|
996
|
+
overflow: auto;
|
|
997
|
+
}
|
|
813
998
|
.overflow-x-auto {
|
|
814
999
|
overflow-x: auto;
|
|
815
1000
|
}
|
|
@@ -835,16 +1020,16 @@ video {
|
|
|
835
1020
|
border-radius: 9999px;
|
|
836
1021
|
}
|
|
837
1022
|
.rounded-lg {
|
|
838
|
-
border-radius:
|
|
1023
|
+
border-radius: var(--radius);
|
|
839
1024
|
}
|
|
840
1025
|
.rounded-md {
|
|
841
|
-
border-radius:
|
|
1026
|
+
border-radius: calc(var(--radius) - 2px);
|
|
842
1027
|
}
|
|
843
1028
|
.rounded-none {
|
|
844
1029
|
border-radius: 0px;
|
|
845
1030
|
}
|
|
846
1031
|
.rounded-sm {
|
|
847
|
-
border-radius:
|
|
1032
|
+
border-radius: calc(var(--radius) - 4px);
|
|
848
1033
|
}
|
|
849
1034
|
.rounded-xl {
|
|
850
1035
|
border-radius: 0.75rem;
|
|
@@ -855,9 +1040,18 @@ video {
|
|
|
855
1040
|
.border-0 {
|
|
856
1041
|
border-width: 0px;
|
|
857
1042
|
}
|
|
1043
|
+
.border-b {
|
|
1044
|
+
border-bottom-width: 1px;
|
|
1045
|
+
}
|
|
858
1046
|
.border-b-2 {
|
|
859
1047
|
border-bottom-width: 2px;
|
|
860
1048
|
}
|
|
1049
|
+
.border-b-\[3px\] {
|
|
1050
|
+
border-bottom-width: 3px;
|
|
1051
|
+
}
|
|
1052
|
+
.border-t {
|
|
1053
|
+
border-top-width: 1px;
|
|
1054
|
+
}
|
|
861
1055
|
.border-error {
|
|
862
1056
|
--tw-border-opacity: 1;
|
|
863
1057
|
border-color: rgb(var(--error-100) / var(--tw-border-opacity));
|
|
@@ -878,10 +1072,22 @@ video {
|
|
|
878
1072
|
--tw-border-opacity: 1;
|
|
879
1073
|
border-color: rgb(var(--primary-default) / var(--tw-border-opacity));
|
|
880
1074
|
}
|
|
1075
|
+
.border-primary-10 {
|
|
1076
|
+
--tw-border-opacity: 1;
|
|
1077
|
+
border-color: rgb(var(--primary-10) / var(--tw-border-opacity));
|
|
1078
|
+
}
|
|
1079
|
+
.border-primary-30 {
|
|
1080
|
+
--tw-border-opacity: 1;
|
|
1081
|
+
border-color: rgb(var(--primary-30) / var(--tw-border-opacity));
|
|
1082
|
+
}
|
|
881
1083
|
.border-secondary {
|
|
882
1084
|
--tw-border-opacity: 1;
|
|
883
1085
|
border-color: rgb(var(--secondary-default) / var(--tw-border-opacity));
|
|
884
1086
|
}
|
|
1087
|
+
.border-secondary-110 {
|
|
1088
|
+
--tw-border-opacity: 1;
|
|
1089
|
+
border-color: rgb(var(--secondary-110) / var(--tw-border-opacity));
|
|
1090
|
+
}
|
|
885
1091
|
.border-success {
|
|
886
1092
|
--tw-border-opacity: 1;
|
|
887
1093
|
border-color: rgb(var(--success-default) / var(--tw-border-opacity));
|
|
@@ -890,6 +1096,10 @@ video {
|
|
|
890
1096
|
--tw-border-opacity: 1;
|
|
891
1097
|
border-color: rgb(var(--tertiary-120) / var(--tw-border-opacity));
|
|
892
1098
|
}
|
|
1099
|
+
.border-textcolor-dark {
|
|
1100
|
+
--tw-border-opacity: 1;
|
|
1101
|
+
border-color: rgb(var(--text-default-dark) / var(--tw-border-opacity));
|
|
1102
|
+
}
|
|
893
1103
|
.border-transparent {
|
|
894
1104
|
border-color: transparent;
|
|
895
1105
|
}
|
|
@@ -897,6 +1107,9 @@ video {
|
|
|
897
1107
|
--tw-border-opacity: 1;
|
|
898
1108
|
border-color: rgb(var(--warning-default) / var(--tw-border-opacity));
|
|
899
1109
|
}
|
|
1110
|
+
.bg-background {
|
|
1111
|
+
background-color: hsl(var(--background));
|
|
1112
|
+
}
|
|
900
1113
|
.bg-error {
|
|
901
1114
|
--tw-bg-opacity: 1;
|
|
902
1115
|
background-color: rgb(var(--error-100) / var(--tw-bg-opacity));
|
|
@@ -905,6 +1118,10 @@ video {
|
|
|
905
1118
|
--tw-bg-opacity: 1;
|
|
906
1119
|
background-color: rgb(229 231 235 / var(--tw-bg-opacity));
|
|
907
1120
|
}
|
|
1121
|
+
.bg-grey2-300 {
|
|
1122
|
+
--tw-bg-opacity: 1;
|
|
1123
|
+
background-color: rgb(var(--grey2-300) / var(--tw-bg-opacity));
|
|
1124
|
+
}
|
|
908
1125
|
.bg-info {
|
|
909
1126
|
--tw-bg-opacity: 1;
|
|
910
1127
|
background-color: rgb(var(--info-default) / var(--tw-bg-opacity));
|
|
@@ -913,6 +1130,13 @@ video {
|
|
|
913
1130
|
--tw-bg-opacity: 1;
|
|
914
1131
|
background-color: rgb(var(--input-label-background-color) / var(--tw-bg-opacity));
|
|
915
1132
|
}
|
|
1133
|
+
.bg-popup-background {
|
|
1134
|
+
--tw-bg-opacity: 1;
|
|
1135
|
+
background-color: rgb(var(--popup-background) / var(--tw-bg-opacity));
|
|
1136
|
+
}
|
|
1137
|
+
.bg-popup-overlay {
|
|
1138
|
+
background-color: rgb(var(--popup-overlay) / var(--popup-overlay-alpha));
|
|
1139
|
+
}
|
|
916
1140
|
.bg-primary {
|
|
917
1141
|
--tw-bg-opacity: 1;
|
|
918
1142
|
background-color: rgb(var(--primary-default) / var(--tw-bg-opacity));
|
|
@@ -944,6 +1168,9 @@ video {
|
|
|
944
1168
|
--tw-bg-opacity: 1;
|
|
945
1169
|
background-color: rgb(255 255 255 / var(--tw-bg-opacity));
|
|
946
1170
|
}
|
|
1171
|
+
.fill-current {
|
|
1172
|
+
fill: currentColor;
|
|
1173
|
+
}
|
|
947
1174
|
.fill-error {
|
|
948
1175
|
fill: rgb(var(--error-100) / 1);
|
|
949
1176
|
}
|
|
@@ -959,6 +1186,9 @@ video {
|
|
|
959
1186
|
.fill-input-text-disabled {
|
|
960
1187
|
fill: rgb(var(--input-disabled-text-color) / 1);
|
|
961
1188
|
}
|
|
1189
|
+
.fill-secondary-110 {
|
|
1190
|
+
fill: rgb(var(--secondary-110) / 1);
|
|
1191
|
+
}
|
|
962
1192
|
.p-1 {
|
|
963
1193
|
padding: 0.25rem;
|
|
964
1194
|
}
|
|
@@ -971,6 +1201,16 @@ video {
|
|
|
971
1201
|
.p-5 {
|
|
972
1202
|
padding: 1.25rem;
|
|
973
1203
|
}
|
|
1204
|
+
.p-6 {
|
|
1205
|
+
padding: 1.5rem;
|
|
1206
|
+
}
|
|
1207
|
+
.p-8 {
|
|
1208
|
+
padding: 2rem;
|
|
1209
|
+
}
|
|
1210
|
+
.px-1 {
|
|
1211
|
+
padding-left: 0.25rem;
|
|
1212
|
+
padding-right: 0.25rem;
|
|
1213
|
+
}
|
|
974
1214
|
.px-3 {
|
|
975
1215
|
padding-left: 0.75rem;
|
|
976
1216
|
padding-right: 0.75rem;
|
|
@@ -1012,9 +1252,15 @@ video {
|
|
|
1012
1252
|
.pe-\[48px\] {
|
|
1013
1253
|
padding-inline-end: 48px;
|
|
1014
1254
|
}
|
|
1255
|
+
.text-left {
|
|
1256
|
+
text-align: left;
|
|
1257
|
+
}
|
|
1015
1258
|
.text-center {
|
|
1016
1259
|
text-align: center;
|
|
1017
1260
|
}
|
|
1261
|
+
.text-right {
|
|
1262
|
+
text-align: right;
|
|
1263
|
+
}
|
|
1018
1264
|
.align-middle {
|
|
1019
1265
|
vertical-align: middle;
|
|
1020
1266
|
}
|
|
@@ -1143,13 +1389,22 @@ video {
|
|
|
1143
1389
|
.capitalize {
|
|
1144
1390
|
text-transform: capitalize;
|
|
1145
1391
|
}
|
|
1392
|
+
.leading-none {
|
|
1393
|
+
line-height: 1;
|
|
1394
|
+
}
|
|
1146
1395
|
.tracking-\[\.02857em\] {
|
|
1147
1396
|
letter-spacing: .02857em;
|
|
1148
1397
|
}
|
|
1398
|
+
.tracking-tight {
|
|
1399
|
+
letter-spacing: -0.025em;
|
|
1400
|
+
}
|
|
1149
1401
|
.text-black {
|
|
1150
1402
|
--tw-text-opacity: 1;
|
|
1151
1403
|
color: rgb(0 0 0 / var(--tw-text-opacity));
|
|
1152
1404
|
}
|
|
1405
|
+
.text-current {
|
|
1406
|
+
color: currentColor;
|
|
1407
|
+
}
|
|
1153
1408
|
.text-error {
|
|
1154
1409
|
--tw-text-opacity: 1;
|
|
1155
1410
|
color: rgb(var(--error-100) / var(--tw-text-opacity));
|
|
@@ -1186,6 +1441,10 @@ video {
|
|
|
1186
1441
|
--tw-text-opacity: 1;
|
|
1187
1442
|
color: rgb(var(--primary-foreground) / var(--tw-text-opacity));
|
|
1188
1443
|
}
|
|
1444
|
+
.text-secondary-110 {
|
|
1445
|
+
--tw-text-opacity: 1;
|
|
1446
|
+
color: rgb(var(--secondary-110) / var(--tw-text-opacity));
|
|
1447
|
+
}
|
|
1189
1448
|
.text-secondary-130 {
|
|
1190
1449
|
--tw-text-opacity: 1;
|
|
1191
1450
|
color: rgb(var(--secondary-130) / var(--tw-text-opacity));
|
|
@@ -1210,6 +1469,18 @@ video {
|
|
|
1210
1469
|
--tw-text-opacity: 1;
|
|
1211
1470
|
color: rgb(var(--tertiary-foreground) / var(--tw-text-opacity));
|
|
1212
1471
|
}
|
|
1472
|
+
.text-textcolor-dark {
|
|
1473
|
+
--tw-text-opacity: 1;
|
|
1474
|
+
color: rgb(var(--text-default-dark) / var(--tw-text-opacity));
|
|
1475
|
+
}
|
|
1476
|
+
.text-textcolor-grey-dark {
|
|
1477
|
+
--tw-text-opacity: 1;
|
|
1478
|
+
color: rgb(var(--text-grey-dark) / var(--tw-text-opacity));
|
|
1479
|
+
}
|
|
1480
|
+
.text-textcolor-grey-light {
|
|
1481
|
+
--tw-text-opacity: 1;
|
|
1482
|
+
color: rgb(var(--text-grey-light) / var(--tw-text-opacity));
|
|
1483
|
+
}
|
|
1213
1484
|
.text-warning {
|
|
1214
1485
|
--tw-text-opacity: 1;
|
|
1215
1486
|
color: rgb(var(--warning-default) / var(--tw-text-opacity));
|
|
@@ -1231,6 +1502,14 @@ video {
|
|
|
1231
1502
|
.underline-offset-4 {
|
|
1232
1503
|
text-underline-offset: 4px;
|
|
1233
1504
|
}
|
|
1505
|
+
.opacity-70 {
|
|
1506
|
+
opacity: 0.7;
|
|
1507
|
+
}
|
|
1508
|
+
.shadow-lg {
|
|
1509
|
+
--tw-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
|
|
1510
|
+
--tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);
|
|
1511
|
+
box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
|
|
1512
|
+
}
|
|
1234
1513
|
.shadow-md {
|
|
1235
1514
|
--tw-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
|
|
1236
1515
|
--tw-shadow-colored: 0 4px 6px -1px var(--tw-shadow-color), 0 2px 4px -2px var(--tw-shadow-color);
|
|
@@ -1243,6 +1522,11 @@ video {
|
|
|
1243
1522
|
.outline {
|
|
1244
1523
|
outline-style: solid;
|
|
1245
1524
|
}
|
|
1525
|
+
.ring {
|
|
1526
|
+
--tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
|
|
1527
|
+
--tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(3px + var(--tw-ring-offset-width)) var(--tw-ring-color);
|
|
1528
|
+
box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
|
|
1529
|
+
}
|
|
1246
1530
|
.ring-1 {
|
|
1247
1531
|
--tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
|
|
1248
1532
|
--tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color);
|
|
@@ -1263,6 +1547,9 @@ video {
|
|
|
1263
1547
|
--tw-ring-opacity: 1;
|
|
1264
1548
|
--tw-ring-color: rgb(var(--input-disabled-stroke-color) / var(--tw-ring-opacity));
|
|
1265
1549
|
}
|
|
1550
|
+
.ring-offset-background {
|
|
1551
|
+
--tw-ring-offset-color: hsl(var(--background));
|
|
1552
|
+
}
|
|
1266
1553
|
.filter {
|
|
1267
1554
|
filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
|
|
1268
1555
|
}
|
|
@@ -1276,12 +1563,23 @@ video {
|
|
|
1276
1563
|
transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
|
|
1277
1564
|
transition-duration: 150ms;
|
|
1278
1565
|
}
|
|
1566
|
+
.transition-opacity {
|
|
1567
|
+
transition-property: opacity;
|
|
1568
|
+
transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
|
|
1569
|
+
transition-duration: 150ms;
|
|
1570
|
+
}
|
|
1571
|
+
.duration-200 {
|
|
1572
|
+
transition-duration: 200ms;
|
|
1573
|
+
}
|
|
1279
1574
|
.duration-300 {
|
|
1280
1575
|
transition-duration: 300ms;
|
|
1281
1576
|
}
|
|
1282
1577
|
.ease-in-out {
|
|
1283
1578
|
transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
|
|
1284
1579
|
}
|
|
1580
|
+
.ease-out {
|
|
1581
|
+
transition-timing-function: cubic-bezier(0, 0, 0.2, 1);
|
|
1582
|
+
}
|
|
1285
1583
|
.typography-h1 {
|
|
1286
1584
|
font-size: 64px;
|
|
1287
1585
|
line-height: 80px;
|
|
@@ -1387,6 +1685,19 @@ video {
|
|
|
1387
1685
|
line-height: 10px;
|
|
1388
1686
|
font-weight: 400;
|
|
1389
1687
|
}
|
|
1688
|
+
.file\:border-0::file-selector-button {
|
|
1689
|
+
border-width: 0px;
|
|
1690
|
+
}
|
|
1691
|
+
.file\:bg-transparent::file-selector-button {
|
|
1692
|
+
background-color: transparent;
|
|
1693
|
+
}
|
|
1694
|
+
.file\:text-sm::file-selector-button {
|
|
1695
|
+
font-size: 0.875rem;
|
|
1696
|
+
line-height: 1.25rem;
|
|
1697
|
+
}
|
|
1698
|
+
.file\:font-medium::file-selector-button {
|
|
1699
|
+
font-weight: 500;
|
|
1700
|
+
}
|
|
1390
1701
|
.placeholder\:text-input-text-disabled::-moz-placeholder {
|
|
1391
1702
|
--tw-text-opacity: 1;
|
|
1392
1703
|
color: rgb(var(--input-disabled-text-color) / var(--tw-text-opacity));
|
|
@@ -1457,9 +1768,16 @@ video {
|
|
|
1457
1768
|
.hover\:fill-input-text:hover {
|
|
1458
1769
|
fill: rgb(var(--input-default-text-color) / 1);
|
|
1459
1770
|
}
|
|
1771
|
+
.hover\:text-textcolor-dark:hover {
|
|
1772
|
+
--tw-text-opacity: 1;
|
|
1773
|
+
color: rgb(var(--text-default-dark) / var(--tw-text-opacity));
|
|
1774
|
+
}
|
|
1460
1775
|
.hover\:text-opacity-80:hover {
|
|
1461
1776
|
--tw-text-opacity: 0.8;
|
|
1462
1777
|
}
|
|
1778
|
+
.hover\:opacity-100:hover {
|
|
1779
|
+
opacity: 1;
|
|
1780
|
+
}
|
|
1463
1781
|
.focus\:border-input-stroke:focus {
|
|
1464
1782
|
--tw-border-opacity: 1;
|
|
1465
1783
|
border-color: rgb(var(--input-default-stroke-color) / var(--tw-border-opacity));
|
|
@@ -1473,11 +1791,20 @@ video {
|
|
|
1473
1791
|
.focus\:pe-8:focus {
|
|
1474
1792
|
padding-inline-end: 2rem;
|
|
1475
1793
|
}
|
|
1794
|
+
.focus\:outline-none:focus {
|
|
1795
|
+
outline: 2px solid transparent;
|
|
1796
|
+
outline-offset: 2px;
|
|
1797
|
+
}
|
|
1476
1798
|
.focus\:ring-1:focus {
|
|
1477
1799
|
--tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
|
|
1478
1800
|
--tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color);
|
|
1479
1801
|
box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
|
|
1480
1802
|
}
|
|
1803
|
+
.focus\:ring-2:focus {
|
|
1804
|
+
--tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
|
|
1805
|
+
--tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);
|
|
1806
|
+
box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
|
|
1807
|
+
}
|
|
1481
1808
|
.focus\:ring-inset:focus {
|
|
1482
1809
|
--tw-ring-inset: inset;
|
|
1483
1810
|
}
|
|
@@ -1489,11 +1816,48 @@ video {
|
|
|
1489
1816
|
--tw-ring-opacity: 1;
|
|
1490
1817
|
--tw-ring-color: rgb(var(--input-active-stroke-color) / var(--tw-ring-opacity));
|
|
1491
1818
|
}
|
|
1819
|
+
.focus\:ring-ring:focus {
|
|
1820
|
+
--tw-ring-color: hsl(var(--ring));
|
|
1821
|
+
}
|
|
1822
|
+
.focus\:ring-offset-2:focus {
|
|
1823
|
+
--tw-ring-offset-width: 2px;
|
|
1824
|
+
}
|
|
1825
|
+
.focus-visible\:outline-none:focus-visible {
|
|
1826
|
+
outline: 2px solid transparent;
|
|
1827
|
+
outline-offset: 2px;
|
|
1828
|
+
}
|
|
1829
|
+
.focus-visible\:ring-2:focus-visible {
|
|
1830
|
+
--tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
|
|
1831
|
+
--tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);
|
|
1832
|
+
box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
|
|
1833
|
+
}
|
|
1834
|
+
.focus-visible\:ring-ring:focus-visible {
|
|
1835
|
+
--tw-ring-color: hsl(var(--ring));
|
|
1836
|
+
}
|
|
1837
|
+
.focus-visible\:ring-offset-2:focus-visible {
|
|
1838
|
+
--tw-ring-offset-width: 2px;
|
|
1839
|
+
}
|
|
1492
1840
|
.active\:scale-\[98\%\]:active {
|
|
1493
1841
|
--tw-scale-x: 98%;
|
|
1494
1842
|
--tw-scale-y: 98%;
|
|
1495
1843
|
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));
|
|
1496
1844
|
}
|
|
1845
|
+
.disabled\:pointer-events-none:disabled {
|
|
1846
|
+
pointer-events: none;
|
|
1847
|
+
}
|
|
1848
|
+
.disabled\:cursor-not-allowed:disabled {
|
|
1849
|
+
cursor: not-allowed;
|
|
1850
|
+
}
|
|
1851
|
+
.disabled\:border-secondary-110:disabled {
|
|
1852
|
+
--tw-border-opacity: 1;
|
|
1853
|
+
border-color: rgb(var(--secondary-110) / var(--tw-border-opacity));
|
|
1854
|
+
}
|
|
1855
|
+
.disabled\:fill-secondary-110:disabled {
|
|
1856
|
+
fill: rgb(var(--secondary-110) / 1);
|
|
1857
|
+
}
|
|
1858
|
+
.disabled\:opacity-50:disabled {
|
|
1859
|
+
opacity: 0.5;
|
|
1860
|
+
}
|
|
1497
1861
|
.peer:-moz-placeholder-shown ~ .peer-placeholder-shown\:top-2 {
|
|
1498
1862
|
top: 0.5rem;
|
|
1499
1863
|
}
|
|
@@ -1569,6 +1933,12 @@ video {
|
|
|
1569
1933
|
line-height: 10px;
|
|
1570
1934
|
font-weight: 400;
|
|
1571
1935
|
}
|
|
1936
|
+
.peer:disabled ~ .peer-disabled\:cursor-not-allowed {
|
|
1937
|
+
cursor: not-allowed;
|
|
1938
|
+
}
|
|
1939
|
+
.peer:disabled ~ .peer-disabled\:opacity-70 {
|
|
1940
|
+
opacity: 0.7;
|
|
1941
|
+
}
|
|
1572
1942
|
.aria-disabled\:pointer-events-none[aria-disabled="true"] {
|
|
1573
1943
|
pointer-events: none;
|
|
1574
1944
|
}
|
|
@@ -1577,4 +1947,60 @@ video {
|
|
|
1577
1947
|
}
|
|
1578
1948
|
.aria-disabled\:opacity-50[aria-disabled="true"] {
|
|
1579
1949
|
opacity: 0.5;
|
|
1950
|
+
}
|
|
1951
|
+
.data-\[state\=checked\]\:border-primary[data-state=checked] {
|
|
1952
|
+
--tw-border-opacity: 1;
|
|
1953
|
+
border-color: rgb(var(--primary-default) / var(--tw-border-opacity));
|
|
1954
|
+
}
|
|
1955
|
+
.data-\[state\=checked\]\:bg-primary[data-state=checked] {
|
|
1956
|
+
--tw-bg-opacity: 1;
|
|
1957
|
+
background-color: rgb(var(--primary-default) / var(--tw-bg-opacity));
|
|
1958
|
+
}
|
|
1959
|
+
.data-\[state\=checked\]\:text-primary-foreground[data-state=checked] {
|
|
1960
|
+
--tw-text-opacity: 1;
|
|
1961
|
+
color: rgb(var(--primary-foreground) / var(--tw-text-opacity));
|
|
1962
|
+
}
|
|
1963
|
+
@media (min-width: 640px) {
|
|
1964
|
+
|
|
1965
|
+
.sm\:mt-0 {
|
|
1966
|
+
margin-top: 0px;
|
|
1967
|
+
}
|
|
1968
|
+
|
|
1969
|
+
.sm\:max-w-\[425px\] {
|
|
1970
|
+
max-width: 425px;
|
|
1971
|
+
}
|
|
1972
|
+
|
|
1973
|
+
.sm\:flex-row {
|
|
1974
|
+
flex-direction: row;
|
|
1975
|
+
}
|
|
1976
|
+
|
|
1977
|
+
.sm\:justify-end {
|
|
1978
|
+
justify-content: flex-end;
|
|
1979
|
+
}
|
|
1980
|
+
|
|
1981
|
+
.sm\:space-x-2 > :not([hidden]) ~ :not([hidden]) {
|
|
1982
|
+
--tw-space-x-reverse: 0;
|
|
1983
|
+
margin-right: calc(0.5rem * var(--tw-space-x-reverse));
|
|
1984
|
+
margin-left: calc(0.5rem * calc(1 - var(--tw-space-x-reverse)));
|
|
1985
|
+
}
|
|
1986
|
+
|
|
1987
|
+
.sm\:rounded-\[var\(--popup-rounded\)\] {
|
|
1988
|
+
border-radius: var(--popup-rounded);
|
|
1989
|
+
}
|
|
1990
|
+
|
|
1991
|
+
.sm\:text-left {
|
|
1992
|
+
text-align: left;
|
|
1993
|
+
}
|
|
1994
|
+
}
|
|
1995
|
+
.\[\&\:has\(\[role\=checkbox\]\)\]\:pr-0:has([role=checkbox]) {
|
|
1996
|
+
padding-right: 0px;
|
|
1997
|
+
}
|
|
1998
|
+
.\[\&\>tr\]\:last\:border-b-0:last-child>tr {
|
|
1999
|
+
border-bottom-width: 0px;
|
|
2000
|
+
}
|
|
2001
|
+
.\[\&_tr\:last-child\]\:border-0 tr:last-child {
|
|
2002
|
+
border-width: 0px;
|
|
2003
|
+
}
|
|
2004
|
+
.\[\&_tr\]\:border-b tr {
|
|
2005
|
+
border-bottom-width: 1px;
|
|
1580
2006
|
}
|