|
200 | 200 | --default-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); |
201 | 201 | --default-font-family: var(--font-sans); |
202 | 202 | --default-mono-font-family: var(--font-mono); |
| 203 | + --default-ring-color: hsl(var(--ring)); |
203 | 204 | } |
204 | 205 | } |
205 | 206 | @layer base { |
|
407 | 408 | .top-0 { |
408 | 409 | top: calc(var(--spacing) * 0); |
409 | 410 | } |
| 411 | + .top-1 { |
| 412 | + top: calc(var(--spacing) * 1); |
| 413 | + } |
410 | 414 | .top-1\/2 { |
411 | 415 | top: calc(1/2 * 100%); |
412 | 416 | } |
|
446 | 450 | .left-0 { |
447 | 451 | left: calc(var(--spacing) * 0); |
448 | 452 | } |
| 453 | + .left-1 { |
| 454 | + left: calc(var(--spacing) * 1); |
| 455 | + } |
449 | 456 | .left-1\/2 { |
450 | 457 | left: calc(1/2 * 100%); |
451 | 458 | } |
|
512 | 519 | max-width: 96rem; |
513 | 520 | } |
514 | 521 | } |
| 522 | + .-m-2 { |
| 523 | + margin: calc(var(--spacing) * -2); |
| 524 | + } |
515 | 525 | .-m-2\.5 { |
516 | 526 | margin: calc(var(--spacing) * -2.5); |
517 | 527 | } |
518 | 528 | .m-2 { |
519 | 529 | margin: calc(var(--spacing) * 2); |
520 | 530 | } |
| 531 | + .-mx-1 { |
| 532 | + margin-inline: calc(var(--spacing) * -1); |
| 533 | + } |
521 | 534 | .-mx-1\.5 { |
522 | 535 | margin-inline: calc(var(--spacing) * -1.5); |
523 | 536 | } |
|
533 | 546 | .mx-auto { |
534 | 547 | margin-inline: auto; |
535 | 548 | } |
| 549 | + .-my-1 { |
| 550 | + margin-block: calc(var(--spacing) * -1); |
| 551 | + } |
536 | 552 | .-my-1\.5 { |
537 | 553 | margin-block: calc(var(--spacing) * -1.5); |
538 | 554 | } |
|
554 | 570 | .-mt-36 { |
555 | 571 | margin-top: calc(var(--spacing) * -36); |
556 | 572 | } |
| 573 | + .mt-0 { |
| 574 | + margin-top: calc(var(--spacing) * 0); |
| 575 | + } |
557 | 576 | .mt-0\.5 { |
558 | 577 | margin-top: calc(var(--spacing) * 0.5); |
559 | 578 | } |
|
608 | 627 | .-mb-px { |
609 | 628 | margin-bottom: -1px; |
610 | 629 | } |
| 630 | + .mb-0 { |
| 631 | + margin-bottom: calc(var(--spacing) * 0); |
| 632 | + } |
611 | 633 | .mb-0\.5 { |
612 | 634 | margin-bottom: calc(var(--spacing) * 0.5); |
613 | 635 | } |
|
741 | 763 | width: calc(var(--spacing) * 20); |
742 | 764 | height: calc(var(--spacing) * 20); |
743 | 765 | } |
| 766 | + .h-1 { |
| 767 | + height: calc(var(--spacing) * 1); |
| 768 | + } |
744 | 769 | .h-1\.5 { |
745 | 770 | height: calc(var(--spacing) * 1.5); |
746 | 771 | } |
|
1045 | 1070 | .origin-top-right { |
1046 | 1071 | transform-origin: 100% 0; |
1047 | 1072 | } |
| 1073 | + .-translate-x-1 { |
| 1074 | + --tw-translate-x: calc(var(--spacing) * -1); |
| 1075 | + translate: var(--tw-translate-x) var(--tw-translate-y); |
| 1076 | + } |
1048 | 1077 | .-translate-x-1\/2 { |
1049 | 1078 | --tw-translate-x: calc(calc(1/2 * 100%) * -1); |
1050 | 1079 | translate: var(--tw-translate-x) var(--tw-translate-y); |
|
1061 | 1090 | --tw-translate-x: calc(var(--spacing) * 0); |
1062 | 1091 | translate: var(--tw-translate-x) var(--tw-translate-y); |
1063 | 1092 | } |
| 1093 | + .translate-x-1 { |
| 1094 | + --tw-translate-x: calc(var(--spacing) * 1); |
| 1095 | + translate: var(--tw-translate-x) var(--tw-translate-y); |
| 1096 | + } |
1064 | 1097 | .translate-x-1\/4 { |
1065 | 1098 | --tw-translate-x: calc(1/4 * 100%); |
1066 | 1099 | translate: var(--tw-translate-x) var(--tw-translate-y); |
|
1073 | 1106 | --tw-translate-x: 100%; |
1074 | 1107 | translate: var(--tw-translate-x) var(--tw-translate-y); |
1075 | 1108 | } |
| 1109 | + .-translate-y-1 { |
| 1110 | + --tw-translate-y: calc(var(--spacing) * -1); |
| 1111 | + translate: var(--tw-translate-x) var(--tw-translate-y); |
| 1112 | + } |
1076 | 1113 | .-translate-y-1\/2 { |
1077 | 1114 | --tw-translate-y: calc(calc(1/2 * 100%) * -1); |
1078 | 1115 | translate: var(--tw-translate-x) var(--tw-translate-y); |
|
1085 | 1122 | --tw-translate-y: calc(var(--spacing) * 0); |
1086 | 1123 | translate: var(--tw-translate-x) var(--tw-translate-y); |
1087 | 1124 | } |
| 1125 | + .translate-y-1 { |
| 1126 | + --tw-translate-y: calc(var(--spacing) * 1); |
| 1127 | + translate: var(--tw-translate-x) var(--tw-translate-y); |
| 1128 | + } |
1088 | 1129 | .translate-y-1\/4 { |
1089 | 1130 | --tw-translate-y: calc(1/4 * 100%); |
1090 | 1131 | translate: var(--tw-translate-x) var(--tw-translate-y); |
|
1538 | 1579 | .border-red-400 { |
1539 | 1580 | border-color: var(--color-red-400); |
1540 | 1581 | } |
| 1582 | + .border-red-800 { |
| 1583 | + border-color: var(--color-red-800); |
| 1584 | + } |
1541 | 1585 | .border-red-800\/20 { |
1542 | 1586 | border-color: color-mix(in srgb, oklch(44.4% 0.177 26.899) 20%, transparent); |
1543 | 1587 | @supports (color: color-mix(in lab, red, red)) { |
|
1547 | 1591 | .border-transparent { |
1548 | 1592 | border-color: transparent; |
1549 | 1593 | } |
| 1594 | + .border-white { |
| 1595 | + border-color: var(--color-white); |
| 1596 | + } |
1550 | 1597 | .border-white\/10 { |
1551 | 1598 | border-color: color-mix(in srgb, #fff 10%, transparent); |
1552 | 1599 | @supports (color: color-mix(in lab, red, red)) { |
|
1568 | 1615 | .border-yellow-400 { |
1569 | 1616 | border-color: var(--color-yellow-400); |
1570 | 1617 | } |
| 1618 | + .border-yellow-500 { |
| 1619 | + border-color: var(--color-yellow-500); |
| 1620 | + } |
1571 | 1621 | .border-yellow-500\/30 { |
1572 | 1622 | border-color: color-mix(in srgb, oklch(79.5% 0.184 86.047) 30%, transparent); |
1573 | 1623 | @supports (color: color-mix(in lab, red, red)) { |
1574 | 1624 | border-color: color-mix(in oklab, var(--color-yellow-500) 30%, transparent); |
1575 | 1625 | } |
1576 | 1626 | } |
| 1627 | + .border-yellow-600 { |
| 1628 | + border-color: var(--color-yellow-600); |
| 1629 | + } |
1577 | 1630 | .border-yellow-600\/30 { |
1578 | 1631 | border-color: color-mix(in srgb, oklch(68.1% 0.162 75.834) 30%, transparent); |
1579 | 1632 | @supports (color: color-mix(in lab, red, red)) { |
|
1583 | 1636 | .bg-\[\#fdfbf7\] { |
1584 | 1637 | background-color: #fdfbf7; |
1585 | 1638 | } |
| 1639 | + .bg-black { |
| 1640 | + background-color: var(--color-black); |
| 1641 | + } |
1586 | 1642 | .bg-black\/40 { |
1587 | 1643 | background-color: color-mix(in srgb, #000 40%, transparent); |
1588 | 1644 | @supports (color: color-mix(in lab, red, red)) { |
|
1664 | 1720 | .bg-gray-400 { |
1665 | 1721 | background-color: var(--color-gray-400); |
1666 | 1722 | } |
| 1723 | + .bg-gray-500 { |
| 1724 | + background-color: var(--color-gray-500); |
| 1725 | + } |
1667 | 1726 | .bg-gray-500\/75 { |
1668 | 1727 | background-color: color-mix(in srgb, oklch(55.1% 0.027 264.364) 75%, transparent); |
1669 | 1728 | @supports (color: color-mix(in lab, red, red)) { |
|
1730 | 1789 | .bg-sky-600 { |
1731 | 1790 | background-color: var(--color-sky-600); |
1732 | 1791 | } |
| 1792 | + .bg-slate-50 { |
| 1793 | + background-color: var(--color-slate-50); |
| 1794 | + } |
1733 | 1795 | .bg-slate-50\! { |
1734 | 1796 | background-color: var(--color-slate-50) !important; |
1735 | 1797 | } |
| 1798 | + .bg-slate-400 { |
| 1799 | + background-color: var(--color-slate-400); |
| 1800 | + } |
1736 | 1801 | .bg-slate-400\/10 { |
1737 | 1802 | background-color: color-mix(in srgb, oklch(70.4% 0.04 256.788) 10%, transparent); |
1738 | 1803 | @supports (color: color-mix(in lab, red, red)) { |
|
1800 | 1865 | --tw-gradient-position: to top in oklab; |
1801 | 1866 | background-image: linear-gradient(var(--tw-gradient-stops)); |
1802 | 1867 | } |
| 1868 | + .from-black { |
| 1869 | + --tw-gradient-from: var(--color-black); |
| 1870 | + --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)); |
| 1871 | + } |
1803 | 1872 | .from-black\/80 { |
1804 | 1873 | --tw-gradient-from: color-mix(in srgb, #000 80%, transparent); |
1805 | 1874 | @supports (color: color-mix(in lab, red, red)) { |
|
1847 | 1916 | --tw-gradient-from: var(--color-yellow-400); |
1848 | 1917 | --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)); |
1849 | 1918 | } |
| 1919 | + .via-black { |
| 1920 | + --tw-gradient-via: var(--color-black); |
| 1921 | + --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); |
| 1922 | + --tw-gradient-stops: var(--tw-gradient-via-stops); |
| 1923 | + } |
1850 | 1924 | .via-black\/20 { |
1851 | 1925 | --tw-gradient-via: color-mix(in srgb, #000 20%, transparent); |
1852 | 1926 | @supports (color: color-mix(in lab, red, red)) { |
|
1986 | 2060 | .px-12 { |
1987 | 2061 | padding-inline: calc(var(--spacing) * 12); |
1988 | 2062 | } |
| 2063 | + .py-0 { |
| 2064 | + padding-block: calc(var(--spacing) * 0); |
| 2065 | + } |
1989 | 2066 | .py-0\.5 { |
1990 | 2067 | padding-block: calc(var(--spacing) * 0.5); |
1991 | 2068 | } |
|
2022 | 2099 | .py-12 { |
2023 | 2100 | padding-block: calc(var(--spacing) * 12); |
2024 | 2101 | } |
| 2102 | + .pt-0 { |
| 2103 | + padding-top: calc(var(--spacing) * 0); |
| 2104 | + } |
2025 | 2105 | .pt-0\.5 { |
2026 | 2106 | padding-top: calc(var(--spacing) * 0.5); |
2027 | 2107 | } |
|
2421 | 2501 | .text-sky-600 { |
2422 | 2502 | color: var(--color-sky-600); |
2423 | 2503 | } |
| 2504 | + .text-slate-300 { |
| 2505 | + color: var(--color-slate-300); |
| 2506 | + } |
2424 | 2507 | .text-slate-500 { |
2425 | 2508 | color: var(--color-slate-500); |
2426 | 2509 | } |
|
2608 | 2691 | --tw-inset-ring-shadow: inset 0 0 0 1px var(--tw-inset-ring-color, currentcolor); |
2609 | 2692 | box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); |
2610 | 2693 | } |
| 2694 | + .shadow-black { |
| 2695 | + --tw-shadow-color: #000; |
| 2696 | + @supports (color: color-mix(in lab, red, red)) { |
| 2697 | + --tw-shadow-color: color-mix(in oklab, var(--color-black) var(--tw-shadow-alpha), transparent); |
| 2698 | + } |
| 2699 | + } |
2611 | 2700 | .shadow-black\/5 { |
2612 | 2701 | --tw-shadow-color: color-mix(in srgb, #000 5%, transparent); |
2613 | 2702 | @supports (color: color-mix(in lab, red, red)) { |
2614 | 2703 | --tw-shadow-color: color-mix(in oklab, color-mix(in oklab, var(--color-black) 5%, transparent) var(--tw-shadow-alpha), transparent); |
2615 | 2704 | } |
2616 | 2705 | } |
| 2706 | + .shadow-fuchsia-500 { |
| 2707 | + --tw-shadow-color: oklch(66.7% 0.295 322.15); |
| 2708 | + @supports (color: color-mix(in lab, red, red)) { |
| 2709 | + --tw-shadow-color: color-mix(in oklab, var(--color-fuchsia-500) var(--tw-shadow-alpha), transparent); |
| 2710 | + } |
| 2711 | + } |
2617 | 2712 | .shadow-fuchsia-500\/10 { |
2618 | 2713 | --tw-shadow-color: color-mix(in srgb, oklch(66.7% 0.295 322.15) 10%, transparent); |
2619 | 2714 | @supports (color: color-mix(in lab, red, red)) { |
2620 | 2715 | --tw-shadow-color: color-mix(in oklab, color-mix(in oklab, var(--color-fuchsia-500) 10%, transparent) var(--tw-shadow-alpha), transparent); |
2621 | 2716 | } |
2622 | 2717 | } |
| 2718 | + .shadow-gray-200 { |
| 2719 | + --tw-shadow-color: oklch(92.8% 0.006 264.531); |
| 2720 | + @supports (color: color-mix(in lab, red, red)) { |
| 2721 | + --tw-shadow-color: color-mix(in oklab, var(--color-gray-200) var(--tw-shadow-alpha), transparent); |
| 2722 | + } |
| 2723 | + } |
2623 | 2724 | .shadow-gray-200\/50 { |
2624 | 2725 | --tw-shadow-color: color-mix(in srgb, oklch(92.8% 0.006 264.531) 50%, transparent); |
2625 | 2726 | @supports (color: color-mix(in lab, red, red)) { |
2626 | 2727 | --tw-shadow-color: color-mix(in oklab, color-mix(in oklab, var(--color-gray-200) 50%, transparent) var(--tw-shadow-alpha), transparent); |
2627 | 2728 | } |
2628 | 2729 | } |
| 2730 | + .ring-black { |
| 2731 | + --tw-ring-color: var(--color-black); |
| 2732 | + } |
2629 | 2733 | .ring-black\/5 { |
2630 | 2734 | --tw-ring-color: color-mix(in srgb, #000 5%, transparent); |
2631 | 2735 | @supports (color: color-mix(in lab, red, red)) { |
|
2647 | 2751 | .ring-indigo-500 { |
2648 | 2752 | --tw-ring-color: var(--color-indigo-500); |
2649 | 2753 | } |
| 2754 | + .ring-yellow-400 { |
| 2755 | + --tw-ring-color: var(--color-yellow-400); |
| 2756 | + } |
2650 | 2757 | .ring-yellow-400\/30 { |
2651 | 2758 | --tw-ring-color: color-mix(in srgb, oklch(85.2% 0.199 91.936) 30%, transparent); |
2652 | 2759 | @supports (color: color-mix(in lab, red, red)) { |
2653 | 2760 | --tw-ring-color: color-mix(in oklab, var(--color-yellow-400) 30%, transparent); |
2654 | 2761 | } |
2655 | 2762 | } |
| 2763 | + .inset-ring-gray-900 { |
| 2764 | + --tw-inset-ring-color: var(--color-gray-900); |
| 2765 | + } |
2656 | 2766 | .inset-ring-gray-900\/5 { |
2657 | 2767 | --tw-inset-ring-color: color-mix(in srgb, oklch(21% 0.034 264.665) 5%, transparent); |
2658 | 2768 | @supports (color: color-mix(in lab, red, red)) { |
|
0 commit comments