@sikka/hawa 0.0.288 → 0.1.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/styles.css +182 -89
- package/es/blocks/AuthForms/SignInBlock.d.ts +2 -0
- package/es/blocks/AuthForms/SignInForm.d.ts +1 -1
- package/es/blocks/AuthForms/index.d.ts +1 -0
- package/es/elements/Button.d.ts +12 -0
- package/es/elements/Card.d.ts +10 -0
- package/es/elements/Icons.d.ts +19 -0
- package/es/elements/Input.d.ts +5 -0
- package/es/elements/Label.d.ts +5 -0
- package/es/index.es.js +3 -3
- package/es/util.d.ts +2 -0
- package/lib/blocks/AuthForms/SignInBlock.d.ts +2 -0
- package/lib/blocks/AuthForms/SignInForm.d.ts +1 -1
- package/lib/blocks/AuthForms/index.d.ts +1 -0
- package/lib/elements/Button.d.ts +12 -0
- package/lib/elements/Card.d.ts +10 -0
- package/lib/elements/Icons.d.ts +19 -0
- package/lib/elements/Input.d.ts +5 -0
- package/lib/elements/Label.d.ts +5 -0
- package/lib/index.js +3 -3
- package/lib/util.d.ts +2 -0
- package/package.json +5 -2
- package/src/blocks/AuthForms/ResetPasswordForm.tsx +59 -49
- package/src/blocks/AuthForms/SignInBlock.tsx +60 -0
- package/src/blocks/AuthForms/SignInForm.tsx +139 -128
- package/src/blocks/AuthForms/SignUpForm.tsx +237 -225
- package/src/blocks/AuthForms/index.ts +8 -7
- package/src/elements/Button.tsx +77 -0
- package/src/elements/Card.tsx +87 -0
- package/src/elements/HawaLoading.tsx +4 -4
- package/src/elements/HawaTextField.tsx +9 -7
- package/src/elements/Icons.tsx +145 -0
- package/src/elements/Input.tsx +25 -0
- package/src/elements/Label.tsx +26 -0
- package/src/styles.css +182 -89
- package/src/tailwind.css +22 -22
- package/src/translations/ar.json +1 -0
- package/src/translations/en.json +1 -0
- package/src/util.ts +10 -4
- package/tailwind.config.js +39 -3
package/dist/styles.css
CHANGED
|
@@ -388,46 +388,45 @@ video {
|
|
|
388
388
|
:root {
|
|
389
389
|
--background: 0 0% 100%;
|
|
390
390
|
--foreground: 240 10% 3.9%;
|
|
391
|
+
--card: 0 0% 100%;
|
|
392
|
+
--card-foreground: 240 10% 3.9%;
|
|
393
|
+
--popover: 0 0% 100%;
|
|
394
|
+
--popover-foreground: 240 10% 3.9%;
|
|
395
|
+
--primary: 240 5.9% 10%;
|
|
396
|
+
--primary-foreground: 0 0% 98%;
|
|
397
|
+
--secondary: 240 4.8% 95.9%;
|
|
398
|
+
--secondary-foreground: 240 5.9% 10%;
|
|
399
|
+
--muted: 240 4.8% 95.9%;
|
|
400
|
+
--muted-foreground: 240 3.8% 46.1%;
|
|
401
|
+
--accent: 240 4.8% 95.9%;
|
|
402
|
+
--accent-foreground: 240 5.9% 10%;
|
|
403
|
+
--destructive: 0 84.2% 60.2%;
|
|
404
|
+
--destructive-foreground: 0 0% 98%;
|
|
391
405
|
--border: 240 5.9% 90%;
|
|
406
|
+
--input: 240 5.9% 90%;
|
|
407
|
+
--ring: 240 5% 64.9%;
|
|
408
|
+
--radius: 0rem;
|
|
409
|
+
--radius-inner: calc(var(--radius) - calc(var(--radius) / 3));
|
|
392
410
|
|
|
393
411
|
--layout-primary-700: #b7aff7;
|
|
394
|
-
/* --layout-primary-500: #dfdcfc; */
|
|
395
412
|
--layout-primary-500: #fdfdfd;
|
|
396
413
|
--layout-primary-600: #f7f7f7;
|
|
397
414
|
--layout-primary-300: #e7e5fa;
|
|
398
|
-
|
|
399
415
|
--layout-secondary: #d2cdfa;
|
|
400
416
|
|
|
401
417
|
--button-primary-300: 247 72% 61%;
|
|
402
418
|
--button-primary-500: 247 82% 57%;
|
|
403
419
|
--button-primary-500-hsl: hsl(247, 82%, 57%);
|
|
404
420
|
--button-primary-700: 247 71% 39%;
|
|
405
|
-
|
|
406
421
|
--button-secondary-500: #ffc011;
|
|
407
422
|
--button-secondary-700: #b48d24;
|
|
408
|
-
|
|
409
|
-
--card: 0 0% 100%;
|
|
410
|
-
--card-foreground: 240 10% 3.9%;
|
|
411
|
-
|
|
412
|
-
--muted: 240 4.8% 95.9%;
|
|
413
|
-
--muted-foreground: 240 3.8% 46.1%;
|
|
414
|
-
|
|
415
|
-
--border-radius: 10px;
|
|
416
|
-
--border-radius-inner: calc(
|
|
417
|
-
var(--border-radius) - calc(var(--border-radius) / 3)
|
|
418
|
-
);
|
|
419
423
|
}
|
|
420
|
-
|
|
421
424
|
.dark {
|
|
422
425
|
--layout-primary-500: #363636;
|
|
423
426
|
--layout-primary-600: #2d2d2d;
|
|
424
427
|
--layout-primary-700: #1d1d1d;
|
|
425
428
|
--layout-primary-300: #4a4a4a;
|
|
426
|
-
|
|
427
|
-
|
|
428
|
-
/* --background: 240 10% 3.9%; //odd */
|
|
429
|
-
--background: 240 8% 10%;
|
|
430
|
-
|
|
429
|
+
--background: 240 10% 3.9%;
|
|
431
430
|
--foreground: 0 0% 98%;
|
|
432
431
|
--card: 240 10% 3.9%;
|
|
433
432
|
--card-foreground: 0 0% 98%;
|
|
@@ -442,12 +441,11 @@ video {
|
|
|
442
441
|
--accent: 240 3.7% 15.9%;
|
|
443
442
|
--accent-foreground: 0 0% 98%;
|
|
444
443
|
--destructive: 0 62.8% 30.6%;
|
|
445
|
-
--destructive-foreground: 0
|
|
444
|
+
--destructive-foreground: 0 85.7% 97.3%;
|
|
446
445
|
--border: 240 3.7% 15.9%;
|
|
447
446
|
--input: 240 3.7% 15.9%;
|
|
448
447
|
--ring: 240 4.9% 83.9%;
|
|
449
448
|
}
|
|
450
|
-
|
|
451
449
|
.link::after {
|
|
452
450
|
content: url("data:image/svg+xml,%3Csvg stroke='%234c37eb' fill='none' stroke-width='2' viewBox='0 0 24 24' aria-hidden='true' height='1em' width='1em' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' d='M10 6H6a2 2 0 00-2 2v10a2 2 0 002 2h10a2 2 0 002-2v-4M14 4h6m0 0v6m0-6L10 14'%3E%3C/path%3E%3C/svg%3E");
|
|
453
451
|
display: inline-block;
|
|
@@ -469,7 +467,7 @@ video {
|
|
|
469
467
|
font-size: 0.75rem;
|
|
470
468
|
/* color: theme("colors.slate.500"); */
|
|
471
469
|
/* background-color: theme("colors.stone.100"); */
|
|
472
|
-
border-radius: var(--
|
|
470
|
+
border-radius: var(--radius);
|
|
473
471
|
/* padding-left: theme("spacing[1.5]");
|
|
474
472
|
padding-right: theme("spacing[1.5]");
|
|
475
473
|
padding-top: theme("spacing.1");
|
|
@@ -642,41 +640,15 @@ video {
|
|
|
642
640
|
}
|
|
643
641
|
.container {
|
|
644
642
|
width: 100%;
|
|
643
|
+
margin-right: auto;
|
|
644
|
+
margin-left: auto;
|
|
645
|
+
padding-right: 2rem;
|
|
646
|
+
padding-left: 2rem;
|
|
645
647
|
}
|
|
646
|
-
@media (min-width:
|
|
647
|
-
|
|
648
|
-
.container {
|
|
649
|
-
max-width: 440px;
|
|
650
|
-
}
|
|
651
|
-
}
|
|
652
|
-
@media (min-width: 640px) {
|
|
653
|
-
|
|
654
|
-
.container {
|
|
655
|
-
max-width: 640px;
|
|
656
|
-
}
|
|
657
|
-
}
|
|
658
|
-
@media (min-width: 768px) {
|
|
659
|
-
|
|
660
|
-
.container {
|
|
661
|
-
max-width: 768px;
|
|
662
|
-
}
|
|
663
|
-
}
|
|
664
|
-
@media (min-width: 1024px) {
|
|
665
|
-
|
|
666
|
-
.container {
|
|
667
|
-
max-width: 1024px;
|
|
668
|
-
}
|
|
669
|
-
}
|
|
670
|
-
@media (min-width: 1280px) {
|
|
671
|
-
|
|
672
|
-
.container {
|
|
673
|
-
max-width: 1280px;
|
|
674
|
-
}
|
|
675
|
-
}
|
|
676
|
-
@media (min-width: 1536px) {
|
|
648
|
+
@media (min-width: 1400px) {
|
|
677
649
|
|
|
678
650
|
.container {
|
|
679
|
-
max-width:
|
|
651
|
+
max-width: 1400px;
|
|
680
652
|
}
|
|
681
653
|
}
|
|
682
654
|
.sr-only {
|
|
@@ -1422,6 +1394,9 @@ video {
|
|
|
1422
1394
|
-moz-columns: 1;
|
|
1423
1395
|
columns: 1;
|
|
1424
1396
|
}
|
|
1397
|
+
.grid-cols-1 {
|
|
1398
|
+
grid-template-columns: repeat(1, minmax(0, 1fr));
|
|
1399
|
+
}
|
|
1425
1400
|
.grid-cols-2 {
|
|
1426
1401
|
grid-template-columns: repeat(2, minmax(0, 1fr));
|
|
1427
1402
|
}
|
|
@@ -1500,6 +1475,9 @@ video {
|
|
|
1500
1475
|
.gap-5 {
|
|
1501
1476
|
gap: 1.25rem;
|
|
1502
1477
|
}
|
|
1478
|
+
.gap-6 {
|
|
1479
|
+
gap: 1.5rem;
|
|
1480
|
+
}
|
|
1503
1481
|
.gap-8 {
|
|
1504
1482
|
gap: 2rem;
|
|
1505
1483
|
}
|
|
@@ -1526,11 +1504,6 @@ video {
|
|
|
1526
1504
|
margin-right: calc(0.25rem * var(--tw-space-x-reverse));
|
|
1527
1505
|
margin-left: calc(0.25rem * calc(1 - var(--tw-space-x-reverse)));
|
|
1528
1506
|
}
|
|
1529
|
-
.space-x-2 > :not([hidden]) ~ :not([hidden]) {
|
|
1530
|
-
--tw-space-x-reverse: 0;
|
|
1531
|
-
margin-right: calc(0.5rem * var(--tw-space-x-reverse));
|
|
1532
|
-
margin-left: calc(0.5rem * calc(1 - var(--tw-space-x-reverse)));
|
|
1533
|
-
}
|
|
1534
1507
|
.space-x-4 > :not([hidden]) ~ :not([hidden]) {
|
|
1535
1508
|
--tw-space-x-reverse: 0;
|
|
1536
1509
|
margin-right: calc(1rem * var(--tw-space-x-reverse));
|
|
@@ -1541,6 +1514,16 @@ video {
|
|
|
1541
1514
|
margin-top: calc(0px * calc(1 - var(--tw-space-y-reverse)));
|
|
1542
1515
|
margin-bottom: calc(0px * var(--tw-space-y-reverse));
|
|
1543
1516
|
}
|
|
1517
|
+
.space-y-1 > :not([hidden]) ~ :not([hidden]) {
|
|
1518
|
+
--tw-space-y-reverse: 0;
|
|
1519
|
+
margin-top: calc(0.25rem * calc(1 - var(--tw-space-y-reverse)));
|
|
1520
|
+
margin-bottom: calc(0.25rem * var(--tw-space-y-reverse));
|
|
1521
|
+
}
|
|
1522
|
+
.space-y-1\.5 > :not([hidden]) ~ :not([hidden]) {
|
|
1523
|
+
--tw-space-y-reverse: 0;
|
|
1524
|
+
margin-top: calc(0.375rem * calc(1 - var(--tw-space-y-reverse)));
|
|
1525
|
+
margin-bottom: calc(0.375rem * var(--tw-space-y-reverse));
|
|
1526
|
+
}
|
|
1544
1527
|
.space-y-6 > :not([hidden]) ~ :not([hidden]) {
|
|
1545
1528
|
--tw-space-y-reverse: 0;
|
|
1546
1529
|
margin-top: calc(1.5rem * calc(1 - var(--tw-space-y-reverse)));
|
|
@@ -1594,7 +1577,7 @@ video {
|
|
|
1594
1577
|
white-space: nowrap;
|
|
1595
1578
|
}
|
|
1596
1579
|
.rounded {
|
|
1597
|
-
border-radius: var(--
|
|
1580
|
+
border-radius: var(--radius);
|
|
1598
1581
|
}
|
|
1599
1582
|
.rounded-3xl {
|
|
1600
1583
|
border-radius: 1.5rem;
|
|
@@ -1606,82 +1589,82 @@ video {
|
|
|
1606
1589
|
border-radius: 9999px;
|
|
1607
1590
|
}
|
|
1608
1591
|
.rounded-inner {
|
|
1609
|
-
border-radius: var(--
|
|
1592
|
+
border-radius: var(--radius-inner);
|
|
1610
1593
|
}
|
|
1611
1594
|
.rounded-lg {
|
|
1612
|
-
border-radius:
|
|
1595
|
+
border-radius: var(--radius);
|
|
1613
1596
|
}
|
|
1614
1597
|
.rounded-md {
|
|
1615
|
-
border-radius:
|
|
1598
|
+
border-radius: calc(var(--radius) - 2px);
|
|
1616
1599
|
}
|
|
1617
1600
|
.rounded-none {
|
|
1618
1601
|
border-radius: 0px;
|
|
1619
1602
|
}
|
|
1620
1603
|
.rounded-xl {
|
|
1621
|
-
border-radius:
|
|
1604
|
+
border-radius: calc(var(--radius) + 4px);
|
|
1622
1605
|
}
|
|
1623
1606
|
.rounded-b {
|
|
1624
|
-
border-bottom-right-radius: var(--
|
|
1625
|
-
border-bottom-left-radius: var(--
|
|
1607
|
+
border-bottom-right-radius: var(--radius);
|
|
1608
|
+
border-bottom-left-radius: var(--radius);
|
|
1626
1609
|
}
|
|
1627
1610
|
.rounded-b-lg {
|
|
1628
|
-
border-bottom-right-radius:
|
|
1629
|
-
border-bottom-left-radius:
|
|
1611
|
+
border-bottom-right-radius: var(--radius);
|
|
1612
|
+
border-bottom-left-radius: var(--radius);
|
|
1630
1613
|
}
|
|
1631
1614
|
.rounded-l {
|
|
1632
|
-
border-top-left-radius: var(--
|
|
1633
|
-
border-bottom-left-radius: var(--
|
|
1615
|
+
border-top-left-radius: var(--radius);
|
|
1616
|
+
border-bottom-left-radius: var(--radius);
|
|
1634
1617
|
}
|
|
1635
1618
|
.rounded-l-lg {
|
|
1636
|
-
border-top-left-radius:
|
|
1637
|
-
border-bottom-left-radius:
|
|
1619
|
+
border-top-left-radius: var(--radius);
|
|
1620
|
+
border-bottom-left-radius: var(--radius);
|
|
1638
1621
|
}
|
|
1639
1622
|
.rounded-l-none {
|
|
1640
1623
|
border-top-left-radius: 0px;
|
|
1641
1624
|
border-bottom-left-radius: 0px;
|
|
1642
1625
|
}
|
|
1643
1626
|
.rounded-r {
|
|
1644
|
-
border-top-right-radius: var(--
|
|
1645
|
-
border-bottom-right-radius: var(--
|
|
1627
|
+
border-top-right-radius: var(--radius);
|
|
1628
|
+
border-bottom-right-radius: var(--radius);
|
|
1646
1629
|
}
|
|
1647
1630
|
.rounded-t {
|
|
1648
|
-
border-top-left-radius: var(--
|
|
1649
|
-
border-top-right-radius: var(--
|
|
1631
|
+
border-top-left-radius: var(--radius);
|
|
1632
|
+
border-top-right-radius: var(--radius);
|
|
1650
1633
|
}
|
|
1651
1634
|
.rounded-t-inner {
|
|
1652
|
-
border-top-left-radius: var(--
|
|
1653
|
-
border-top-right-radius: var(--
|
|
1635
|
+
border-top-left-radius: var(--radius-inner);
|
|
1636
|
+
border-top-right-radius: var(--radius-inner);
|
|
1654
1637
|
}
|
|
1655
1638
|
.rounded-t-lg {
|
|
1656
|
-
border-top-left-radius:
|
|
1657
|
-
border-top-right-radius:
|
|
1639
|
+
border-top-left-radius: var(--radius);
|
|
1640
|
+
border-top-right-radius: var(--radius);
|
|
1658
1641
|
}
|
|
1659
1642
|
.rounded-bl {
|
|
1660
|
-
border-bottom-left-radius: var(--
|
|
1643
|
+
border-bottom-left-radius: var(--radius);
|
|
1661
1644
|
}
|
|
1662
1645
|
.rounded-bl-lg {
|
|
1663
|
-
border-bottom-left-radius:
|
|
1646
|
+
border-bottom-left-radius: var(--radius);
|
|
1664
1647
|
}
|
|
1665
1648
|
.rounded-bl-none {
|
|
1666
1649
|
border-bottom-left-radius: 0px;
|
|
1667
1650
|
}
|
|
1668
1651
|
.rounded-br {
|
|
1669
|
-
border-bottom-right-radius: var(--
|
|
1652
|
+
border-bottom-right-radius: var(--radius);
|
|
1670
1653
|
}
|
|
1671
1654
|
.rounded-br-lg {
|
|
1672
|
-
border-bottom-right-radius:
|
|
1655
|
+
border-bottom-right-radius: var(--radius);
|
|
1673
1656
|
}
|
|
1674
1657
|
.rounded-br-none {
|
|
1675
1658
|
border-bottom-right-radius: 0px;
|
|
1676
1659
|
}
|
|
1677
1660
|
.rounded-tl-lg {
|
|
1678
|
-
border-top-left-radius:
|
|
1661
|
+
border-top-left-radius: var(--radius);
|
|
1679
1662
|
}
|
|
1680
1663
|
.rounded-tl-none {
|
|
1681
1664
|
border-top-left-radius: 0px;
|
|
1682
1665
|
}
|
|
1683
1666
|
.rounded-tr-lg {
|
|
1684
|
-
border-top-right-radius:
|
|
1667
|
+
border-top-right-radius: var(--radius);
|
|
1685
1668
|
}
|
|
1686
1669
|
.rounded-tr-none {
|
|
1687
1670
|
border-top-right-radius: 0px;
|
|
@@ -1788,6 +1771,9 @@ video {
|
|
|
1788
1771
|
--tw-border-opacity: 1;
|
|
1789
1772
|
border-color: rgb(134 239 172 / var(--tw-border-opacity));
|
|
1790
1773
|
}
|
|
1774
|
+
.border-input {
|
|
1775
|
+
border-color: hsl(var(--input));
|
|
1776
|
+
}
|
|
1791
1777
|
.border-red-300 {
|
|
1792
1778
|
--tw-border-opacity: 1;
|
|
1793
1779
|
border-color: rgb(252 165 165 / var(--tw-border-opacity));
|
|
@@ -1849,6 +1835,10 @@ video {
|
|
|
1849
1835
|
--tw-bg-opacity: 1;
|
|
1850
1836
|
background-color: rgb(21 94 117 / var(--tw-bg-opacity));
|
|
1851
1837
|
}
|
|
1838
|
+
.bg-destructive {
|
|
1839
|
+
--tw-bg-opacity: 1;
|
|
1840
|
+
background-color: hsl(var(--destructive) / var(--tw-bg-opacity));
|
|
1841
|
+
}
|
|
1852
1842
|
.bg-gray-100 {
|
|
1853
1843
|
--tw-bg-opacity: 1;
|
|
1854
1844
|
background-color: rgb(243 244 246 / var(--tw-bg-opacity));
|
|
@@ -1910,6 +1900,12 @@ video {
|
|
|
1910
1900
|
--tw-bg-opacity: 1;
|
|
1911
1901
|
background-color: rgb(251 146 60 / var(--tw-bg-opacity));
|
|
1912
1902
|
}
|
|
1903
|
+
.bg-primary {
|
|
1904
|
+
background-color: hsl(var(--primary));
|
|
1905
|
+
}
|
|
1906
|
+
.bg-primary-foreground {
|
|
1907
|
+
background-color: hsl(var(--primary-foreground));
|
|
1908
|
+
}
|
|
1913
1909
|
.bg-red-100 {
|
|
1914
1910
|
--tw-bg-opacity: 1;
|
|
1915
1911
|
background-color: rgb(254 226 226 / var(--tw-bg-opacity));
|
|
@@ -1938,6 +1934,9 @@ video {
|
|
|
1938
1934
|
--tw-bg-opacity: 1;
|
|
1939
1935
|
background-color: rgb(127 29 29 / var(--tw-bg-opacity));
|
|
1940
1936
|
}
|
|
1937
|
+
.bg-secondary {
|
|
1938
|
+
background-color: hsl(var(--secondary));
|
|
1939
|
+
}
|
|
1941
1940
|
.bg-slate-600 {
|
|
1942
1941
|
--tw-bg-opacity: 1;
|
|
1943
1942
|
background-color: rgb(71 85 105 / var(--tw-bg-opacity));
|
|
@@ -2055,6 +2054,10 @@ video {
|
|
|
2055
2054
|
padding-left: 1.5rem;
|
|
2056
2055
|
padding-right: 1.5rem;
|
|
2057
2056
|
}
|
|
2057
|
+
.px-8 {
|
|
2058
|
+
padding-left: 2rem;
|
|
2059
|
+
padding-right: 2rem;
|
|
2060
|
+
}
|
|
2058
2061
|
.px-\[5px\] {
|
|
2059
2062
|
padding-left: 5px;
|
|
2060
2063
|
padding-right: 5px;
|
|
@@ -2153,6 +2156,9 @@ video {
|
|
|
2153
2156
|
.pt-4 {
|
|
2154
2157
|
padding-top: 1rem;
|
|
2155
2158
|
}
|
|
2159
|
+
.pt-6 {
|
|
2160
|
+
padding-top: 1.5rem;
|
|
2161
|
+
}
|
|
2156
2162
|
.text-left {
|
|
2157
2163
|
text-align: left;
|
|
2158
2164
|
}
|
|
@@ -2296,6 +2302,10 @@ video {
|
|
|
2296
2302
|
.text-card-foreground {
|
|
2297
2303
|
color: hsl(var(--card-foreground));
|
|
2298
2304
|
}
|
|
2305
|
+
.text-destructive-foreground {
|
|
2306
|
+
--tw-text-opacity: 1;
|
|
2307
|
+
color: hsl(var(--destructive-foreground) / var(--tw-text-opacity));
|
|
2308
|
+
}
|
|
2299
2309
|
.text-foreground {
|
|
2300
2310
|
color: hsl(var(--foreground));
|
|
2301
2311
|
}
|
|
@@ -2354,6 +2364,12 @@ video {
|
|
|
2354
2364
|
--tw-text-opacity: 1;
|
|
2355
2365
|
color: rgb(23 23 23 / var(--tw-text-opacity));
|
|
2356
2366
|
}
|
|
2367
|
+
.text-primary {
|
|
2368
|
+
color: hsl(var(--primary));
|
|
2369
|
+
}
|
|
2370
|
+
.text-primary-foreground {
|
|
2371
|
+
color: hsl(var(--primary-foreground));
|
|
2372
|
+
}
|
|
2357
2373
|
.text-red-500 {
|
|
2358
2374
|
--tw-text-opacity: 1;
|
|
2359
2375
|
color: rgb(239 68 68 / var(--tw-text-opacity));
|
|
@@ -2370,6 +2386,9 @@ video {
|
|
|
2370
2386
|
--tw-text-opacity: 1;
|
|
2371
2387
|
color: rgb(127 29 29 / var(--tw-text-opacity));
|
|
2372
2388
|
}
|
|
2389
|
+
.text-secondary-foreground {
|
|
2390
|
+
color: hsl(var(--secondary-foreground));
|
|
2391
|
+
}
|
|
2373
2392
|
.text-violet-11 {
|
|
2374
2393
|
--tw-text-opacity: 1;
|
|
2375
2394
|
color: hsl(250 43.0% 48.0% / var(--tw-text-opacity));
|
|
@@ -2482,6 +2501,9 @@ video {
|
|
|
2482
2501
|
.ring-offset-2 {
|
|
2483
2502
|
--tw-ring-offset-width: 2px;
|
|
2484
2503
|
}
|
|
2504
|
+
.ring-offset-background {
|
|
2505
|
+
--tw-ring-offset-color: hsl(var(--background));
|
|
2506
|
+
}
|
|
2485
2507
|
.drop-shadow-lg {
|
|
2486
2508
|
--tw-drop-shadow: drop-shadow(0 10px 8px rgb(0 0 0 / 0.04)) drop-shadow(0 4px 3px rgb(0 0 0 / 0.1));
|
|
2487
2509
|
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);
|
|
@@ -2505,6 +2527,13 @@ video {
|
|
|
2505
2527
|
transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
|
|
2506
2528
|
transition-duration: 150ms;
|
|
2507
2529
|
}
|
|
2530
|
+
.transition-colors {
|
|
2531
|
+
transition-property: color, background-color, border-color, fill, stroke, -webkit-text-decoration-color;
|
|
2532
|
+
transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;
|
|
2533
|
+
transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, -webkit-text-decoration-color;
|
|
2534
|
+
transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
|
|
2535
|
+
transition-duration: 150ms;
|
|
2536
|
+
}
|
|
2508
2537
|
.delay-100 {
|
|
2509
2538
|
transition-delay: 100ms;
|
|
2510
2539
|
}
|
|
@@ -2579,6 +2608,25 @@ video {
|
|
|
2579
2608
|
body {
|
|
2580
2609
|
font-family: "IBM Plex Sans Arabic", sans-serif;
|
|
2581
2610
|
}
|
|
2611
|
+
.file\:border-0::file-selector-button {
|
|
2612
|
+
border-width: 0px;
|
|
2613
|
+
}
|
|
2614
|
+
.file\:bg-transparent::file-selector-button {
|
|
2615
|
+
background-color: transparent;
|
|
2616
|
+
}
|
|
2617
|
+
.file\:text-sm::file-selector-button {
|
|
2618
|
+
font-size: 0.875rem;
|
|
2619
|
+
line-height: 1.25rem;
|
|
2620
|
+
}
|
|
2621
|
+
.file\:font-medium::file-selector-button {
|
|
2622
|
+
font-weight: 500;
|
|
2623
|
+
}
|
|
2624
|
+
.placeholder\:text-muted-foreground::-moz-placeholder {
|
|
2625
|
+
color: hsl(var(--muted-foreground));
|
|
2626
|
+
}
|
|
2627
|
+
.placeholder\:text-muted-foreground::placeholder {
|
|
2628
|
+
color: hsl(var(--muted-foreground));
|
|
2629
|
+
}
|
|
2582
2630
|
.after\:absolute::after {
|
|
2583
2631
|
content: var(--tw-content);
|
|
2584
2632
|
position: absolute;
|
|
@@ -2677,6 +2725,9 @@ body {
|
|
|
2677
2725
|
.hover\:cursor-pointer:hover {
|
|
2678
2726
|
cursor: pointer;
|
|
2679
2727
|
}
|
|
2728
|
+
.hover\:bg-accent:hover {
|
|
2729
|
+
background-color: hsl(var(--accent));
|
|
2730
|
+
}
|
|
2680
2731
|
.hover\:bg-blue-300:hover {
|
|
2681
2732
|
--tw-bg-opacity: 1;
|
|
2682
2733
|
background-color: rgb(147 197 253 / var(--tw-bg-opacity));
|
|
@@ -2700,6 +2751,9 @@ body {
|
|
|
2700
2751
|
.hover\:bg-buttonSecondary-700:hover {
|
|
2701
2752
|
background-color: var(--button-secondary-700);
|
|
2702
2753
|
}
|
|
2754
|
+
.hover\:bg-destructive\/90:hover {
|
|
2755
|
+
background-color: hsl(var(--destructive) / 0.9);
|
|
2756
|
+
}
|
|
2703
2757
|
.hover\:bg-gray-100:hover {
|
|
2704
2758
|
--tw-bg-opacity: 1;
|
|
2705
2759
|
background-color: rgb(243 244 246 / var(--tw-bg-opacity));
|
|
@@ -2737,10 +2791,16 @@ body {
|
|
|
2737
2791
|
.hover\:bg-layoutPrimary-700:hover {
|
|
2738
2792
|
background-color: var(--layout-primary-700);
|
|
2739
2793
|
}
|
|
2794
|
+
.hover\:bg-primary\/90:hover {
|
|
2795
|
+
background-color: hsl(var(--primary) / 0.9);
|
|
2796
|
+
}
|
|
2740
2797
|
.hover\:bg-red-300:hover {
|
|
2741
2798
|
--tw-bg-opacity: 1;
|
|
2742
2799
|
background-color: rgb(252 165 165 / var(--tw-bg-opacity));
|
|
2743
2800
|
}
|
|
2801
|
+
.hover\:bg-secondary\/80:hover {
|
|
2802
|
+
background-color: hsl(var(--secondary) / 0.8);
|
|
2803
|
+
}
|
|
2744
2804
|
.hover\:bg-yellow-300:hover {
|
|
2745
2805
|
--tw-bg-opacity: 1;
|
|
2746
2806
|
background-color: rgb(253 224 71 / var(--tw-bg-opacity));
|
|
@@ -2748,6 +2808,9 @@ body {
|
|
|
2748
2808
|
.hover\:font-bold:hover {
|
|
2749
2809
|
font-weight: 700;
|
|
2750
2810
|
}
|
|
2811
|
+
.hover\:text-accent-foreground:hover {
|
|
2812
|
+
color: hsl(var(--accent-foreground));
|
|
2813
|
+
}
|
|
2751
2814
|
.hover\:text-black:hover {
|
|
2752
2815
|
--tw-text-opacity: 1;
|
|
2753
2816
|
color: rgb(0 0 0 / var(--tw-text-opacity));
|
|
@@ -2844,10 +2907,34 @@ body {
|
|
|
2844
2907
|
--tw-ring-opacity: 1;
|
|
2845
2908
|
--tw-ring-color: rgb(249 250 251 / var(--tw-ring-opacity));
|
|
2846
2909
|
}
|
|
2910
|
+
.focus-visible\:outline-none:focus-visible {
|
|
2911
|
+
outline: 2px solid transparent;
|
|
2912
|
+
outline-offset: 2px;
|
|
2913
|
+
}
|
|
2914
|
+
.focus-visible\:ring-2:focus-visible {
|
|
2915
|
+
--tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
|
|
2916
|
+
--tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);
|
|
2917
|
+
box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
|
|
2918
|
+
}
|
|
2919
|
+
.focus-visible\:ring-ring:focus-visible {
|
|
2920
|
+
--tw-ring-color: hsl(var(--ring));
|
|
2921
|
+
}
|
|
2922
|
+
.focus-visible\:ring-offset-2:focus-visible {
|
|
2923
|
+
--tw-ring-offset-width: 2px;
|
|
2924
|
+
}
|
|
2925
|
+
.disabled\:pointer-events-none:disabled {
|
|
2926
|
+
pointer-events: none;
|
|
2927
|
+
}
|
|
2928
|
+
.disabled\:cursor-not-allowed:disabled {
|
|
2929
|
+
cursor: not-allowed;
|
|
2930
|
+
}
|
|
2847
2931
|
.disabled\:bg-gray-200:disabled {
|
|
2848
2932
|
--tw-bg-opacity: 1;
|
|
2849
2933
|
background-color: rgb(229 231 235 / var(--tw-bg-opacity));
|
|
2850
2934
|
}
|
|
2935
|
+
.disabled\:opacity-50:disabled {
|
|
2936
|
+
opacity: 0.5;
|
|
2937
|
+
}
|
|
2851
2938
|
.group:hover .group-hover\:opacity-100 {
|
|
2852
2939
|
opacity: 1;
|
|
2853
2940
|
}
|
|
@@ -2885,6 +2972,12 @@ body {
|
|
|
2885
2972
|
--tw-border-opacity: 1;
|
|
2886
2973
|
border-color: rgb(255 255 255 / var(--tw-border-opacity));
|
|
2887
2974
|
}
|
|
2975
|
+
.peer:disabled ~ .peer-disabled\:cursor-not-allowed {
|
|
2976
|
+
cursor: not-allowed;
|
|
2977
|
+
}
|
|
2978
|
+
.peer:disabled ~ .peer-disabled\:opacity-70 {
|
|
2979
|
+
opacity: 0.7;
|
|
2980
|
+
}
|
|
2888
2981
|
.data-\[disabled\]\:pointer-events-none[data-disabled] {
|
|
2889
2982
|
pointer-events: none;
|
|
2890
2983
|
}
|
|
@@ -3360,8 +3453,8 @@ body {
|
|
|
3360
3453
|
}
|
|
3361
3454
|
|
|
3362
3455
|
.md\:rounded-l-lg {
|
|
3363
|
-
border-top-left-radius:
|
|
3364
|
-
border-bottom-left-radius:
|
|
3456
|
+
border-top-left-radius: var(--radius);
|
|
3457
|
+
border-bottom-left-radius: var(--radius);
|
|
3365
3458
|
}
|
|
3366
3459
|
|
|
3367
3460
|
.md\:border-l {
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
import * as React from "react";
|
|
2
|
+
import { type VariantProps } from "class-variance-authority";
|
|
3
|
+
declare const buttonVariants: (props?: {
|
|
4
|
+
variant?: "default" | "destructive" | "outline" | "secondary" | "ghost" | "link";
|
|
5
|
+
size?: "default" | "sm" | "lg" | "icon";
|
|
6
|
+
} & import("class-variance-authority/dist/types").ClassProp) => string;
|
|
7
|
+
export interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement>, VariantProps<typeof buttonVariants> {
|
|
8
|
+
asChild?: boolean;
|
|
9
|
+
isLoading?: boolean;
|
|
10
|
+
}
|
|
11
|
+
declare const Button: React.ForwardRefExoticComponent<ButtonProps & React.RefAttributes<HTMLButtonElement>>;
|
|
12
|
+
export { Button, buttonVariants };
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import * as React from "react";
|
|
2
|
+
declare const Card: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
|
|
3
|
+
declare const CardHeader: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
|
|
4
|
+
declare const CardTitle: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLHeadingElement> & React.RefAttributes<HTMLParagraphElement>>;
|
|
5
|
+
declare const CardDescription: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLParagraphElement> & React.RefAttributes<HTMLParagraphElement>>;
|
|
6
|
+
declare const CardContent: React.ForwardRefExoticComponent<{
|
|
7
|
+
headless?: boolean;
|
|
8
|
+
} & React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
|
|
9
|
+
declare const CardFooter: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
|
|
10
|
+
export { Card, CardHeader, CardFooter, CardTitle, CardDescription, CardContent };
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
type IconProps = React.HTMLAttributes<SVGElement>;
|
|
3
|
+
export declare const Icons: {
|
|
4
|
+
logo: (props: IconProps) => import("react").JSX.Element;
|
|
5
|
+
twitter: (props: IconProps) => import("react").JSX.Element;
|
|
6
|
+
gitHub: (props: IconProps) => import("react").JSX.Element;
|
|
7
|
+
radix: (props: IconProps) => import("react").JSX.Element;
|
|
8
|
+
aria: (props: IconProps) => import("react").JSX.Element;
|
|
9
|
+
npm: (props: IconProps) => import("react").JSX.Element;
|
|
10
|
+
yarn: (props: IconProps) => import("react").JSX.Element;
|
|
11
|
+
pnpm: (props: IconProps) => import("react").JSX.Element;
|
|
12
|
+
react: (props: IconProps) => import("react").JSX.Element;
|
|
13
|
+
tailwind: (props: IconProps) => import("react").JSX.Element;
|
|
14
|
+
google: (props: IconProps) => import("react").JSX.Element;
|
|
15
|
+
apple: (props: IconProps) => import("react").JSX.Element;
|
|
16
|
+
paypal: (props: IconProps) => import("react").JSX.Element;
|
|
17
|
+
spinner: (props: IconProps) => import("react").JSX.Element;
|
|
18
|
+
};
|
|
19
|
+
export {};
|
|
@@ -0,0 +1,5 @@
|
|
|
1
|
+
import * as React from "react";
|
|
2
|
+
import * as LabelPrimitive from "@radix-ui/react-label";
|
|
3
|
+
import { type VariantProps } from "class-variance-authority";
|
|
4
|
+
declare const Label: React.ForwardRefExoticComponent<Omit<LabelPrimitive.LabelProps & React.RefAttributes<HTMLLabelElement>, "ref"> & VariantProps<(props?: import("class-variance-authority/dist/types").ClassProp) => string> & React.RefAttributes<HTMLLabelElement>>;
|
|
5
|
+
export { Label };
|