@homlista-devs/ui 1.2.0 → 1.3.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/design-system.cjs.js +25 -15
- package/dist/design-system.cjs.js.map +1 -1
- package/dist/design-system.es.js +1046 -958
- package/dist/design-system.es.js.map +1 -1
- package/dist/index.css +56 -3
- package/package.json +1 -1
package/dist/index.css
CHANGED
|
@@ -7,7 +7,6 @@
|
|
|
7
7
|
"Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
|
|
8
8
|
--font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono",
|
|
9
9
|
"Courier New", monospace;
|
|
10
|
-
--color-red-500: oklch(63.7% 0.237 25.331);
|
|
11
10
|
--color-blue-500: oklch(62.3% 0.214 259.815);
|
|
12
11
|
--color-purple-500: oklch(62.7% 0.265 303.9);
|
|
13
12
|
--color-black: #000;
|
|
@@ -53,6 +52,7 @@
|
|
|
53
52
|
--radius-sm: 0.25rem;
|
|
54
53
|
--radius-md: 0.375rem;
|
|
55
54
|
--radius-lg: 0.5rem;
|
|
55
|
+
--radius-xl: 0.75rem;
|
|
56
56
|
--radius-2xl: 1rem;
|
|
57
57
|
--ease-in: cubic-bezier(0.4, 0, 1, 1);
|
|
58
58
|
--ease-out: cubic-bezier(0, 0, 0.2, 1);
|
|
@@ -311,6 +311,9 @@
|
|
|
311
311
|
.top-1\/2 {
|
|
312
312
|
top: calc(1/2 * 100%);
|
|
313
313
|
}
|
|
314
|
+
.top-3 {
|
|
315
|
+
top: calc(var(--spacing) * 3);
|
|
316
|
+
}
|
|
314
317
|
.top-4 {
|
|
315
318
|
top: calc(var(--spacing) * 4);
|
|
316
319
|
}
|
|
@@ -383,6 +386,12 @@
|
|
|
383
386
|
.mt-1\.5 {
|
|
384
387
|
margin-top: calc(var(--spacing) * 1.5);
|
|
385
388
|
}
|
|
389
|
+
.mt-2 {
|
|
390
|
+
margin-top: calc(var(--spacing) * 2);
|
|
391
|
+
}
|
|
392
|
+
.mt-3 {
|
|
393
|
+
margin-top: calc(var(--spacing) * 3);
|
|
394
|
+
}
|
|
386
395
|
.mt-4 {
|
|
387
396
|
margin-top: calc(var(--spacing) * 4);
|
|
388
397
|
}
|
|
@@ -491,6 +500,9 @@
|
|
|
491
500
|
.h-20 {
|
|
492
501
|
height: calc(var(--spacing) * 20);
|
|
493
502
|
}
|
|
503
|
+
.h-52 {
|
|
504
|
+
height: calc(var(--spacing) * 52);
|
|
505
|
+
}
|
|
494
506
|
.h-\[600px\] {
|
|
495
507
|
height: 600px;
|
|
496
508
|
}
|
|
@@ -753,6 +765,9 @@
|
|
|
753
765
|
.rounded-sm {
|
|
754
766
|
border-radius: var(--radius-sm);
|
|
755
767
|
}
|
|
768
|
+
.rounded-xl {
|
|
769
|
+
border-radius: var(--radius-xl);
|
|
770
|
+
}
|
|
756
771
|
.border {
|
|
757
772
|
border-style: var(--tw-border-style);
|
|
758
773
|
border-width: 1px;
|
|
@@ -871,8 +886,11 @@
|
|
|
871
886
|
.bg-primary-foreground {
|
|
872
887
|
background-color: var(--color-primary-foreground);
|
|
873
888
|
}
|
|
874
|
-
.bg-
|
|
875
|
-
background-color:
|
|
889
|
+
.bg-primary\/10 {
|
|
890
|
+
background-color: color-mix(in srgb, hsl(221.2, 83.2%, 53.3%) 10%, transparent);
|
|
891
|
+
@supports (color: color-mix(in lab, red, red)) {
|
|
892
|
+
background-color: color-mix(in oklab, var(--color-primary) 10%, transparent);
|
|
893
|
+
}
|
|
876
894
|
}
|
|
877
895
|
.bg-secondary {
|
|
878
896
|
background-color: var(--color-secondary);
|
|
@@ -901,6 +919,10 @@
|
|
|
901
919
|
.bg-white {
|
|
902
920
|
background-color: var(--color-white);
|
|
903
921
|
}
|
|
922
|
+
.bg-gradient-to-br {
|
|
923
|
+
--tw-gradient-position: to bottom right in oklab;
|
|
924
|
+
background-image: linear-gradient(var(--tw-gradient-stops));
|
|
925
|
+
}
|
|
904
926
|
.bg-gradient-to-r {
|
|
905
927
|
--tw-gradient-position: to right in oklab;
|
|
906
928
|
background-image: linear-gradient(var(--tw-gradient-stops));
|
|
@@ -912,10 +934,32 @@
|
|
|
912
934
|
--tw-gradient-from: var(--color-blue-500);
|
|
913
935
|
--tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
|
|
914
936
|
}
|
|
937
|
+
.from-primary\/10 {
|
|
938
|
+
--tw-gradient-from: color-mix(in srgb, hsl(221.2, 83.2%, 53.3%) 10%, transparent);
|
|
939
|
+
@supports (color: color-mix(in lab, red, red)) {
|
|
940
|
+
--tw-gradient-from: color-mix(in oklab, var(--color-primary) 10%, transparent);
|
|
941
|
+
}
|
|
942
|
+
--tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
|
|
943
|
+
}
|
|
944
|
+
.via-primary\/5 {
|
|
945
|
+
--tw-gradient-via: color-mix(in srgb, hsl(221.2, 83.2%, 53.3%) 5%, transparent);
|
|
946
|
+
@supports (color: color-mix(in lab, red, red)) {
|
|
947
|
+
--tw-gradient-via: color-mix(in oklab, var(--color-primary) 5%, transparent);
|
|
948
|
+
}
|
|
949
|
+
--tw-gradient-via-stops: var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-via) var(--tw-gradient-via-position), var(--tw-gradient-to) var(--tw-gradient-to-position);
|
|
950
|
+
--tw-gradient-stops: var(--tw-gradient-via-stops);
|
|
951
|
+
}
|
|
915
952
|
.to-purple-500 {
|
|
916
953
|
--tw-gradient-to: var(--color-purple-500);
|
|
917
954
|
--tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
|
|
918
955
|
}
|
|
956
|
+
.to-secondary\/10 {
|
|
957
|
+
--tw-gradient-to: color-mix(in srgb, hsl(210, 40%, 96%) 10%, transparent);
|
|
958
|
+
@supports (color: color-mix(in lab, red, red)) {
|
|
959
|
+
--tw-gradient-to: color-mix(in oklab, var(--color-secondary) 10%, transparent);
|
|
960
|
+
}
|
|
961
|
+
--tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
|
|
962
|
+
}
|
|
919
963
|
.object-cover {
|
|
920
964
|
-o-object-fit: cover;
|
|
921
965
|
object-fit: cover;
|
|
@@ -1088,6 +1132,9 @@
|
|
|
1088
1132
|
.whitespace-nowrap {
|
|
1089
1133
|
white-space: nowrap;
|
|
1090
1134
|
}
|
|
1135
|
+
.text-accent {
|
|
1136
|
+
color: var(--color-accent);
|
|
1137
|
+
}
|
|
1091
1138
|
.text-background {
|
|
1092
1139
|
color: var(--color-background);
|
|
1093
1140
|
}
|
|
@@ -1133,6 +1180,12 @@
|
|
|
1133
1180
|
.text-primary-foreground {
|
|
1134
1181
|
color: var(--color-primary-foreground);
|
|
1135
1182
|
}
|
|
1183
|
+
.text-primary\/40 {
|
|
1184
|
+
color: color-mix(in srgb, hsl(221.2, 83.2%, 53.3%) 40%, transparent);
|
|
1185
|
+
@supports (color: color-mix(in lab, red, red)) {
|
|
1186
|
+
color: color-mix(in oklab, var(--color-primary) 40%, transparent);
|
|
1187
|
+
}
|
|
1188
|
+
}
|
|
1136
1189
|
.text-secondary {
|
|
1137
1190
|
color: var(--color-secondary);
|
|
1138
1191
|
}
|