@eric-emg/symphiq-components 1.2.326 → 1.2.327
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/fesm2022/symphiq-components.mjs +963 -437
- package/fesm2022/symphiq-components.mjs.map +1 -1
- package/index.d.ts +45 -7
- package/index.d.ts.map +1 -1
- package/package.json +1 -1
- package/styles.css +95 -6
package/styles.css
CHANGED
|
@@ -1190,6 +1190,10 @@
|
|
|
1190
1190
|
--tw-translate-x: calc(calc(1/2 * 100%) * -1);
|
|
1191
1191
|
translate: var(--tw-translate-x) var(--tw-translate-y);
|
|
1192
1192
|
}
|
|
1193
|
+
.translate-x-1 {
|
|
1194
|
+
--tw-translate-x: calc(var(--spacing) * 1);
|
|
1195
|
+
translate: var(--tw-translate-x) var(--tw-translate-y);
|
|
1196
|
+
}
|
|
1193
1197
|
.-translate-y-0\.5 {
|
|
1194
1198
|
--tw-translate-y: calc(var(--spacing) * -0.5);
|
|
1195
1199
|
translate: var(--tw-translate-x) var(--tw-translate-y);
|
|
@@ -1671,6 +1675,12 @@
|
|
|
1671
1675
|
.border-blue-400 {
|
|
1672
1676
|
border-color: var(--color-blue-400);
|
|
1673
1677
|
}
|
|
1678
|
+
.border-blue-400\/50 {
|
|
1679
|
+
border-color: color-mix(in srgb, oklch(70.7% 0.165 254.624) 50%, transparent);
|
|
1680
|
+
@supports (color: color-mix(in lab, red, red)) {
|
|
1681
|
+
border-color: color-mix(in oklab, var(--color-blue-400) 50%, transparent);
|
|
1682
|
+
}
|
|
1683
|
+
}
|
|
1674
1684
|
.border-blue-400\/60 {
|
|
1675
1685
|
border-color: color-mix(in srgb, oklch(70.7% 0.165 254.624) 60%, transparent);
|
|
1676
1686
|
@supports (color: color-mix(in lab, red, red)) {
|
|
@@ -2649,12 +2659,6 @@
|
|
|
2649
2659
|
background-color: color-mix(in oklab, var(--color-blue-500) 20%, transparent);
|
|
2650
2660
|
}
|
|
2651
2661
|
}
|
|
2652
|
-
.bg-blue-500\/50 {
|
|
2653
|
-
background-color: color-mix(in srgb, oklch(62.3% 0.214 259.815) 50%, transparent);
|
|
2654
|
-
@supports (color: color-mix(in lab, red, red)) {
|
|
2655
|
-
background-color: color-mix(in oklab, var(--color-blue-500) 50%, transparent);
|
|
2656
|
-
}
|
|
2657
|
-
}
|
|
2658
2662
|
.bg-blue-600 {
|
|
2659
2663
|
background-color: var(--color-blue-600);
|
|
2660
2664
|
}
|
|
@@ -3723,6 +3727,10 @@
|
|
|
3723
3727
|
--tw-gradient-from: var(--color-blue-600);
|
|
3724
3728
|
--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));
|
|
3725
3729
|
}
|
|
3730
|
+
.from-blue-700 {
|
|
3731
|
+
--tw-gradient-from: var(--color-blue-700);
|
|
3732
|
+
--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));
|
|
3733
|
+
}
|
|
3726
3734
|
.from-blue-900\/20 {
|
|
3727
3735
|
--tw-gradient-from: color-mix(in srgb, oklch(37.9% 0.146 265.522) 20%, transparent);
|
|
3728
3736
|
@supports (color: color-mix(in lab, red, red)) {
|
|
@@ -4236,6 +4244,14 @@
|
|
|
4236
4244
|
--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);
|
|
4237
4245
|
--tw-gradient-stops: var(--tw-gradient-via-stops);
|
|
4238
4246
|
}
|
|
4247
|
+
.via-blue-50\/20 {
|
|
4248
|
+
--tw-gradient-via: color-mix(in srgb, oklch(97% 0.014 254.604) 20%, transparent);
|
|
4249
|
+
@supports (color: color-mix(in lab, red, red)) {
|
|
4250
|
+
--tw-gradient-via: color-mix(in oklab, var(--color-blue-50) 20%, transparent);
|
|
4251
|
+
}
|
|
4252
|
+
--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);
|
|
4253
|
+
--tw-gradient-stops: var(--tw-gradient-via-stops);
|
|
4254
|
+
}
|
|
4239
4255
|
.via-blue-400\/20 {
|
|
4240
4256
|
--tw-gradient-via: color-mix(in srgb, oklch(70.7% 0.165 254.624) 20%, transparent);
|
|
4241
4257
|
@supports (color: color-mix(in lab, red, red)) {
|
|
@@ -4257,6 +4273,11 @@
|
|
|
4257
4273
|
--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);
|
|
4258
4274
|
--tw-gradient-stops: var(--tw-gradient-via-stops);
|
|
4259
4275
|
}
|
|
4276
|
+
.via-cyan-50 {
|
|
4277
|
+
--tw-gradient-via: var(--color-cyan-50);
|
|
4278
|
+
--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);
|
|
4279
|
+
--tw-gradient-stops: var(--tw-gradient-via-stops);
|
|
4280
|
+
}
|
|
4260
4281
|
.via-cyan-400 {
|
|
4261
4282
|
--tw-gradient-via: var(--color-cyan-400);
|
|
4262
4283
|
--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);
|
|
@@ -4283,6 +4304,11 @@
|
|
|
4283
4304
|
--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);
|
|
4284
4305
|
--tw-gradient-stops: var(--tw-gradient-via-stops);
|
|
4285
4306
|
}
|
|
4307
|
+
.via-cyan-600 {
|
|
4308
|
+
--tw-gradient-via: var(--color-cyan-600);
|
|
4309
|
+
--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);
|
|
4310
|
+
--tw-gradient-stops: var(--tw-gradient-via-stops);
|
|
4311
|
+
}
|
|
4286
4312
|
.via-emerald-400 {
|
|
4287
4313
|
--tw-gradient-via: var(--color-emerald-400);
|
|
4288
4314
|
--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);
|
|
@@ -4451,6 +4477,14 @@
|
|
|
4451
4477
|
--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);
|
|
4452
4478
|
--tw-gradient-stops: var(--tw-gradient-via-stops);
|
|
4453
4479
|
}
|
|
4480
|
+
.via-slate-800\/95 {
|
|
4481
|
+
--tw-gradient-via: color-mix(in srgb, oklch(27.9% 0.041 260.031) 95%, transparent);
|
|
4482
|
+
@supports (color: color-mix(in lab, red, red)) {
|
|
4483
|
+
--tw-gradient-via: color-mix(in oklab, var(--color-slate-800) 95%, transparent);
|
|
4484
|
+
}
|
|
4485
|
+
--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);
|
|
4486
|
+
--tw-gradient-stops: var(--tw-gradient-via-stops);
|
|
4487
|
+
}
|
|
4454
4488
|
.via-teal-400\/10 {
|
|
4455
4489
|
--tw-gradient-via: color-mix(in srgb, oklch(77.7% 0.152 181.912) 10%, transparent);
|
|
4456
4490
|
@supports (color: color-mix(in lab, red, red)) {
|
|
@@ -5376,6 +5410,9 @@
|
|
|
5376
5410
|
.py-8 {
|
|
5377
5411
|
padding-block: calc(var(--spacing) * 8);
|
|
5378
5412
|
}
|
|
5413
|
+
.py-10 {
|
|
5414
|
+
padding-block: calc(var(--spacing) * 10);
|
|
5415
|
+
}
|
|
5379
5416
|
.py-12 {
|
|
5380
5417
|
padding-block: calc(var(--spacing) * 12);
|
|
5381
5418
|
}
|
|
@@ -5642,6 +5679,9 @@
|
|
|
5642
5679
|
.text-cyan-400 {
|
|
5643
5680
|
color: var(--color-cyan-400);
|
|
5644
5681
|
}
|
|
5682
|
+
.text-cyan-600 {
|
|
5683
|
+
color: var(--color-cyan-600);
|
|
5684
|
+
}
|
|
5645
5685
|
.text-cyan-700 {
|
|
5646
5686
|
color: var(--color-cyan-700);
|
|
5647
5687
|
}
|
|
@@ -5995,6 +6035,9 @@
|
|
|
5995
6035
|
.opacity-5 {
|
|
5996
6036
|
opacity: 5%;
|
|
5997
6037
|
}
|
|
6038
|
+
.opacity-10 {
|
|
6039
|
+
opacity: 10%;
|
|
6040
|
+
}
|
|
5998
6041
|
.opacity-25 {
|
|
5999
6042
|
opacity: 25%;
|
|
6000
6043
|
}
|
|
@@ -8037,6 +8080,24 @@
|
|
|
8037
8080
|
}
|
|
8038
8081
|
}
|
|
8039
8082
|
}
|
|
8083
|
+
.hover\:via-cyan-500 {
|
|
8084
|
+
&:hover {
|
|
8085
|
+
@media (hover: hover) {
|
|
8086
|
+
--tw-gradient-via: var(--color-cyan-500);
|
|
8087
|
+
--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);
|
|
8088
|
+
--tw-gradient-stops: var(--tw-gradient-via-stops);
|
|
8089
|
+
}
|
|
8090
|
+
}
|
|
8091
|
+
}
|
|
8092
|
+
.hover\:via-cyan-700 {
|
|
8093
|
+
&:hover {
|
|
8094
|
+
@media (hover: hover) {
|
|
8095
|
+
--tw-gradient-via: var(--color-cyan-700);
|
|
8096
|
+
--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);
|
|
8097
|
+
--tw-gradient-stops: var(--tw-gradient-via-stops);
|
|
8098
|
+
}
|
|
8099
|
+
}
|
|
8100
|
+
}
|
|
8040
8101
|
.hover\:to-blue-600 {
|
|
8041
8102
|
&:hover {
|
|
8042
8103
|
@media (hover: hover) {
|
|
@@ -8104,6 +8165,14 @@
|
|
|
8104
8165
|
}
|
|
8105
8166
|
}
|
|
8106
8167
|
}
|
|
8168
|
+
.hover\:to-teal-500 {
|
|
8169
|
+
&:hover {
|
|
8170
|
+
@media (hover: hover) {
|
|
8171
|
+
--tw-gradient-to: var(--color-teal-500);
|
|
8172
|
+
--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));
|
|
8173
|
+
}
|
|
8174
|
+
}
|
|
8175
|
+
}
|
|
8107
8176
|
.hover\:to-teal-700 {
|
|
8108
8177
|
&:hover {
|
|
8109
8178
|
@media (hover: hover) {
|
|
@@ -8414,6 +8483,16 @@
|
|
|
8414
8483
|
}
|
|
8415
8484
|
}
|
|
8416
8485
|
}
|
|
8486
|
+
.hover\:shadow-blue-500\/25 {
|
|
8487
|
+
&:hover {
|
|
8488
|
+
@media (hover: hover) {
|
|
8489
|
+
--tw-shadow-color: color-mix(in srgb, oklch(62.3% 0.214 259.815) 25%, transparent);
|
|
8490
|
+
@supports (color: color-mix(in lab, red, red)) {
|
|
8491
|
+
--tw-shadow-color: color-mix(in oklab, color-mix(in oklab, var(--color-blue-500) 25%, transparent) var(--tw-shadow-alpha), transparent);
|
|
8492
|
+
}
|
|
8493
|
+
}
|
|
8494
|
+
}
|
|
8495
|
+
}
|
|
8417
8496
|
.hover\:shadow-blue-500\/30 {
|
|
8418
8497
|
&:hover {
|
|
8419
8498
|
@media (hover: hover) {
|
|
@@ -8424,6 +8503,16 @@
|
|
|
8424
8503
|
}
|
|
8425
8504
|
}
|
|
8426
8505
|
}
|
|
8506
|
+
.hover\:shadow-blue-600\/25 {
|
|
8507
|
+
&:hover {
|
|
8508
|
+
@media (hover: hover) {
|
|
8509
|
+
--tw-shadow-color: color-mix(in srgb, oklch(54.6% 0.245 262.881) 25%, transparent);
|
|
8510
|
+
@supports (color: color-mix(in lab, red, red)) {
|
|
8511
|
+
--tw-shadow-color: color-mix(in oklab, color-mix(in oklab, var(--color-blue-600) 25%, transparent) var(--tw-shadow-alpha), transparent);
|
|
8512
|
+
}
|
|
8513
|
+
}
|
|
8514
|
+
}
|
|
8515
|
+
}
|
|
8427
8516
|
.hover\:shadow-emerald-100\/50 {
|
|
8428
8517
|
&:hover {
|
|
8429
8518
|
@media (hover: hover) {
|