@nocoo/basalt 2.0.0 → 2.0.2
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/components/alert-dialog.js +1 -0
- package/dist/components/alert-dialog.js.map +1 -1
- package/dist/components/button.js +2 -2
- package/dist/components/button.js.map +1 -1
- package/dist/components/description-list.d.ts +21 -0
- package/dist/components/description-list.js +35 -0
- package/dist/components/description-list.js.map +1 -0
- package/dist/components/dialog.js +2 -1
- package/dist/components/dialog.js.map +1 -1
- package/dist/components/layer-card.d.ts +23 -4
- package/dist/components/layer-card.js +83 -50
- package/dist/components/layer-card.js.map +1 -1
- package/dist/components/page-header.d.ts +4 -4
- package/dist/components/page-header.js +20 -23
- package/dist/components/page-header.js.map +1 -1
- package/dist/components/section-rule.d.ts +10 -0
- package/dist/components/section-rule.js +44 -0
- package/dist/components/section-rule.js.map +1 -0
- package/dist/components/sheet.d.ts +4 -4
- package/dist/components/sheet.js +5 -4
- package/dist/components/sheet.js.map +1 -1
- package/dist/components/sidebar.js +1 -0
- package/dist/components/sidebar.js.map +1 -1
- package/dist/components/table.js +6 -5
- package/dist/components/table.js.map +1 -1
- package/dist/index.d.ts +1 -0
- package/dist/index.js +26 -25
- package/dist/providers/accent.d.ts +3 -2
- package/dist/providers/accent.js +166 -44
- package/dist/providers/accent.js.map +1 -1
- package/dist/styles/standalone.css +269 -92
- package/dist/styles/tailwind.css +1 -0
- package/dist/styles/tokens.css +69 -0
- package/dist/utils/control-surface.d.ts +1 -1
- package/dist/utils/control-surface.js +1 -1
- package/dist/utils/control-surface.js.map +1 -1
- package/package.json +1 -1
|
@@ -26,10 +26,13 @@
|
|
|
26
26
|
--font-weight-semibold: 600;
|
|
27
27
|
--tracking-tight: -0.025em;
|
|
28
28
|
--tracking-wide: 0.025em;
|
|
29
|
+
--tracking-wider: 0.05em;
|
|
30
|
+
--tracking-widest: 0.1em;
|
|
29
31
|
--radius-sm: 0.25rem;
|
|
30
32
|
--radius-md: 0.375rem;
|
|
31
33
|
--radius-lg: 0.5rem;
|
|
32
34
|
--ease-out: cubic-bezier(0, 0, 0.2, 1);
|
|
35
|
+
--ease-in-out: cubic-bezier(0.4, 0, 0.2, 1);
|
|
33
36
|
--blur-xs: 4px;
|
|
34
37
|
--blur-md: 12px;
|
|
35
38
|
--default-transition-duration: 150ms;
|
|
@@ -63,6 +66,8 @@
|
|
|
63
66
|
--basalt-border: 220 13% 88%;
|
|
64
67
|
--basalt-input: 220 13% 88%;
|
|
65
68
|
--basalt-ring: 217 91% 60%;
|
|
69
|
+
--basalt-control-fill: hsl(var(--basalt-secondary));
|
|
70
|
+
--basalt-zebra-fill: hsl(var(--basalt-bright));
|
|
66
71
|
--basalt-radius: 0.75rem;
|
|
67
72
|
--basalt-radius-island: 20px;
|
|
68
73
|
--basalt-radius-card: 14px;
|
|
@@ -139,6 +144,8 @@
|
|
|
139
144
|
--basalt-border: 0 0% 16%;
|
|
140
145
|
--basalt-input: 0 0% 18%;
|
|
141
146
|
--basalt-ring: 217 91% 60%;
|
|
147
|
+
--basalt-control-fill: hsl(var(--basalt-secondary));
|
|
148
|
+
--basalt-zebra-fill: hsl(var(--basalt-bright));
|
|
142
149
|
--basalt-chart-1: 217 91% 65%;
|
|
143
150
|
--basalt-chart-2: 200 90% 60%;
|
|
144
151
|
--basalt-chart-3: 186 80% 50%;
|
|
@@ -182,6 +189,58 @@
|
|
|
182
189
|
--basalt-heatmap-orange-3: 30 60% 45%;
|
|
183
190
|
--basalt-heatmap-orange-4: 30 65% 55%;
|
|
184
191
|
}
|
|
192
|
+
[data-basalt-surface-root] {
|
|
193
|
+
background: hsl(var(--basalt-card));
|
|
194
|
+
--basalt-control-fill: hsl(var(--basalt-card));
|
|
195
|
+
--basalt-zebra-fill: hsl(var(--basalt-secondary));
|
|
196
|
+
}
|
|
197
|
+
[data-basalt-surface-root] [data-basalt-surface] {
|
|
198
|
+
background: hsl(var(--basalt-secondary));
|
|
199
|
+
--basalt-control-fill: hsl(var(--basalt-secondary));
|
|
200
|
+
--basalt-zebra-fill: hsl(var(--basalt-bright));
|
|
201
|
+
}
|
|
202
|
+
[data-basalt-surface-root] [data-basalt-surface] [data-basalt-surface] {
|
|
203
|
+
background: hsl(var(--basalt-bright));
|
|
204
|
+
--basalt-control-fill: hsl(var(--basalt-bright));
|
|
205
|
+
--basalt-zebra-fill: transparent;
|
|
206
|
+
}
|
|
207
|
+
[data-basalt-surface-root] [data-basalt-surface] [data-basalt-surface] [data-basalt-surface] {
|
|
208
|
+
background: transparent;
|
|
209
|
+
--basalt-control-fill: hsl(var(--basalt-bright));
|
|
210
|
+
--basalt-zebra-fill: transparent;
|
|
211
|
+
}
|
|
212
|
+
[data-basalt-surface]:not([data-basalt-surface-root] *):not([data-basalt-surface] *) {
|
|
213
|
+
background: hsl(var(--basalt-card));
|
|
214
|
+
--basalt-control-fill: hsl(var(--basalt-card));
|
|
215
|
+
--basalt-zebra-fill: hsl(var(--basalt-secondary));
|
|
216
|
+
}
|
|
217
|
+
[data-basalt-surface]:not([data-basalt-surface-root] *) [data-basalt-surface] {
|
|
218
|
+
background: hsl(var(--basalt-secondary));
|
|
219
|
+
--basalt-control-fill: hsl(var(--basalt-secondary));
|
|
220
|
+
--basalt-zebra-fill: hsl(var(--basalt-bright));
|
|
221
|
+
}
|
|
222
|
+
[data-basalt-surface]:not([data-basalt-surface-root] *) [data-basalt-surface] [data-basalt-surface] {
|
|
223
|
+
background: hsl(var(--basalt-bright));
|
|
224
|
+
--basalt-control-fill: hsl(var(--basalt-bright));
|
|
225
|
+
--basalt-zebra-fill: transparent;
|
|
226
|
+
}
|
|
227
|
+
[data-basalt-surface]:not([data-basalt-surface-root] *) [data-basalt-surface] [data-basalt-surface] [data-basalt-surface] {
|
|
228
|
+
background: transparent;
|
|
229
|
+
--basalt-control-fill: hsl(var(--basalt-bright));
|
|
230
|
+
--basalt-zebra-fill: transparent;
|
|
231
|
+
}
|
|
232
|
+
[data-basalt-table] tbody tr[aria-selected="true"] td {
|
|
233
|
+
background: hsl(var(--basalt-accent));
|
|
234
|
+
}
|
|
235
|
+
[data-basalt-table] tbody tr:hover:not([aria-selected="true"]) td {
|
|
236
|
+
background: hsl(var(--basalt-primary));
|
|
237
|
+
@supports (color: color-mix(in lab, red, red)) {
|
|
238
|
+
background: color-mix(in oklab, hsl(var(--basalt-primary)) 3%, var(--basalt-control-fill));
|
|
239
|
+
}
|
|
240
|
+
}
|
|
241
|
+
[data-basalt-table] tbody tr:nth-child(even):not([aria-selected="true"]):not(:hover) td {
|
|
242
|
+
background: var(--basalt-zebra-fill);
|
|
243
|
+
}
|
|
185
244
|
@keyframes basalt-accordion-down {
|
|
186
245
|
from {
|
|
187
246
|
height: 0;
|
|
@@ -326,6 +385,9 @@
|
|
|
326
385
|
.relative {
|
|
327
386
|
position: relative;
|
|
328
387
|
}
|
|
388
|
+
.sticky {
|
|
389
|
+
position: sticky;
|
|
390
|
+
}
|
|
329
391
|
.inset-0 {
|
|
330
392
|
inset: 0px;
|
|
331
393
|
}
|
|
@@ -344,6 +406,9 @@
|
|
|
344
406
|
.top-2 {
|
|
345
407
|
top: calc(var(--spacing) * 2);
|
|
346
408
|
}
|
|
409
|
+
.top-full {
|
|
410
|
+
top: 100%;
|
|
411
|
+
}
|
|
347
412
|
.right-0 {
|
|
348
413
|
right: 0px;
|
|
349
414
|
}
|
|
@@ -362,18 +427,30 @@
|
|
|
362
427
|
.left-1\/2 {
|
|
363
428
|
left: calc(1 / 2 * 100%);
|
|
364
429
|
}
|
|
430
|
+
.z-20 {
|
|
431
|
+
z-index: 20;
|
|
432
|
+
}
|
|
365
433
|
.z-50 {
|
|
366
434
|
z-index: 50;
|
|
367
435
|
}
|
|
436
|
+
.-order-1 {
|
|
437
|
+
order: calc(1 * -1);
|
|
438
|
+
}
|
|
439
|
+
.order-1 {
|
|
440
|
+
order: 1;
|
|
441
|
+
}
|
|
442
|
+
.order-last {
|
|
443
|
+
order: 9999;
|
|
444
|
+
}
|
|
368
445
|
.m-0 {
|
|
369
446
|
margin: 0px;
|
|
370
447
|
}
|
|
448
|
+
.-mx-1 {
|
|
449
|
+
margin-inline: calc(var(--spacing) * -1);
|
|
450
|
+
}
|
|
371
451
|
.mx-1\.5 {
|
|
372
452
|
margin-inline: calc(var(--spacing) * 1.5);
|
|
373
453
|
}
|
|
374
|
-
.-my-2 {
|
|
375
|
-
margin-block: calc(var(--spacing) * -2);
|
|
376
|
-
}
|
|
377
454
|
.my-2 {
|
|
378
455
|
margin-block: calc(var(--spacing) * 2);
|
|
379
456
|
}
|
|
@@ -392,6 +469,9 @@
|
|
|
392
469
|
.mr-1 {
|
|
393
470
|
margin-right: var(--spacing);
|
|
394
471
|
}
|
|
472
|
+
.mr-2 {
|
|
473
|
+
margin-right: calc(var(--spacing) * 2);
|
|
474
|
+
}
|
|
395
475
|
.mb-1 {
|
|
396
476
|
margin-bottom: var(--spacing);
|
|
397
477
|
}
|
|
@@ -404,6 +484,9 @@
|
|
|
404
484
|
.-ml-0\.5 {
|
|
405
485
|
margin-left: calc(var(--spacing) * -0.5);
|
|
406
486
|
}
|
|
487
|
+
.ml-auto {
|
|
488
|
+
margin-left: auto;
|
|
489
|
+
}
|
|
407
490
|
.box-border {
|
|
408
491
|
box-sizing: border-box;
|
|
409
492
|
}
|
|
@@ -447,6 +530,10 @@
|
|
|
447
530
|
width: calc(var(--spacing) * 4);
|
|
448
531
|
height: calc(var(--spacing) * 4);
|
|
449
532
|
}
|
|
533
|
+
.size-8 {
|
|
534
|
+
width: calc(var(--spacing) * 8);
|
|
535
|
+
height: calc(var(--spacing) * 8);
|
|
536
|
+
}
|
|
450
537
|
.size-full {
|
|
451
538
|
width: 100%;
|
|
452
539
|
height: 100%;
|
|
@@ -490,6 +577,9 @@
|
|
|
490
577
|
.h-10 {
|
|
491
578
|
height: calc(var(--spacing) * 10);
|
|
492
579
|
}
|
|
580
|
+
.h-11 {
|
|
581
|
+
height: calc(var(--spacing) * 11);
|
|
582
|
+
}
|
|
493
583
|
.h-14 {
|
|
494
584
|
height: calc(var(--spacing) * 14);
|
|
495
585
|
}
|
|
@@ -511,6 +601,9 @@
|
|
|
511
601
|
.h-screen {
|
|
512
602
|
height: 100vh;
|
|
513
603
|
}
|
|
604
|
+
.max-h-\[300px\] {
|
|
605
|
+
max-height: 300px;
|
|
606
|
+
}
|
|
514
607
|
.max-h-\[calc\(100vh-2rem\)\] {
|
|
515
608
|
max-height: calc(100vh - 2rem);
|
|
516
609
|
}
|
|
@@ -589,12 +682,18 @@
|
|
|
589
682
|
.w-80 {
|
|
590
683
|
width: calc(var(--spacing) * 80);
|
|
591
684
|
}
|
|
685
|
+
.w-\[68px\] {
|
|
686
|
+
width: 68px;
|
|
687
|
+
}
|
|
592
688
|
.w-\[calc\(100\%-0\.75rem\)\] {
|
|
593
689
|
width: calc(100% - 0.75rem);
|
|
594
690
|
}
|
|
595
691
|
.w-\[var\(--radix-select-trigger-width\)\] {
|
|
596
692
|
width: var(--radix-select-trigger-width);
|
|
597
693
|
}
|
|
694
|
+
.w-auto\! {
|
|
695
|
+
width: auto !important;
|
|
696
|
+
}
|
|
598
697
|
.w-fit {
|
|
599
698
|
width: fit-content;
|
|
600
699
|
}
|
|
@@ -616,6 +715,9 @@
|
|
|
616
715
|
.min-w-0 {
|
|
617
716
|
min-width: 0px;
|
|
618
717
|
}
|
|
718
|
+
.min-w-4 {
|
|
719
|
+
min-width: calc(var(--spacing) * 4);
|
|
720
|
+
}
|
|
619
721
|
.min-w-9 {
|
|
620
722
|
min-width: calc(var(--spacing) * 9);
|
|
621
723
|
}
|
|
@@ -657,6 +759,9 @@
|
|
|
657
759
|
--tw-translate-y: calc(calc(1 / 2 * 100%) * -1);
|
|
658
760
|
translate: var(--tw-translate-x) var(--tw-translate-y);
|
|
659
761
|
}
|
|
762
|
+
.rotate-180 {
|
|
763
|
+
rotate: 180deg;
|
|
764
|
+
}
|
|
660
765
|
.animate-basalt-loader {
|
|
661
766
|
animation: basalt-loader-spin 1.4s linear infinite;
|
|
662
767
|
}
|
|
@@ -672,6 +777,9 @@
|
|
|
672
777
|
.cursor-default {
|
|
673
778
|
cursor: default;
|
|
674
779
|
}
|
|
780
|
+
.cursor-not-allowed {
|
|
781
|
+
cursor: not-allowed;
|
|
782
|
+
}
|
|
675
783
|
.cursor-pointer {
|
|
676
784
|
cursor: pointer;
|
|
677
785
|
}
|
|
@@ -720,6 +828,9 @@
|
|
|
720
828
|
.justify-end {
|
|
721
829
|
justify-content: flex-end;
|
|
722
830
|
}
|
|
831
|
+
.justify-start {
|
|
832
|
+
justify-content: flex-start;
|
|
833
|
+
}
|
|
723
834
|
.gap-0\.5 {
|
|
724
835
|
gap: calc(var(--spacing) * 0.5);
|
|
725
836
|
}
|
|
@@ -761,11 +872,22 @@
|
|
|
761
872
|
margin-block-start: calc(calc(var(--spacing) * 2) * var(--tw-space-y-reverse));
|
|
762
873
|
margin-block-end: calc(calc(var(--spacing) * 2) * calc(1 - var(--tw-space-y-reverse)));
|
|
763
874
|
}
|
|
875
|
+
:where(.space-y-3 > :not(:last-child)) {
|
|
876
|
+
--tw-space-y-reverse: 0;
|
|
877
|
+
margin-block-start: calc(calc(var(--spacing) * 3) * var(--tw-space-y-reverse));
|
|
878
|
+
margin-block-end: calc(calc(var(--spacing) * 3) * calc(1 - var(--tw-space-y-reverse)));
|
|
879
|
+
}
|
|
764
880
|
:where(.space-y-4 > :not(:last-child)) {
|
|
765
881
|
--tw-space-y-reverse: 0;
|
|
766
882
|
margin-block-start: calc(calc(var(--spacing) * 4) * var(--tw-space-y-reverse));
|
|
767
883
|
margin-block-end: calc(calc(var(--spacing) * 4) * calc(1 - var(--tw-space-y-reverse)));
|
|
768
884
|
}
|
|
885
|
+
.gap-x-8 {
|
|
886
|
+
column-gap: calc(var(--spacing) * 8);
|
|
887
|
+
}
|
|
888
|
+
.gap-y-3 {
|
|
889
|
+
row-gap: calc(var(--spacing) * 3);
|
|
890
|
+
}
|
|
769
891
|
.self-stretch {
|
|
770
892
|
align-self: stretch;
|
|
771
893
|
}
|
|
@@ -783,18 +905,27 @@
|
|
|
783
905
|
.overflow-x-auto {
|
|
784
906
|
overflow-x: auto;
|
|
785
907
|
}
|
|
908
|
+
.overflow-x-hidden {
|
|
909
|
+
overflow-x: hidden;
|
|
910
|
+
}
|
|
786
911
|
.overflow-x-hidden\! {
|
|
787
912
|
overflow-x: hidden !important;
|
|
788
913
|
}
|
|
789
914
|
.overflow-y-auto {
|
|
790
915
|
overflow-y: auto;
|
|
791
916
|
}
|
|
917
|
+
.overflow-y-hidden {
|
|
918
|
+
overflow-y: hidden;
|
|
919
|
+
}
|
|
792
920
|
.overflow-y-hidden\! {
|
|
793
921
|
overflow-y: hidden !important;
|
|
794
922
|
}
|
|
795
923
|
.rounded-\[4px\] {
|
|
796
924
|
border-radius: 4px;
|
|
797
925
|
}
|
|
926
|
+
.rounded-\[16px\] {
|
|
927
|
+
border-radius: 16px;
|
|
928
|
+
}
|
|
798
929
|
.rounded-\[inherit\] {
|
|
799
930
|
border-radius: inherit;
|
|
800
931
|
}
|
|
@@ -810,6 +941,9 @@
|
|
|
810
941
|
.rounded-full {
|
|
811
942
|
border-radius: calc(infinity * 1px);
|
|
812
943
|
}
|
|
944
|
+
.rounded-lg {
|
|
945
|
+
border-radius: var(--radius-lg);
|
|
946
|
+
}
|
|
813
947
|
.rounded-md {
|
|
814
948
|
border-radius: var(--radius-md);
|
|
815
949
|
}
|
|
@@ -859,6 +993,10 @@
|
|
|
859
993
|
border-left-style: var(--tw-border-style);
|
|
860
994
|
border-left-width: 2px;
|
|
861
995
|
}
|
|
996
|
+
.border-dashed {
|
|
997
|
+
--tw-border-style: dashed;
|
|
998
|
+
border-style: dashed;
|
|
999
|
+
}
|
|
862
1000
|
.border-none {
|
|
863
1001
|
--tw-border-style: none;
|
|
864
1002
|
border-style: none;
|
|
@@ -878,15 +1016,15 @@
|
|
|
878
1016
|
.border-l-transparent {
|
|
879
1017
|
border-left-color: transparent;
|
|
880
1018
|
}
|
|
1019
|
+
.bg-basalt-accent {
|
|
1020
|
+
background-color: hsl(var(--basalt-accent));
|
|
1021
|
+
}
|
|
881
1022
|
.bg-basalt-background {
|
|
882
1023
|
background-color: hsl(var(--basalt-background));
|
|
883
1024
|
}
|
|
884
1025
|
.bg-basalt-border {
|
|
885
1026
|
background-color: hsl(var(--basalt-border));
|
|
886
1027
|
}
|
|
887
|
-
.bg-basalt-bright {
|
|
888
|
-
background-color: hsl(var(--basalt-bright));
|
|
889
|
-
}
|
|
890
1028
|
.bg-basalt-card {
|
|
891
1029
|
background-color: hsl(var(--basalt-card));
|
|
892
1030
|
}
|
|
@@ -896,6 +1034,9 @@
|
|
|
896
1034
|
.bg-basalt-chart-14 {
|
|
897
1035
|
background-color: hsl(var(--basalt-chart-14));
|
|
898
1036
|
}
|
|
1037
|
+
.bg-basalt-control {
|
|
1038
|
+
background-color: var(--basalt-control-fill);
|
|
1039
|
+
}
|
|
899
1040
|
.bg-basalt-danger {
|
|
900
1041
|
background-color: hsl(var(--basalt-danger));
|
|
901
1042
|
}
|
|
@@ -991,6 +1132,9 @@
|
|
|
991
1132
|
.p-0\.5 {
|
|
992
1133
|
padding: calc(var(--spacing) * 0.5);
|
|
993
1134
|
}
|
|
1135
|
+
.p-1 {
|
|
1136
|
+
padding: var(--spacing);
|
|
1137
|
+
}
|
|
994
1138
|
.p-2 {
|
|
995
1139
|
padding: calc(var(--spacing) * 2);
|
|
996
1140
|
}
|
|
@@ -1000,9 +1144,6 @@
|
|
|
1000
1144
|
.p-4 {
|
|
1001
1145
|
padding: calc(var(--spacing) * 4);
|
|
1002
1146
|
}
|
|
1003
|
-
.p-5 {
|
|
1004
|
-
padding: calc(var(--spacing) * 5);
|
|
1005
|
-
}
|
|
1006
1147
|
.p-6 {
|
|
1007
1148
|
padding: calc(var(--spacing) * 6);
|
|
1008
1149
|
}
|
|
@@ -1015,6 +1156,9 @@
|
|
|
1015
1156
|
.px-1 {
|
|
1016
1157
|
padding-inline: var(--spacing);
|
|
1017
1158
|
}
|
|
1159
|
+
.px-1\.5 {
|
|
1160
|
+
padding-inline: calc(var(--spacing) * 1.5);
|
|
1161
|
+
}
|
|
1018
1162
|
.px-2 {
|
|
1019
1163
|
padding-inline: calc(var(--spacing) * 2);
|
|
1020
1164
|
}
|
|
@@ -1030,6 +1174,9 @@
|
|
|
1030
1174
|
.px-6 {
|
|
1031
1175
|
padding-inline: calc(var(--spacing) * 6);
|
|
1032
1176
|
}
|
|
1177
|
+
.py-0 {
|
|
1178
|
+
padding-block: 0px;
|
|
1179
|
+
}
|
|
1033
1180
|
.py-0\.5 {
|
|
1034
1181
|
padding-block: calc(var(--spacing) * 0.5);
|
|
1035
1182
|
}
|
|
@@ -1042,12 +1189,21 @@
|
|
|
1042
1189
|
.py-2 {
|
|
1043
1190
|
padding-block: calc(var(--spacing) * 2);
|
|
1044
1191
|
}
|
|
1192
|
+
.py-2\.5 {
|
|
1193
|
+
padding-block: calc(var(--spacing) * 2.5);
|
|
1194
|
+
}
|
|
1045
1195
|
.py-3 {
|
|
1046
1196
|
padding-block: calc(var(--spacing) * 3);
|
|
1047
1197
|
}
|
|
1198
|
+
.py-6 {
|
|
1199
|
+
padding-block: calc(var(--spacing) * 6);
|
|
1200
|
+
}
|
|
1048
1201
|
.py-8 {
|
|
1049
1202
|
padding-block: calc(var(--spacing) * 8);
|
|
1050
1203
|
}
|
|
1204
|
+
.pt-3 {
|
|
1205
|
+
padding-top: calc(var(--spacing) * 3);
|
|
1206
|
+
}
|
|
1051
1207
|
.pr-1 {
|
|
1052
1208
|
padding-right: var(--spacing);
|
|
1053
1209
|
}
|
|
@@ -1066,6 +1222,9 @@
|
|
|
1066
1222
|
.pb-1 {
|
|
1067
1223
|
padding-bottom: var(--spacing);
|
|
1068
1224
|
}
|
|
1225
|
+
.pl-3 {
|
|
1226
|
+
padding-left: calc(var(--spacing) * 3);
|
|
1227
|
+
}
|
|
1069
1228
|
.pl-4 {
|
|
1070
1229
|
padding-left: calc(var(--spacing) * 4);
|
|
1071
1230
|
}
|
|
@@ -1108,6 +1267,9 @@
|
|
|
1108
1267
|
font-size: var(--text-xs);
|
|
1109
1268
|
line-height: var(--tw-leading, var(--text-xs--line-height));
|
|
1110
1269
|
}
|
|
1270
|
+
.text-\[10px\] {
|
|
1271
|
+
font-size: 10px;
|
|
1272
|
+
}
|
|
1111
1273
|
.text-\[11px\] {
|
|
1112
1274
|
font-size: 11px;
|
|
1113
1275
|
}
|
|
@@ -1131,6 +1293,10 @@
|
|
|
1131
1293
|
--tw-font-weight: var(--font-weight-semibold);
|
|
1132
1294
|
font-weight: var(--font-weight-semibold);
|
|
1133
1295
|
}
|
|
1296
|
+
.tracking-\[0\.14em\] {
|
|
1297
|
+
--tw-tracking: 0.14em;
|
|
1298
|
+
letter-spacing: 0.14em;
|
|
1299
|
+
}
|
|
1134
1300
|
.tracking-tight {
|
|
1135
1301
|
--tw-tracking: var(--tracking-tight);
|
|
1136
1302
|
letter-spacing: var(--tracking-tight);
|
|
@@ -1139,6 +1305,20 @@
|
|
|
1139
1305
|
--tw-tracking: var(--tracking-wide);
|
|
1140
1306
|
letter-spacing: var(--tracking-wide);
|
|
1141
1307
|
}
|
|
1308
|
+
.tracking-wider {
|
|
1309
|
+
--tw-tracking: var(--tracking-wider);
|
|
1310
|
+
letter-spacing: var(--tracking-wider);
|
|
1311
|
+
}
|
|
1312
|
+
.tracking-widest {
|
|
1313
|
+
--tw-tracking: var(--tracking-widest);
|
|
1314
|
+
letter-spacing: var(--tracking-widest);
|
|
1315
|
+
}
|
|
1316
|
+
.wrap-break-word {
|
|
1317
|
+
overflow-wrap: break-word;
|
|
1318
|
+
}
|
|
1319
|
+
.text-basalt-card-foreground {
|
|
1320
|
+
color: hsl(var(--basalt-card-foreground));
|
|
1321
|
+
}
|
|
1142
1322
|
.text-basalt-danger {
|
|
1143
1323
|
color: hsl(var(--basalt-danger));
|
|
1144
1324
|
}
|
|
@@ -1238,6 +1418,12 @@
|
|
|
1238
1418
|
.ring-basalt-border {
|
|
1239
1419
|
--tw-ring-color: hsl(var(--basalt-border));
|
|
1240
1420
|
}
|
|
1421
|
+
.ring-basalt-border\/40 {
|
|
1422
|
+
--tw-ring-color: hsl(var(--basalt-border));
|
|
1423
|
+
@supports (color: color-mix(in lab, red, red)) {
|
|
1424
|
+
--tw-ring-color: color-mix(in oklab, hsl(var(--basalt-border)) 40%, transparent);
|
|
1425
|
+
}
|
|
1426
|
+
}
|
|
1241
1427
|
.ring-basalt-border\/70 {
|
|
1242
1428
|
--tw-ring-color: hsl(var(--basalt-border));
|
|
1243
1429
|
@supports (color: color-mix(in lab, red, red)) {
|
|
@@ -1256,9 +1442,6 @@
|
|
|
1256
1442
|
outline-style: var(--tw-outline-style);
|
|
1257
1443
|
outline-width: 1px;
|
|
1258
1444
|
}
|
|
1259
|
-
.filter {
|
|
1260
|
-
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,);
|
|
1261
|
-
}
|
|
1262
1445
|
.backdrop-blur-md {
|
|
1263
1446
|
--tw-backdrop-blur: blur(var(--blur-md));
|
|
1264
1447
|
-webkit-backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,);
|
|
@@ -1279,6 +1462,11 @@
|
|
|
1279
1462
|
transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
|
|
1280
1463
|
transition-duration: var(--tw-duration, var(--default-transition-duration));
|
|
1281
1464
|
}
|
|
1465
|
+
.transition-all {
|
|
1466
|
+
transition-property: all;
|
|
1467
|
+
transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
|
|
1468
|
+
transition-duration: var(--tw-duration, var(--default-transition-duration));
|
|
1469
|
+
}
|
|
1282
1470
|
.transition-colors {
|
|
1283
1471
|
transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to;
|
|
1284
1472
|
transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
|
|
@@ -1293,6 +1481,14 @@
|
|
|
1293
1481
|
--tw-duration: 200ms;
|
|
1294
1482
|
transition-duration: 200ms;
|
|
1295
1483
|
}
|
|
1484
|
+
.duration-300 {
|
|
1485
|
+
--tw-duration: 300ms;
|
|
1486
|
+
transition-duration: 300ms;
|
|
1487
|
+
}
|
|
1488
|
+
.ease-in-out {
|
|
1489
|
+
--tw-ease: var(--ease-in-out);
|
|
1490
|
+
transition-timing-function: var(--ease-in-out);
|
|
1491
|
+
}
|
|
1296
1492
|
.ease-out {
|
|
1297
1493
|
--tw-ease: var(--ease-out);
|
|
1298
1494
|
transition-timing-function: var(--ease-out);
|
|
@@ -1305,6 +1501,9 @@
|
|
|
1305
1501
|
-webkit-user-select: none;
|
|
1306
1502
|
user-select: none;
|
|
1307
1503
|
}
|
|
1504
|
+
:is(.\*\:pointer-events-auto > *) {
|
|
1505
|
+
pointer-events: auto;
|
|
1506
|
+
}
|
|
1308
1507
|
.group-data-\[state\=checked\]\:block:is(:where(.group)[data-state="checked"] *) {
|
|
1309
1508
|
display: block;
|
|
1310
1509
|
}
|
|
@@ -1339,19 +1538,16 @@
|
|
|
1339
1538
|
border-top-left-radius: calc(var(--basalt-radius) - 2px);
|
|
1340
1539
|
border-bottom-left-radius: calc(var(--basalt-radius) - 2px);
|
|
1341
1540
|
}
|
|
1342
|
-
.first\:rounded-tl-basalt-md:first-child {
|
|
1343
|
-
border-top-left-radius: calc(var(--basalt-radius) - 2px);
|
|
1344
|
-
}
|
|
1345
1541
|
.last\:rounded-r-basalt-md:last-child {
|
|
1346
1542
|
border-top-right-radius: calc(var(--basalt-radius) - 2px);
|
|
1347
1543
|
border-bottom-right-radius: calc(var(--basalt-radius) - 2px);
|
|
1348
1544
|
}
|
|
1349
|
-
.last\:rounded-tr-basalt-md:last-child {
|
|
1350
|
-
border-top-right-radius: calc(var(--basalt-radius) - 2px);
|
|
1351
|
-
}
|
|
1352
1545
|
.focus-within\:z-2:focus-within {
|
|
1353
1546
|
z-index: 2;
|
|
1354
1547
|
}
|
|
1548
|
+
.focus-within\:border-basalt-ring:focus-within {
|
|
1549
|
+
border-color: hsl(var(--basalt-ring));
|
|
1550
|
+
}
|
|
1355
1551
|
@media (hover: hover) {
|
|
1356
1552
|
.hover\:bg-basalt-accent:hover {
|
|
1357
1553
|
background-color: hsl(var(--basalt-accent));
|
|
@@ -1446,9 +1642,16 @@
|
|
|
1446
1642
|
.focus-visible\:border-basalt-ring:focus-visible {
|
|
1447
1643
|
border-color: hsl(var(--basalt-ring));
|
|
1448
1644
|
}
|
|
1645
|
+
.focus-visible\:border-transparent:focus-visible {
|
|
1646
|
+
border-color: transparent;
|
|
1647
|
+
}
|
|
1449
1648
|
.focus-visible\:bg-basalt-accent:focus-visible {
|
|
1450
1649
|
background-color: hsl(var(--basalt-accent));
|
|
1451
1650
|
}
|
|
1651
|
+
.focus-visible\:ring-0:focus-visible {
|
|
1652
|
+
--tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(0px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
|
|
1653
|
+
box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
|
|
1654
|
+
}
|
|
1452
1655
|
.focus-visible\:ring-1:focus-visible {
|
|
1453
1656
|
--tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
|
|
1454
1657
|
box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
|
|
@@ -1520,6 +1723,18 @@
|
|
|
1520
1723
|
background-color: transparent;
|
|
1521
1724
|
}
|
|
1522
1725
|
}
|
|
1726
|
+
.data-\[disabled\=true\]\:pointer-events-none[data-disabled="true"] {
|
|
1727
|
+
pointer-events: none;
|
|
1728
|
+
}
|
|
1729
|
+
.data-\[disabled\=true\]\:opacity-50[data-disabled="true"] {
|
|
1730
|
+
opacity: 50%;
|
|
1731
|
+
}
|
|
1732
|
+
.data-\[selected\=true\]\:bg-basalt-accent[data-selected="true"] {
|
|
1733
|
+
background-color: hsl(var(--basalt-accent));
|
|
1734
|
+
}
|
|
1735
|
+
.data-\[selected\=true\]\:text-basalt-accent-foreground[data-selected="true"] {
|
|
1736
|
+
color: hsl(var(--basalt-accent-foreground));
|
|
1737
|
+
}
|
|
1523
1738
|
.data-\[state\=active\]\:animate-basalt-tab-in[data-state="active"] {
|
|
1524
1739
|
animation: basalt-tab-in 180ms ease-out;
|
|
1525
1740
|
}
|
|
@@ -1596,6 +1811,9 @@
|
|
|
1596
1811
|
}
|
|
1597
1812
|
}
|
|
1598
1813
|
@media (width >= 40rem) {
|
|
1814
|
+
.sm\:inline-block {
|
|
1815
|
+
display: inline-block;
|
|
1816
|
+
}
|
|
1599
1817
|
.sm\:w-72 {
|
|
1600
1818
|
width: calc(var(--spacing) * 72);
|
|
1601
1819
|
}
|
|
@@ -1608,9 +1826,15 @@
|
|
|
1608
1826
|
.sm\:w-\[48rem\] {
|
|
1609
1827
|
width: 48rem;
|
|
1610
1828
|
}
|
|
1829
|
+
.sm\:grid-cols-1 {
|
|
1830
|
+
grid-template-columns: repeat(1, minmax(0, 1fr));
|
|
1831
|
+
}
|
|
1611
1832
|
.sm\:grid-cols-2 {
|
|
1612
1833
|
grid-template-columns: repeat(2, minmax(0, 1fr));
|
|
1613
1834
|
}
|
|
1835
|
+
.sm\:grid-cols-3 {
|
|
1836
|
+
grid-template-columns: repeat(3, minmax(0, 1fr));
|
|
1837
|
+
}
|
|
1614
1838
|
.sm\:flex-row {
|
|
1615
1839
|
flex-direction: row;
|
|
1616
1840
|
}
|
|
@@ -1637,8 +1861,11 @@
|
|
|
1637
1861
|
.md\:gap-4 {
|
|
1638
1862
|
gap: calc(var(--spacing) * 4);
|
|
1639
1863
|
}
|
|
1640
|
-
.md\:
|
|
1641
|
-
|
|
1864
|
+
.md\:rounded-basalt-island {
|
|
1865
|
+
border-radius: var(--basalt-radius-island);
|
|
1866
|
+
}
|
|
1867
|
+
.md\:p-5 {
|
|
1868
|
+
padding: calc(var(--spacing) * 5);
|
|
1642
1869
|
}
|
|
1643
1870
|
.md\:px-6 {
|
|
1644
1871
|
padding-inline: calc(var(--spacing) * 6);
|
|
@@ -1683,6 +1910,13 @@
|
|
|
1683
1910
|
.\[\&_\[cmdk-group-heading\]\]\:px-2 [cmdk-group-heading] {
|
|
1684
1911
|
padding-inline: calc(var(--spacing) * 2);
|
|
1685
1912
|
}
|
|
1913
|
+
.\[\&_\[cmdk-group-heading\]\]\:py-1\.5 [cmdk-group-heading] {
|
|
1914
|
+
padding-block: calc(var(--spacing) * 1.5);
|
|
1915
|
+
}
|
|
1916
|
+
.\[\&_\[cmdk-group-heading\]\]\:text-xs [cmdk-group-heading] {
|
|
1917
|
+
font-size: var(--text-xs);
|
|
1918
|
+
line-height: var(--tw-leading, var(--text-xs--line-height));
|
|
1919
|
+
}
|
|
1686
1920
|
.\[\&_\[cmdk-group-heading\]\]\:font-medium [cmdk-group-heading] {
|
|
1687
1921
|
--tw-font-weight: var(--font-weight-medium);
|
|
1688
1922
|
font-weight: var(--font-weight-medium);
|
|
@@ -1741,6 +1975,21 @@
|
|
|
1741
1975
|
.\[\&_\[data-title\]\]\:text-basalt-warning [data-title] {
|
|
1742
1976
|
color: hsl(var(--basalt-warning));
|
|
1743
1977
|
}
|
|
1978
|
+
.has-\[\[data-slot\=input-group-addon-end\]\]\:\[\&_input\]\:pr-2:has(:is([data-slot=input-group-addon-end])) input {
|
|
1979
|
+
padding-right: calc(var(--spacing) * 2);
|
|
1980
|
+
}
|
|
1981
|
+
.has-\[\[data-slot\=input-group-addon-start\]\]\:\[\&_input\]\:pl-2:has(:is([data-slot=input-group-addon-start])) input {
|
|
1982
|
+
padding-left: calc(var(--spacing) * 2);
|
|
1983
|
+
}
|
|
1984
|
+
.has-\[\[data-slot\=input-group-suffix\]\]\:\[\&_input\]\:\[field-sizing\:content\]:has(:is([data-slot=input-group-suffix])) input {
|
|
1985
|
+
field-sizing: content;
|
|
1986
|
+
}
|
|
1987
|
+
.has-\[\[data-slot\=input-group-suffix\]\]\:\[\&_input\]\:flex-none:has(:is([data-slot=input-group-suffix])) input {
|
|
1988
|
+
flex: none;
|
|
1989
|
+
}
|
|
1990
|
+
.has-\[\[data-slot\=input-group-suffix\]\]\:\[\&_input\]\:pr-0:has(:is([data-slot=input-group-suffix])) input {
|
|
1991
|
+
padding-right: 0px;
|
|
1992
|
+
}
|
|
1744
1993
|
.\[\&_svg\]\:pointer-events-none svg {
|
|
1745
1994
|
pointer-events: none;
|
|
1746
1995
|
}
|
|
@@ -1782,12 +2031,6 @@
|
|
|
1782
2031
|
.data-\[state\=open\]\:\[\&_svg\]\:rotate-180[data-state="open"] svg {
|
|
1783
2032
|
rotate: 180deg;
|
|
1784
2033
|
}
|
|
1785
|
-
.\[\&_td\]\:bg-basalt-accent td {
|
|
1786
|
-
background-color: hsl(var(--basalt-accent));
|
|
1787
|
-
}
|
|
1788
|
-
.even\:\[\&_td\]\:bg-basalt-secondary:nth-child(even) td {
|
|
1789
|
-
background-color: hsl(var(--basalt-secondary));
|
|
1790
|
-
}
|
|
1791
2034
|
.\[\&\>\*\:not\(\:first-child\)\]\:border-l > :not(:first-child) {
|
|
1792
2035
|
border-left-style: var(--tw-border-style);
|
|
1793
2036
|
border-left-width: 1px;
|
|
@@ -2051,59 +2294,6 @@
|
|
|
2051
2294
|
inherits: false;
|
|
2052
2295
|
initial-value: solid;
|
|
2053
2296
|
}
|
|
2054
|
-
@property --tw-blur {
|
|
2055
|
-
syntax: "*";
|
|
2056
|
-
inherits: false;
|
|
2057
|
-
}
|
|
2058
|
-
@property --tw-brightness {
|
|
2059
|
-
syntax: "*";
|
|
2060
|
-
inherits: false;
|
|
2061
|
-
}
|
|
2062
|
-
@property --tw-contrast {
|
|
2063
|
-
syntax: "*";
|
|
2064
|
-
inherits: false;
|
|
2065
|
-
}
|
|
2066
|
-
@property --tw-grayscale {
|
|
2067
|
-
syntax: "*";
|
|
2068
|
-
inherits: false;
|
|
2069
|
-
}
|
|
2070
|
-
@property --tw-hue-rotate {
|
|
2071
|
-
syntax: "*";
|
|
2072
|
-
inherits: false;
|
|
2073
|
-
}
|
|
2074
|
-
@property --tw-invert {
|
|
2075
|
-
syntax: "*";
|
|
2076
|
-
inherits: false;
|
|
2077
|
-
}
|
|
2078
|
-
@property --tw-opacity {
|
|
2079
|
-
syntax: "*";
|
|
2080
|
-
inherits: false;
|
|
2081
|
-
}
|
|
2082
|
-
@property --tw-saturate {
|
|
2083
|
-
syntax: "*";
|
|
2084
|
-
inherits: false;
|
|
2085
|
-
}
|
|
2086
|
-
@property --tw-sepia {
|
|
2087
|
-
syntax: "*";
|
|
2088
|
-
inherits: false;
|
|
2089
|
-
}
|
|
2090
|
-
@property --tw-drop-shadow {
|
|
2091
|
-
syntax: "*";
|
|
2092
|
-
inherits: false;
|
|
2093
|
-
}
|
|
2094
|
-
@property --tw-drop-shadow-color {
|
|
2095
|
-
syntax: "*";
|
|
2096
|
-
inherits: false;
|
|
2097
|
-
}
|
|
2098
|
-
@property --tw-drop-shadow-alpha {
|
|
2099
|
-
syntax: "<percentage>";
|
|
2100
|
-
inherits: false;
|
|
2101
|
-
initial-value: 100%;
|
|
2102
|
-
}
|
|
2103
|
-
@property --tw-drop-shadow-size {
|
|
2104
|
-
syntax: "*";
|
|
2105
|
-
inherits: false;
|
|
2106
|
-
}
|
|
2107
2297
|
@property --tw-backdrop-blur {
|
|
2108
2298
|
syntax: "*";
|
|
2109
2299
|
inherits: false;
|
|
@@ -2190,19 +2380,6 @@
|
|
|
2190
2380
|
--tw-ring-offset-color: #fff;
|
|
2191
2381
|
--tw-ring-offset-shadow: 0 0 #0000;
|
|
2192
2382
|
--tw-outline-style: solid;
|
|
2193
|
-
--tw-blur: initial;
|
|
2194
|
-
--tw-brightness: initial;
|
|
2195
|
-
--tw-contrast: initial;
|
|
2196
|
-
--tw-grayscale: initial;
|
|
2197
|
-
--tw-hue-rotate: initial;
|
|
2198
|
-
--tw-invert: initial;
|
|
2199
|
-
--tw-opacity: initial;
|
|
2200
|
-
--tw-saturate: initial;
|
|
2201
|
-
--tw-sepia: initial;
|
|
2202
|
-
--tw-drop-shadow: initial;
|
|
2203
|
-
--tw-drop-shadow-color: initial;
|
|
2204
|
-
--tw-drop-shadow-alpha: 100%;
|
|
2205
|
-
--tw-drop-shadow-size: initial;
|
|
2206
2383
|
--tw-backdrop-blur: initial;
|
|
2207
2384
|
--tw-backdrop-brightness: initial;
|
|
2208
2385
|
--tw-backdrop-contrast: initial;
|