singularity-components 0.1.102 → 0.1.104
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/main.cjs +5141 -4971
- package/dist/main.cjs.map +1 -1
- package/dist/main.css +213 -121
- package/dist/main.css.map +1 -1
- package/dist/main.d.cts +142 -33
- package/dist/main.d.ts +142 -33
- package/dist/main.js +5128 -4971
- package/dist/main.js.map +1 -1
- package/package.json +22 -19
package/dist/main.css
CHANGED
|
@@ -3,8 +3,10 @@
|
|
|
3
3
|
:root {
|
|
4
4
|
--sg-black: 0 0% 15%;
|
|
5
5
|
--sg-black-muted: 0 0% 45%;
|
|
6
|
+
--sg-black-accent: 30 10% 18%;
|
|
6
7
|
--sg-white: 30 20% 98%;
|
|
7
8
|
--sg-white-muted: 30 8% 85%;
|
|
9
|
+
--sg-white-accent: 210 12% 96%;
|
|
8
10
|
--sg-pink: 330 90% 65%;
|
|
9
11
|
--sg-gray-light: 240 5% 96%;
|
|
10
12
|
--sg-gray: 240 4% 46%;
|
|
@@ -53,7 +55,8 @@
|
|
|
53
55
|
:root,
|
|
54
56
|
:host {
|
|
55
57
|
--sg-spacing: 0.25rem;
|
|
56
|
-
--sg-container-
|
|
58
|
+
--sg-container-2xl: 42rem;
|
|
59
|
+
--sg-container-4xl: 56rem;
|
|
57
60
|
--sg-text-xs: 0.75rem;
|
|
58
61
|
--sg-text-xs--line-height: calc(1 / 0.75);
|
|
59
62
|
--sg-text-sm: 0.875rem;
|
|
@@ -70,11 +73,12 @@
|
|
|
70
73
|
--sg-text-3xl--line-height: calc(2.25 / 1.875);
|
|
71
74
|
--sg-text-4xl: 2.25rem;
|
|
72
75
|
--sg-text-4xl--line-height: calc(2.5 / 2.25);
|
|
76
|
+
--sg-text-5xl: 3rem;
|
|
77
|
+
--sg-text-5xl--line-height: 1;
|
|
73
78
|
--sg-font-weight-normal: 400;
|
|
74
79
|
--sg-font-weight-medium: 500;
|
|
75
80
|
--sg-font-weight-semibold: 600;
|
|
76
81
|
--sg-font-weight-bold: 700;
|
|
77
|
-
--sg-font-weight-extrabold: 800;
|
|
78
82
|
--sg-tracking-tight: -0.025em;
|
|
79
83
|
--sg-leading-relaxed: 1.625;
|
|
80
84
|
--sg-radius-2xl: 1rem;
|
|
@@ -296,6 +300,15 @@
|
|
|
296
300
|
.sg\:inset-\[18\%\] {
|
|
297
301
|
inset: 18%;
|
|
298
302
|
}
|
|
303
|
+
.sg\:top-4 {
|
|
304
|
+
top: calc(var(--sg-spacing) * 4);
|
|
305
|
+
}
|
|
306
|
+
.sg\:left-4 {
|
|
307
|
+
left: calc(var(--sg-spacing) * 4);
|
|
308
|
+
}
|
|
309
|
+
.sg\:z-10 {
|
|
310
|
+
z-index: 10;
|
|
311
|
+
}
|
|
299
312
|
.sg\:col-start-2 {
|
|
300
313
|
grid-column-start: 2;
|
|
301
314
|
}
|
|
@@ -308,39 +321,36 @@
|
|
|
308
321
|
.sg\:mt-4 {
|
|
309
322
|
margin-top: calc(var(--sg-spacing) * 4);
|
|
310
323
|
}
|
|
311
|
-
.sg\:mt-6 {
|
|
312
|
-
margin-top: calc(var(--sg-spacing) * 6);
|
|
313
|
-
}
|
|
314
324
|
.sg\:mt-12 {
|
|
315
325
|
margin-top: calc(var(--sg-spacing) * 12);
|
|
316
326
|
}
|
|
327
|
+
.sg\:mt-auto {
|
|
328
|
+
margin-top: auto;
|
|
329
|
+
}
|
|
317
330
|
.sg\:mb-2 {
|
|
318
331
|
margin-bottom: calc(var(--sg-spacing) * 2);
|
|
319
332
|
}
|
|
320
333
|
.sg\:mb-3 {
|
|
321
334
|
margin-bottom: calc(var(--sg-spacing) * 3);
|
|
322
335
|
}
|
|
336
|
+
.sg\:mb-4 {
|
|
337
|
+
margin-bottom: calc(var(--sg-spacing) * 4);
|
|
338
|
+
}
|
|
323
339
|
.sg\:mb-6 {
|
|
324
340
|
margin-bottom: calc(var(--sg-spacing) * 6);
|
|
325
341
|
}
|
|
326
342
|
.sg\:mb-8 {
|
|
327
343
|
margin-bottom: calc(var(--sg-spacing) * 8);
|
|
328
344
|
}
|
|
345
|
+
.sg\:ml-2 {
|
|
346
|
+
margin-left: calc(var(--sg-spacing) * 2);
|
|
347
|
+
}
|
|
329
348
|
.sg\:line-clamp-1 {
|
|
330
349
|
overflow: hidden;
|
|
331
350
|
display: -webkit-box;
|
|
332
351
|
-webkit-box-orient: vertical;
|
|
333
352
|
-webkit-line-clamp: 1;
|
|
334
353
|
}
|
|
335
|
-
.sg\:line-clamp-2 {
|
|
336
|
-
overflow: hidden;
|
|
337
|
-
display: -webkit-box;
|
|
338
|
-
-webkit-box-orient: vertical;
|
|
339
|
-
-webkit-line-clamp: 2;
|
|
340
|
-
}
|
|
341
|
-
.sg\:block {
|
|
342
|
-
display: block;
|
|
343
|
-
}
|
|
344
354
|
.sg\:flex {
|
|
345
355
|
display: flex;
|
|
346
356
|
}
|
|
@@ -383,9 +393,6 @@
|
|
|
383
393
|
.sg\:h-10 {
|
|
384
394
|
height: calc(var(--sg-spacing) * 10);
|
|
385
395
|
}
|
|
386
|
-
.sg\:h-11 {
|
|
387
|
-
height: calc(var(--sg-spacing) * 11);
|
|
388
|
-
}
|
|
389
396
|
.sg\:h-12 {
|
|
390
397
|
height: calc(var(--sg-spacing) * 12);
|
|
391
398
|
}
|
|
@@ -422,12 +429,15 @@
|
|
|
422
429
|
.sg\:w-full {
|
|
423
430
|
width: 100%;
|
|
424
431
|
}
|
|
432
|
+
.sg\:max-w-2xl {
|
|
433
|
+
max-width: var(--sg-container-2xl);
|
|
434
|
+
}
|
|
435
|
+
.sg\:max-w-4xl {
|
|
436
|
+
max-width: var(--sg-container-4xl);
|
|
437
|
+
}
|
|
425
438
|
.sg\:max-w-\[768px\] {
|
|
426
439
|
max-width: 768px;
|
|
427
440
|
}
|
|
428
|
-
.sg\:max-w-md {
|
|
429
|
-
max-width: var(--sg-container-md);
|
|
430
|
-
}
|
|
431
441
|
.sg\:max-w-none {
|
|
432
442
|
max-width: none;
|
|
433
443
|
}
|
|
@@ -456,6 +466,15 @@
|
|
|
456
466
|
.sg\:cursor-pointer {
|
|
457
467
|
cursor: pointer;
|
|
458
468
|
}
|
|
469
|
+
.sg\:list-inside {
|
|
470
|
+
list-style-position: inside;
|
|
471
|
+
}
|
|
472
|
+
.sg\:list-decimal {
|
|
473
|
+
list-style-type: decimal;
|
|
474
|
+
}
|
|
475
|
+
.sg\:list-disc {
|
|
476
|
+
list-style-type: disc;
|
|
477
|
+
}
|
|
459
478
|
.sg\:grid-cols-1 {
|
|
460
479
|
grid-template-columns: repeat(1, minmax(0, 1fr));
|
|
461
480
|
}
|
|
@@ -483,9 +502,6 @@
|
|
|
483
502
|
.sg\:justify-items-start {
|
|
484
503
|
justify-items: start;
|
|
485
504
|
}
|
|
486
|
-
.sg\:gap-0 {
|
|
487
|
-
gap: calc(var(--sg-spacing) * 0);
|
|
488
|
-
}
|
|
489
505
|
.sg\:gap-1 {
|
|
490
506
|
gap: calc(var(--sg-spacing) * 1);
|
|
491
507
|
}
|
|
@@ -526,6 +542,20 @@
|
|
|
526
542
|
margin-block-end: calc(calc(var(--sg-spacing) * 1.5) * calc(1 - var(--tw-space-y-reverse)));
|
|
527
543
|
}
|
|
528
544
|
}
|
|
545
|
+
.sg\:space-y-2 {
|
|
546
|
+
:where(& > :not(:last-child)) {
|
|
547
|
+
--tw-space-y-reverse: 0;
|
|
548
|
+
margin-block-start: calc(calc(var(--sg-spacing) * 2) * var(--tw-space-y-reverse));
|
|
549
|
+
margin-block-end: calc(calc(var(--sg-spacing) * 2) * calc(1 - var(--tw-space-y-reverse)));
|
|
550
|
+
}
|
|
551
|
+
}
|
|
552
|
+
.sg\:space-y-6 {
|
|
553
|
+
:where(& > :not(:last-child)) {
|
|
554
|
+
--tw-space-y-reverse: 0;
|
|
555
|
+
margin-block-start: calc(calc(var(--sg-spacing) * 6) * var(--tw-space-y-reverse));
|
|
556
|
+
margin-block-end: calc(calc(var(--sg-spacing) * 6) * calc(1 - var(--tw-space-y-reverse)));
|
|
557
|
+
}
|
|
558
|
+
}
|
|
529
559
|
.sg\:gap-y-0\.5 {
|
|
530
560
|
row-gap: calc(var(--sg-spacing) * 0.5);
|
|
531
561
|
}
|
|
@@ -535,6 +565,9 @@
|
|
|
535
565
|
.sg\:overflow-x-auto {
|
|
536
566
|
overflow-x: auto;
|
|
537
567
|
}
|
|
568
|
+
.sg\:rounded {
|
|
569
|
+
border-radius: 0.25rem;
|
|
570
|
+
}
|
|
538
571
|
.sg\:rounded-2xl {
|
|
539
572
|
border-radius: var(--sg-radius-2xl);
|
|
540
573
|
}
|
|
@@ -566,6 +599,16 @@
|
|
|
566
599
|
border-bottom-style: var(--tw-border-style);
|
|
567
600
|
border-bottom-width: 1px;
|
|
568
601
|
}
|
|
602
|
+
.sg\:border-l-4 {
|
|
603
|
+
border-left-style: var(--tw-border-style);
|
|
604
|
+
border-left-width: 4px;
|
|
605
|
+
}
|
|
606
|
+
.sg\:border-\[hsl\(var\(--sg-primary\)\)\] {
|
|
607
|
+
border-color: hsl(var(--sg-primary));
|
|
608
|
+
}
|
|
609
|
+
.sg\:border-border {
|
|
610
|
+
border-color: hsl(var(--sg-border));
|
|
611
|
+
}
|
|
569
612
|
.sg\:border-input {
|
|
570
613
|
border-color: var(--input);
|
|
571
614
|
}
|
|
@@ -579,7 +622,7 @@
|
|
|
579
622
|
background-color: hsl(var(--sg-gradient-2));
|
|
580
623
|
}
|
|
581
624
|
.sg\:bg-accent {
|
|
582
|
-
background-color: var(--accent);
|
|
625
|
+
background-color: hsl(var(--sg-accent));
|
|
583
626
|
}
|
|
584
627
|
.sg\:bg-background {
|
|
585
628
|
background-color: hsl(var(--sg-color-background));
|
|
@@ -588,7 +631,7 @@
|
|
|
588
631
|
background-color: hsl(var(--sg-black));
|
|
589
632
|
}
|
|
590
633
|
.sg\:bg-border {
|
|
591
|
-
background-color: var(--border);
|
|
634
|
+
background-color: hsl(var(--sg-border));
|
|
592
635
|
}
|
|
593
636
|
.sg\:bg-card {
|
|
594
637
|
background-color: var(--card);
|
|
@@ -596,11 +639,8 @@
|
|
|
596
639
|
.sg\:bg-destructive {
|
|
597
640
|
background-color: hsl(var(--sg-red));
|
|
598
641
|
}
|
|
599
|
-
.sg\:bg-
|
|
600
|
-
background-color: hsl(var(--sg-color-
|
|
601
|
-
}
|
|
602
|
-
.sg\:bg-gray {
|
|
603
|
-
background-color: hsl(var(--sg-gray));
|
|
642
|
+
.sg\:bg-muted {
|
|
643
|
+
background-color: hsl(var(--sg-color-muted-background));
|
|
604
644
|
}
|
|
605
645
|
.sg\:bg-muted\/50 {
|
|
606
646
|
background-color: hsl(var(--sg-color-muted-background));
|
|
@@ -611,6 +651,9 @@
|
|
|
611
651
|
.sg\:bg-orange {
|
|
612
652
|
background-color: hsl(var(--sg-orange));
|
|
613
653
|
}
|
|
654
|
+
.sg\:bg-pink {
|
|
655
|
+
background-color: hsl(var(--sg-pink));
|
|
656
|
+
}
|
|
614
657
|
.sg\:bg-primary {
|
|
615
658
|
background-color: hsl(var(--sg-primary));
|
|
616
659
|
}
|
|
@@ -635,10 +678,6 @@
|
|
|
635
678
|
--tw-gradient-position: to top in oklab;
|
|
636
679
|
background-image: linear-gradient(var(--tw-gradient-stops));
|
|
637
680
|
}
|
|
638
|
-
.sg\:bg-gradient-to-tr {
|
|
639
|
-
--tw-gradient-position: to top right in oklab;
|
|
640
|
-
background-image: linear-gradient(var(--tw-gradient-stops));
|
|
641
|
-
}
|
|
642
681
|
.sg\:bg-\[conic-gradient\(hsl\(var\(--sg-gradient-1\)\)\,hsl\(var\(--sg-gradient-2\)\)\,hsl\(var\(--sg-primary\)\)\,hsl\(var\(--sg-gradient-1\)\)\)\] {
|
|
643
682
|
background-image:
|
|
644
683
|
conic-gradient(
|
|
@@ -647,6 +686,22 @@
|
|
|
647
686
|
hsl(var(--sg-primary)),
|
|
648
687
|
hsl(var(--sg-gradient-1)));
|
|
649
688
|
}
|
|
689
|
+
.sg\:bg-\[linear-gradient\(135deg\,hsl\(var\(--sg-primary-light\)\)_0\%\,hsl\(var\(--sg-pink\)\)_50\%\,hsl\(var\(--sg-orange\)\)_100\%\)\] {
|
|
690
|
+
background-image:
|
|
691
|
+
linear-gradient(
|
|
692
|
+
135deg,
|
|
693
|
+
hsl(var(--sg-primary-light)) 0%,
|
|
694
|
+
hsl(var(--sg-pink)) 50%,
|
|
695
|
+
hsl(var(--sg-orange)) 100%);
|
|
696
|
+
}
|
|
697
|
+
.sg\:bg-\[linear-gradient\(135deg\,hsl\(var\(--sg-primary-light\)\/0\.1\)_0\%\,hsl\(var\(--sg-pink\)\/0\.1\)_50\%\,hsl\(var\(--sg-orange\)\/0\.1\)_100\%\)\] {
|
|
698
|
+
background-image:
|
|
699
|
+
linear-gradient(
|
|
700
|
+
135deg,
|
|
701
|
+
hsl(var(--sg-primary-light)/0.1) 0%,
|
|
702
|
+
hsl(var(--sg-pink)/0.1) 50%,
|
|
703
|
+
hsl(var(--sg-orange)/0.1) 100%);
|
|
704
|
+
}
|
|
650
705
|
.sg\:bg-\[radial-gradient\(1200px_300px_at_10\%_-20\%\,hsl\(var\(--sg-gradient-1\)\/0\.15\)\,transparent\)\,radial-gradient\(800px_200px_at_90\%_-20\%\,hsl\(var\(--sg-gradient-2\)\/0\.15\)\,transparent\)\] {
|
|
651
706
|
background-image:
|
|
652
707
|
radial-gradient(
|
|
@@ -658,8 +713,16 @@
|
|
|
658
713
|
hsl(var(--sg-gradient-2)/0.15),
|
|
659
714
|
transparent);
|
|
660
715
|
}
|
|
661
|
-
.sg\:from-\[hsl\(var\(--sg-
|
|
662
|
-
--tw-gradient-from: hsl(var(--sg-
|
|
716
|
+
.sg\:from-\[hsl\(var\(--sg-blue\)\)\] {
|
|
717
|
+
--tw-gradient-from: hsl(var(--sg-blue));
|
|
718
|
+
--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));
|
|
719
|
+
}
|
|
720
|
+
.sg\:from-\[hsl\(var\(--sg-pink\)\)\] {
|
|
721
|
+
--tw-gradient-from: hsl(var(--sg-pink));
|
|
722
|
+
--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));
|
|
723
|
+
}
|
|
724
|
+
.sg\:from-\[hsl\(var\(--sg-primary\)\)\] {
|
|
725
|
+
--tw-gradient-from: hsl(var(--sg-primary));
|
|
663
726
|
--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));
|
|
664
727
|
}
|
|
665
728
|
.sg\:from-background {
|
|
@@ -673,12 +736,8 @@
|
|
|
673
736
|
}
|
|
674
737
|
--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));
|
|
675
738
|
}
|
|
676
|
-
.sg\:
|
|
677
|
-
--tw-gradient-
|
|
678
|
-
--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));
|
|
679
|
-
}
|
|
680
|
-
.sg\:via-\[hsl\(var\(--sg-gradient-2\)\)\] {
|
|
681
|
-
--tw-gradient-via: hsl(var(--sg-gradient-2));
|
|
739
|
+
.sg\:via-\[hsl\(var\(--sg-pink\)\)\] {
|
|
740
|
+
--tw-gradient-via: hsl(var(--sg-pink));
|
|
682
741
|
--tw-gradient-via-stops:
|
|
683
742
|
var(--tw-gradient-position),
|
|
684
743
|
var(--tw-gradient-from) var(--tw-gradient-from-position),
|
|
@@ -698,21 +757,12 @@
|
|
|
698
757
|
var(--tw-gradient-to) var(--tw-gradient-to-position);
|
|
699
758
|
--tw-gradient-stops: var(--tw-gradient-via-stops);
|
|
700
759
|
}
|
|
701
|
-
.sg\:
|
|
702
|
-
--tw-gradient-
|
|
703
|
-
--tw-gradient-via-stops:
|
|
704
|
-
var(--tw-gradient-position),
|
|
705
|
-
var(--tw-gradient-from) var(--tw-gradient-from-position),
|
|
706
|
-
var(--tw-gradient-via) var(--tw-gradient-via-position),
|
|
707
|
-
var(--tw-gradient-to) var(--tw-gradient-to-position);
|
|
708
|
-
--tw-gradient-stops: var(--tw-gradient-via-stops);
|
|
709
|
-
}
|
|
710
|
-
.sg\:to-\[hsl\(var\(--sg-gradient-2\)\)\] {
|
|
711
|
-
--tw-gradient-to: hsl(var(--sg-gradient-2));
|
|
760
|
+
.sg\:to-\[hsl\(var\(--sg-orange\)\)\] {
|
|
761
|
+
--tw-gradient-to: hsl(var(--sg-orange));
|
|
712
762
|
--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));
|
|
713
763
|
}
|
|
714
|
-
.sg\:to-\[hsl\(var\(--sg-
|
|
715
|
-
--tw-gradient-to: hsl(var(--sg-
|
|
764
|
+
.sg\:to-\[hsl\(var\(--sg-pink\)\)\] {
|
|
765
|
+
--tw-gradient-to: hsl(var(--sg-pink));
|
|
716
766
|
--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));
|
|
717
767
|
}
|
|
718
768
|
.sg\:to-background\/60 {
|
|
@@ -722,10 +772,6 @@
|
|
|
722
772
|
}
|
|
723
773
|
--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));
|
|
724
774
|
}
|
|
725
|
-
.sg\:to-red {
|
|
726
|
-
--tw-gradient-to: hsl(var(--sg-red));
|
|
727
|
-
--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));
|
|
728
|
-
}
|
|
729
775
|
.sg\:to-transparent {
|
|
730
776
|
--tw-gradient-to: transparent;
|
|
731
777
|
--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));
|
|
@@ -742,14 +788,11 @@
|
|
|
742
788
|
.sg\:p-4 {
|
|
743
789
|
padding: calc(var(--sg-spacing) * 4);
|
|
744
790
|
}
|
|
745
|
-
.sg\:p-5 {
|
|
746
|
-
padding: calc(var(--sg-spacing) * 5);
|
|
747
|
-
}
|
|
748
791
|
.sg\:p-6 {
|
|
749
792
|
padding: calc(var(--sg-spacing) * 6);
|
|
750
793
|
}
|
|
751
|
-
.sg\:
|
|
752
|
-
padding:
|
|
794
|
+
.sg\:px-1\.5 {
|
|
795
|
+
padding-inline: calc(var(--sg-spacing) * 1.5);
|
|
753
796
|
}
|
|
754
797
|
.sg\:px-2 {
|
|
755
798
|
padding-inline: calc(var(--sg-spacing) * 2);
|
|
@@ -778,18 +821,27 @@
|
|
|
778
821
|
.sg\:py-4 {
|
|
779
822
|
padding-block: calc(var(--sg-spacing) * 4);
|
|
780
823
|
}
|
|
824
|
+
.sg\:py-8 {
|
|
825
|
+
padding-block: calc(var(--sg-spacing) * 8);
|
|
826
|
+
}
|
|
781
827
|
.sg\:py-12 {
|
|
782
828
|
padding-block: calc(var(--sg-spacing) * 12);
|
|
783
829
|
}
|
|
784
|
-
.sg\:py-
|
|
785
|
-
padding-block: calc(var(--sg-spacing) *
|
|
830
|
+
.sg\:py-20 {
|
|
831
|
+
padding-block: calc(var(--sg-spacing) * 20);
|
|
786
832
|
}
|
|
787
833
|
.sg\:pt-0 {
|
|
788
834
|
padding-top: calc(var(--sg-spacing) * 0);
|
|
789
835
|
}
|
|
836
|
+
.sg\:pb-1 {
|
|
837
|
+
padding-bottom: calc(var(--sg-spacing) * 1);
|
|
838
|
+
}
|
|
790
839
|
.sg\:pb-4 {
|
|
791
840
|
padding-bottom: calc(var(--sg-spacing) * 4);
|
|
792
841
|
}
|
|
842
|
+
.sg\:pl-4 {
|
|
843
|
+
padding-left: calc(var(--sg-spacing) * 4);
|
|
844
|
+
}
|
|
793
845
|
.sg\:text-center {
|
|
794
846
|
text-align: center;
|
|
795
847
|
}
|
|
@@ -838,10 +890,6 @@
|
|
|
838
890
|
--tw-font-weight: var(--sg-font-weight-bold);
|
|
839
891
|
font-weight: var(--sg-font-weight-bold);
|
|
840
892
|
}
|
|
841
|
-
.sg\:font-extrabold {
|
|
842
|
-
--tw-font-weight: var(--sg-font-weight-extrabold);
|
|
843
|
-
font-weight: var(--sg-font-weight-extrabold);
|
|
844
|
-
}
|
|
845
893
|
.sg\:font-medium {
|
|
846
894
|
--tw-font-weight: var(--sg-font-weight-medium);
|
|
847
895
|
font-weight: var(--sg-font-weight-medium);
|
|
@@ -858,15 +906,9 @@
|
|
|
858
906
|
--tw-tracking: var(--sg-tracking-tight);
|
|
859
907
|
letter-spacing: var(--sg-tracking-tight);
|
|
860
908
|
}
|
|
861
|
-
.sg\:text-balance {
|
|
862
|
-
text-wrap: balance;
|
|
863
|
-
}
|
|
864
909
|
.sg\:whitespace-nowrap {
|
|
865
910
|
white-space: nowrap;
|
|
866
911
|
}
|
|
867
|
-
.sg\:text-background {
|
|
868
|
-
color: hsl(var(--sg-color-background));
|
|
869
|
-
}
|
|
870
912
|
.sg\:text-black {
|
|
871
913
|
color: hsl(var(--sg-black));
|
|
872
914
|
}
|
|
@@ -891,6 +933,12 @@
|
|
|
891
933
|
.sg\:text-muted-foreground {
|
|
892
934
|
color: hsl(var(--sg-color-muted-foreground));
|
|
893
935
|
}
|
|
936
|
+
.sg\:text-orange {
|
|
937
|
+
color: hsl(var(--sg-orange));
|
|
938
|
+
}
|
|
939
|
+
.sg\:text-pink {
|
|
940
|
+
color: hsl(var(--sg-pink));
|
|
941
|
+
}
|
|
894
942
|
.sg\:text-primary {
|
|
895
943
|
color: hsl(var(--sg-primary));
|
|
896
944
|
}
|
|
@@ -909,9 +957,15 @@
|
|
|
909
957
|
.sg\:text-white {
|
|
910
958
|
color: hsl(var(--sg-white));
|
|
911
959
|
}
|
|
960
|
+
.sg\:italic {
|
|
961
|
+
font-style: italic;
|
|
962
|
+
}
|
|
912
963
|
.sg\:underline-offset-4 {
|
|
913
964
|
text-underline-offset: 4px;
|
|
914
965
|
}
|
|
966
|
+
.sg\:opacity-20 {
|
|
967
|
+
opacity: 20%;
|
|
968
|
+
}
|
|
915
969
|
.sg\:shadow-lg {
|
|
916
970
|
--tw-shadow: 0 10px 15px -3px var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 4px 6px -4px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
|
|
917
971
|
box-shadow:
|
|
@@ -940,9 +994,9 @@
|
|
|
940
994
|
var(--tw-shadow);
|
|
941
995
|
}
|
|
942
996
|
.sg\:ring-border\/60 {
|
|
943
|
-
--tw-ring-color: var(--border);
|
|
997
|
+
--tw-ring-color: hsl(var(--sg-border));
|
|
944
998
|
@supports (color: color-mix(in lab, red, red)) {
|
|
945
|
-
--tw-ring-color: color-mix(in oklab, var(--border) 60%, transparent);
|
|
999
|
+
--tw-ring-color: color-mix(in oklab, hsl(var(--sg-border)) 60%, transparent);
|
|
946
1000
|
}
|
|
947
1001
|
}
|
|
948
1002
|
.sg\:ring-gray\/60 {
|
|
@@ -976,6 +1030,11 @@
|
|
|
976
1030
|
transition-timing-function: var(--tw-ease, var(--sg-default-transition-timing-function));
|
|
977
1031
|
transition-duration: var(--tw-duration, var(--sg-default-transition-duration));
|
|
978
1032
|
}
|
|
1033
|
+
.sg\:transition-opacity {
|
|
1034
|
+
transition-property: opacity;
|
|
1035
|
+
transition-timing-function: var(--tw-ease, var(--sg-default-transition-timing-function));
|
|
1036
|
+
transition-duration: var(--tw-duration, var(--sg-default-transition-duration));
|
|
1037
|
+
}
|
|
979
1038
|
.sg\:transition-transform {
|
|
980
1039
|
transition-property:
|
|
981
1040
|
transform,
|
|
@@ -989,6 +1048,10 @@
|
|
|
989
1048
|
--tw-duration: 200ms;
|
|
990
1049
|
transition-duration: 200ms;
|
|
991
1050
|
}
|
|
1051
|
+
.sg\:duration-300 {
|
|
1052
|
+
--tw-duration: 300ms;
|
|
1053
|
+
transition-duration: 300ms;
|
|
1054
|
+
}
|
|
992
1055
|
.sg\:duration-500 {
|
|
993
1056
|
--tw-duration: 500ms;
|
|
994
1057
|
transition-duration: 500ms;
|
|
@@ -1007,6 +1070,9 @@
|
|
|
1007
1070
|
.sg\:duration-200 {
|
|
1008
1071
|
animation-duration: 200ms;
|
|
1009
1072
|
}
|
|
1073
|
+
.sg\:duration-300 {
|
|
1074
|
+
animation-duration: 300ms;
|
|
1075
|
+
}
|
|
1010
1076
|
.sg\:duration-500 {
|
|
1011
1077
|
animation-duration: 500ms;
|
|
1012
1078
|
}
|
|
@@ -1020,6 +1086,30 @@
|
|
|
1020
1086
|
}
|
|
1021
1087
|
}
|
|
1022
1088
|
}
|
|
1089
|
+
.sg\:group-hover\:scale-110 {
|
|
1090
|
+
&:is(:where(.sg\:group):hover *) {
|
|
1091
|
+
@media (hover: hover) {
|
|
1092
|
+
--tw-scale-x: 110%;
|
|
1093
|
+
--tw-scale-y: 110%;
|
|
1094
|
+
--tw-scale-z: 110%;
|
|
1095
|
+
scale: var(--tw-scale-x) var(--tw-scale-y);
|
|
1096
|
+
}
|
|
1097
|
+
}
|
|
1098
|
+
}
|
|
1099
|
+
.sg\:group-hover\:text-\[hsl\(var\(--sg-primary\)\)\] {
|
|
1100
|
+
&:is(:where(.sg\:group):hover *) {
|
|
1101
|
+
@media (hover: hover) {
|
|
1102
|
+
color: hsl(var(--sg-primary));
|
|
1103
|
+
}
|
|
1104
|
+
}
|
|
1105
|
+
}
|
|
1106
|
+
.sg\:group-hover\:opacity-30 {
|
|
1107
|
+
&:is(:where(.sg\:group):hover *) {
|
|
1108
|
+
@media (hover: hover) {
|
|
1109
|
+
opacity: 30%;
|
|
1110
|
+
}
|
|
1111
|
+
}
|
|
1112
|
+
}
|
|
1023
1113
|
.sg\:selection\:bg-primary {
|
|
1024
1114
|
& *::selection {
|
|
1025
1115
|
background-color: hsl(var(--sg-primary));
|
|
@@ -1093,7 +1183,7 @@
|
|
|
1093
1183
|
.sg\:hover\:bg-accent {
|
|
1094
1184
|
&:hover {
|
|
1095
1185
|
@media (hover: hover) {
|
|
1096
|
-
background-color: var(--accent);
|
|
1186
|
+
background-color: hsl(var(--sg-accent));
|
|
1097
1187
|
}
|
|
1098
1188
|
}
|
|
1099
1189
|
}
|
|
@@ -1140,7 +1230,7 @@
|
|
|
1140
1230
|
.sg\:hover\:text-accent-foreground {
|
|
1141
1231
|
&:hover {
|
|
1142
1232
|
@media (hover: hover) {
|
|
1143
|
-
color: var(--accent-foreground);
|
|
1233
|
+
color: hsl(var(--sg-accent-foreground));
|
|
1144
1234
|
}
|
|
1145
1235
|
}
|
|
1146
1236
|
}
|
|
@@ -1151,6 +1241,19 @@
|
|
|
1151
1241
|
}
|
|
1152
1242
|
}
|
|
1153
1243
|
}
|
|
1244
|
+
.sg\:hover\:shadow-lg {
|
|
1245
|
+
&:hover {
|
|
1246
|
+
@media (hover: hover) {
|
|
1247
|
+
--tw-shadow: 0 10px 15px -3px var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 4px 6px -4px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
|
|
1248
|
+
box-shadow:
|
|
1249
|
+
var(--tw-inset-shadow),
|
|
1250
|
+
var(--tw-inset-ring-shadow),
|
|
1251
|
+
var(--tw-ring-offset-shadow),
|
|
1252
|
+
var(--tw-ring-shadow),
|
|
1253
|
+
var(--tw-shadow);
|
|
1254
|
+
}
|
|
1255
|
+
}
|
|
1256
|
+
}
|
|
1154
1257
|
.sg\:focus-visible\:border-ring {
|
|
1155
1258
|
&:focus-visible {
|
|
1156
1259
|
border-color: var(--ring);
|
|
@@ -1271,11 +1374,6 @@
|
|
|
1271
1374
|
background-color: hsl(var(--sg-color-muted-background));
|
|
1272
1375
|
}
|
|
1273
1376
|
}
|
|
1274
|
-
.sg\:sm\:grid-cols-2 {
|
|
1275
|
-
@media (width >= 40rem) {
|
|
1276
|
-
grid-template-columns: repeat(2, minmax(0, 1fr));
|
|
1277
|
-
}
|
|
1278
|
-
}
|
|
1279
1377
|
.sg\:md\:grid-cols-2 {
|
|
1280
1378
|
@media (width >= 48rem) {
|
|
1281
1379
|
grid-template-columns: repeat(2, minmax(0, 1fr));
|
|
@@ -1301,17 +1399,18 @@
|
|
|
1301
1399
|
padding-inline: calc(var(--sg-spacing) * 0);
|
|
1302
1400
|
}
|
|
1303
1401
|
}
|
|
1402
|
+
.sg\:md\:text-4xl {
|
|
1403
|
+
@media (width >= 48rem) {
|
|
1404
|
+
font-size: var(--sg-text-4xl);
|
|
1405
|
+
line-height: var(--tw-leading, var(--sg-text-4xl--line-height));
|
|
1406
|
+
}
|
|
1407
|
+
}
|
|
1304
1408
|
.sg\:md\:text-sm {
|
|
1305
1409
|
@media (width >= 48rem) {
|
|
1306
1410
|
font-size: var(--sg-text-sm);
|
|
1307
1411
|
line-height: var(--tw-leading, var(--sg-text-sm--line-height));
|
|
1308
1412
|
}
|
|
1309
1413
|
}
|
|
1310
|
-
.sg\:lg\:grid-cols-3 {
|
|
1311
|
-
@media (width >= 64rem) {
|
|
1312
|
-
grid-template-columns: repeat(3, minmax(0, 1fr));
|
|
1313
|
-
}
|
|
1314
|
-
}
|
|
1315
1414
|
.sg\:lg\:text-2xl {
|
|
1316
1415
|
@media (width >= 64rem) {
|
|
1317
1416
|
font-size: var(--sg-text-2xl);
|
|
@@ -1324,15 +1423,10 @@
|
|
|
1324
1423
|
line-height: var(--tw-leading, var(--sg-text-3xl--line-height));
|
|
1325
1424
|
}
|
|
1326
1425
|
}
|
|
1327
|
-
.sg\:lg\:text-
|
|
1426
|
+
.sg\:lg\:text-5xl {
|
|
1328
1427
|
@media (width >= 64rem) {
|
|
1329
|
-
font-size: var(--sg-text-
|
|
1330
|
-
line-height: var(--tw-leading, var(--sg-text-
|
|
1331
|
-
}
|
|
1332
|
-
}
|
|
1333
|
-
.sg\:dark\:border-input {
|
|
1334
|
-
&:is(.dark *) {
|
|
1335
|
-
border-color: var(--input);
|
|
1428
|
+
font-size: var(--sg-text-5xl);
|
|
1429
|
+
line-height: var(--tw-leading, var(--sg-text-5xl--line-height));
|
|
1336
1430
|
}
|
|
1337
1431
|
}
|
|
1338
1432
|
.sg\:dark\:bg-destructive\/60 {
|
|
@@ -1355,21 +1449,9 @@
|
|
|
1355
1449
|
&:is(.dark *) {
|
|
1356
1450
|
&:hover {
|
|
1357
1451
|
@media (hover: hover) {
|
|
1358
|
-
background-color: var(--accent);
|
|
1452
|
+
background-color: hsl(var(--sg-accent));
|
|
1359
1453
|
@supports (color: color-mix(in lab, red, red)) {
|
|
1360
|
-
background-color: color-mix(in oklab, var(--accent) 50%, transparent);
|
|
1361
|
-
}
|
|
1362
|
-
}
|
|
1363
|
-
}
|
|
1364
|
-
}
|
|
1365
|
-
}
|
|
1366
|
-
.sg\:dark\:hover\:bg-input\/50 {
|
|
1367
|
-
&:is(.dark *) {
|
|
1368
|
-
&:hover {
|
|
1369
|
-
@media (hover: hover) {
|
|
1370
|
-
background-color: var(--input);
|
|
1371
|
-
@supports (color: color-mix(in lab, red, red)) {
|
|
1372
|
-
background-color: color-mix(in oklab, var(--input) 50%, transparent);
|
|
1454
|
+
background-color: color-mix(in oklab, hsl(var(--sg-accent)) 50%, transparent);
|
|
1373
1455
|
}
|
|
1374
1456
|
}
|
|
1375
1457
|
}
|
|
@@ -1485,7 +1567,7 @@
|
|
|
1485
1567
|
a& {
|
|
1486
1568
|
&:hover {
|
|
1487
1569
|
@media (hover: hover) {
|
|
1488
|
-
background-color: var(--accent);
|
|
1570
|
+
background-color: hsl(var(--sg-accent));
|
|
1489
1571
|
}
|
|
1490
1572
|
}
|
|
1491
1573
|
}
|
|
@@ -1530,7 +1612,7 @@
|
|
|
1530
1612
|
a& {
|
|
1531
1613
|
&:hover {
|
|
1532
1614
|
@media (hover: hover) {
|
|
1533
|
-
color: var(--accent-foreground);
|
|
1615
|
+
color: hsl(var(--sg-accent-foreground));
|
|
1534
1616
|
}
|
|
1535
1617
|
}
|
|
1536
1618
|
}
|
|
@@ -1543,13 +1625,13 @@
|
|
|
1543
1625
|
--sg-color-muted-foreground: var(--sg-black-muted);
|
|
1544
1626
|
--sg-gradient-1: var(--sg-pink);
|
|
1545
1627
|
--sg-gradient-2: var(--sg-primary);
|
|
1628
|
+
--sg-border: var(--sg-black-muted);
|
|
1629
|
+
--sg-accent: var(--sg-white-accent);
|
|
1630
|
+
--sg-accent-foreground: var(--sg-black-accent);
|
|
1546
1631
|
--card: oklch(1 0 0);
|
|
1547
1632
|
--card-foreground: oklch(0.145 0 0);
|
|
1548
1633
|
--popover: oklch(1 0 0);
|
|
1549
1634
|
--popover-foreground: oklch(0.145 0 0);
|
|
1550
|
-
--accent: oklch(0.97 0 0);
|
|
1551
|
-
--accent-foreground: oklch(0.205 0 0);
|
|
1552
|
-
--border: oklch(0.922 0 0);
|
|
1553
1635
|
--input: oklch(0.922 0 0);
|
|
1554
1636
|
--ring: oklch(0.708 0 0);
|
|
1555
1637
|
--chart-1: oklch(0.646 0.222 41.116);
|
|
@@ -1574,6 +1656,9 @@
|
|
|
1574
1656
|
--sg-color-muted-foreground: var(--sg-white-muted);
|
|
1575
1657
|
--sg-gradient-1: var(--sg-pink);
|
|
1576
1658
|
--sg-gradient-2: var(--sg-primary-light);
|
|
1659
|
+
--sg-border: var(--sg-white-muted);
|
|
1660
|
+
--sg-accent: var(--sg-black-accent);
|
|
1661
|
+
--sg-accent-foreground: var(--sg-white-accent);
|
|
1577
1662
|
--card: oklch(0.145 0 0);
|
|
1578
1663
|
--card-foreground: oklch(0.985 0 0);
|
|
1579
1664
|
--popover: oklch(0.145 0 0);
|
|
@@ -1582,11 +1667,8 @@
|
|
|
1582
1667
|
--primary-foreground: oklch(0.205 0 0);
|
|
1583
1668
|
--secondary: oklch(0.269 0 0);
|
|
1584
1669
|
--secondary-foreground: oklch(0.985 0 0);
|
|
1585
|
-
--accent: oklch(0.269 0 0);
|
|
1586
|
-
--accent-foreground: oklch(0.985 0 0);
|
|
1587
1670
|
--destructive: oklch(0.396 0.141 25.723);
|
|
1588
1671
|
--destructive-foreground: oklch(0.637 0.237 25.331);
|
|
1589
|
-
--border: oklch(0.269 0 0);
|
|
1590
1672
|
--input: oklch(0.269 0 0);
|
|
1591
1673
|
--ring: oklch(0.439 0 0);
|
|
1592
1674
|
--chart-1: oklch(0.488 0.243 264.376);
|
|
@@ -1605,7 +1687,7 @@
|
|
|
1605
1687
|
}
|
|
1606
1688
|
@layer base {
|
|
1607
1689
|
* {
|
|
1608
|
-
border-color: var(--border);
|
|
1690
|
+
border-color: hsl(var(--sg-border));
|
|
1609
1691
|
outline-color: var(--ring);
|
|
1610
1692
|
@supports (color: color-mix(in lab, red, red)) {
|
|
1611
1693
|
outline-color: color-mix(in oklab, var(--ring) 50%, transparent);
|
|
@@ -1629,6 +1711,14 @@
|
|
|
1629
1711
|
color: transparent;
|
|
1630
1712
|
}
|
|
1631
1713
|
}
|
|
1714
|
+
.gradient-hero {
|
|
1715
|
+
background:
|
|
1716
|
+
linear-gradient(
|
|
1717
|
+
135deg,
|
|
1718
|
+
hsl(var(--sg-primary-light)) 0%,
|
|
1719
|
+
hsl(var(--sg-pink)) 50%,
|
|
1720
|
+
hsl(var(--sg-orange)) 100%);
|
|
1721
|
+
}
|
|
1632
1722
|
@keyframes enter {
|
|
1633
1723
|
from {
|
|
1634
1724
|
opacity: var(--tw-enter-opacity, 1);
|
|
@@ -1735,8 +1825,10 @@
|
|
|
1735
1825
|
:root {
|
|
1736
1826
|
--sg-black: 0 0% 15%;
|
|
1737
1827
|
--sg-black-muted: 0 0% 45%;
|
|
1828
|
+
--sg-black-accent: 30 10% 18%;
|
|
1738
1829
|
--sg-white: 30 20% 98%;
|
|
1739
1830
|
--sg-white-muted: 30 8% 85%;
|
|
1831
|
+
--sg-white-accent: 210 12% 96%;
|
|
1740
1832
|
--sg-pink: 330 90% 65%;
|
|
1741
1833
|
--sg-gray-light: 240 5% 96%;
|
|
1742
1834
|
--sg-gray: 240 4% 46%;
|