|
198 | 198 | --default-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); |
199 | 199 | --default-font-family: var(--font-sans); |
200 | 200 | --default-mono-font-family: var(--font-mono); |
| 201 | + --default-ring-color: hsl(var(--ring)); |
201 | 202 | } |
202 | 203 | } |
203 | 204 | @layer base { |
|
405 | 406 | .top-0 { |
406 | 407 | top: calc(var(--spacing) * 0); |
407 | 408 | } |
| 409 | + .top-1 { |
| 410 | + top: calc(var(--spacing) * 1); |
| 411 | + } |
408 | 412 | .top-1\/2 { |
409 | 413 | top: calc(1/2 * 100%); |
410 | 414 | } |
|
444 | 448 | .left-0 { |
445 | 449 | left: calc(var(--spacing) * 0); |
446 | 450 | } |
| 451 | + .left-1 { |
| 452 | + left: calc(var(--spacing) * 1); |
| 453 | + } |
447 | 454 | .left-1\/2 { |
448 | 455 | left: calc(1/2 * 100%); |
449 | 456 | } |
|
510 | 517 | max-width: 96rem; |
511 | 518 | } |
512 | 519 | } |
| 520 | + .-m-2 { |
| 521 | + margin: calc(var(--spacing) * -2); |
| 522 | + } |
513 | 523 | .-m-2\.5 { |
514 | 524 | margin: calc(var(--spacing) * -2.5); |
515 | 525 | } |
516 | 526 | .m-2 { |
517 | 527 | margin: calc(var(--spacing) * 2); |
518 | 528 | } |
| 529 | + .-mx-1 { |
| 530 | + margin-inline: calc(var(--spacing) * -1); |
| 531 | + } |
519 | 532 | .-mx-1\.5 { |
520 | 533 | margin-inline: calc(var(--spacing) * -1.5); |
521 | 534 | } |
|
531 | 544 | .mx-auto { |
532 | 545 | margin-inline: auto; |
533 | 546 | } |
| 547 | + .-my-1 { |
| 548 | + margin-block: calc(var(--spacing) * -1); |
| 549 | + } |
534 | 550 | .-my-1\.5 { |
535 | 551 | margin-block: calc(var(--spacing) * -1.5); |
536 | 552 | } |
|
552 | 568 | .-mt-36 { |
553 | 569 | margin-top: calc(var(--spacing) * -36); |
554 | 570 | } |
| 571 | + .mt-0 { |
| 572 | + margin-top: calc(var(--spacing) * 0); |
| 573 | + } |
555 | 574 | .mt-0\.5 { |
556 | 575 | margin-top: calc(var(--spacing) * 0.5); |
557 | 576 | } |
|
606 | 625 | .-mb-px { |
607 | 626 | margin-bottom: -1px; |
608 | 627 | } |
| 628 | + .mb-0 { |
| 629 | + margin-bottom: calc(var(--spacing) * 0); |
| 630 | + } |
609 | 631 | .mb-0\.5 { |
610 | 632 | margin-bottom: calc(var(--spacing) * 0.5); |
611 | 633 | } |
|
739 | 761 | width: calc(var(--spacing) * 20); |
740 | 762 | height: calc(var(--spacing) * 20); |
741 | 763 | } |
| 764 | + .h-1 { |
| 765 | + height: calc(var(--spacing) * 1); |
| 766 | + } |
742 | 767 | .h-1\.5 { |
743 | 768 | height: calc(var(--spacing) * 1.5); |
744 | 769 | } |
|
1031 | 1056 | .origin-top-right { |
1032 | 1057 | transform-origin: 100% 0; |
1033 | 1058 | } |
| 1059 | + .-translate-x-1 { |
| 1060 | + --tw-translate-x: calc(var(--spacing) * -1); |
| 1061 | + translate: var(--tw-translate-x) var(--tw-translate-y); |
| 1062 | + } |
1034 | 1063 | .-translate-x-1\/2 { |
1035 | 1064 | --tw-translate-x: calc(calc(1/2 * 100%) * -1); |
1036 | 1065 | translate: var(--tw-translate-x) var(--tw-translate-y); |
|
1047 | 1076 | --tw-translate-x: calc(var(--spacing) * 0); |
1048 | 1077 | translate: var(--tw-translate-x) var(--tw-translate-y); |
1049 | 1078 | } |
| 1079 | + .translate-x-1 { |
| 1080 | + --tw-translate-x: calc(var(--spacing) * 1); |
| 1081 | + translate: var(--tw-translate-x) var(--tw-translate-y); |
| 1082 | + } |
1050 | 1083 | .translate-x-1\/4 { |
1051 | 1084 | --tw-translate-x: calc(1/4 * 100%); |
1052 | 1085 | translate: var(--tw-translate-x) var(--tw-translate-y); |
|
1059 | 1092 | --tw-translate-x: 100%; |
1060 | 1093 | translate: var(--tw-translate-x) var(--tw-translate-y); |
1061 | 1094 | } |
| 1095 | + .-translate-y-1 { |
| 1096 | + --tw-translate-y: calc(var(--spacing) * -1); |
| 1097 | + translate: var(--tw-translate-x) var(--tw-translate-y); |
| 1098 | + } |
1062 | 1099 | .-translate-y-1\/2 { |
1063 | 1100 | --tw-translate-y: calc(calc(1/2 * 100%) * -1); |
1064 | 1101 | translate: var(--tw-translate-x) var(--tw-translate-y); |
|
1071 | 1108 | --tw-translate-y: calc(var(--spacing) * 0); |
1072 | 1109 | translate: var(--tw-translate-x) var(--tw-translate-y); |
1073 | 1110 | } |
| 1111 | + .translate-y-1 { |
| 1112 | + --tw-translate-y: calc(var(--spacing) * 1); |
| 1113 | + translate: var(--tw-translate-x) var(--tw-translate-y); |
| 1114 | + } |
1074 | 1115 | .translate-y-1\/4 { |
1075 | 1116 | --tw-translate-y: calc(1/4 * 100%); |
1076 | 1117 | translate: var(--tw-translate-x) var(--tw-translate-y); |
|
1518 | 1559 | .border-red-400 { |
1519 | 1560 | border-color: var(--color-red-400); |
1520 | 1561 | } |
| 1562 | + .border-red-800 { |
| 1563 | + border-color: var(--color-red-800); |
| 1564 | + } |
1521 | 1565 | .border-red-800\/20 { |
1522 | 1566 | border-color: color-mix(in srgb, oklch(44.4% 0.177 26.899) 20%, transparent); |
1523 | 1567 | @supports (color: color-mix(in lab, red, red)) { |
|
1527 | 1571 | .border-transparent { |
1528 | 1572 | border-color: transparent; |
1529 | 1573 | } |
| 1574 | + .border-white { |
| 1575 | + border-color: var(--color-white); |
| 1576 | + } |
1530 | 1577 | .border-white\/10 { |
1531 | 1578 | border-color: color-mix(in srgb, #fff 10%, transparent); |
1532 | 1579 | @supports (color: color-mix(in lab, red, red)) { |
|
1548 | 1595 | .border-yellow-400 { |
1549 | 1596 | border-color: var(--color-yellow-400); |
1550 | 1597 | } |
| 1598 | + .border-yellow-500 { |
| 1599 | + border-color: var(--color-yellow-500); |
| 1600 | + } |
1551 | 1601 | .border-yellow-500\/30 { |
1552 | 1602 | border-color: color-mix(in srgb, oklch(79.5% 0.184 86.047) 30%, transparent); |
1553 | 1603 | @supports (color: color-mix(in lab, red, red)) { |
1554 | 1604 | border-color: color-mix(in oklab, var(--color-yellow-500) 30%, transparent); |
1555 | 1605 | } |
1556 | 1606 | } |
| 1607 | + .border-yellow-600 { |
| 1608 | + border-color: var(--color-yellow-600); |
| 1609 | + } |
1557 | 1610 | .border-yellow-600\/30 { |
1558 | 1611 | border-color: color-mix(in srgb, oklch(68.1% 0.162 75.834) 30%, transparent); |
1559 | 1612 | @supports (color: color-mix(in lab, red, red)) { |
|
1563 | 1616 | .bg-\[\#fdfbf7\] { |
1564 | 1617 | background-color: #fdfbf7; |
1565 | 1618 | } |
| 1619 | + .bg-black { |
| 1620 | + background-color: var(--color-black); |
| 1621 | + } |
1566 | 1622 | .bg-black\/40 { |
1567 | 1623 | background-color: color-mix(in srgb, #000 40%, transparent); |
1568 | 1624 | @supports (color: color-mix(in lab, red, red)) { |
|
1644 | 1700 | .bg-gray-400 { |
1645 | 1701 | background-color: var(--color-gray-400); |
1646 | 1702 | } |
| 1703 | + .bg-gray-500 { |
| 1704 | + background-color: var(--color-gray-500); |
| 1705 | + } |
1647 | 1706 | .bg-gray-500\/75 { |
1648 | 1707 | background-color: color-mix(in srgb, oklch(55.1% 0.027 264.364) 75%, transparent); |
1649 | 1708 | @supports (color: color-mix(in lab, red, red)) { |
|
1710 | 1769 | .bg-sky-600 { |
1711 | 1770 | background-color: var(--color-sky-600); |
1712 | 1771 | } |
| 1772 | + .bg-slate-50 { |
| 1773 | + background-color: var(--color-slate-50); |
| 1774 | + } |
1713 | 1775 | .bg-slate-50\! { |
1714 | 1776 | background-color: var(--color-slate-50) !important; |
1715 | 1777 | } |
| 1778 | + .bg-slate-400 { |
| 1779 | + background-color: var(--color-slate-400); |
| 1780 | + } |
1716 | 1781 | .bg-slate-400\/10 { |
1717 | 1782 | background-color: color-mix(in srgb, oklch(70.4% 0.04 256.788) 10%, transparent); |
1718 | 1783 | @supports (color: color-mix(in lab, red, red)) { |
|
1777 | 1842 | --tw-gradient-position: to top in oklab; |
1778 | 1843 | background-image: linear-gradient(var(--tw-gradient-stops)); |
1779 | 1844 | } |
| 1845 | + .from-black { |
| 1846 | + --tw-gradient-from: var(--color-black); |
| 1847 | + --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)); |
| 1848 | + } |
1780 | 1849 | .from-black\/80 { |
1781 | 1850 | --tw-gradient-from: color-mix(in srgb, #000 80%, transparent); |
1782 | 1851 | @supports (color: color-mix(in lab, red, red)) { |
|
1824 | 1893 | --tw-gradient-from: var(--color-yellow-400); |
1825 | 1894 | --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)); |
1826 | 1895 | } |
| 1896 | + .via-black { |
| 1897 | + --tw-gradient-via: var(--color-black); |
| 1898 | + --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); |
| 1899 | + --tw-gradient-stops: var(--tw-gradient-via-stops); |
| 1900 | + } |
1827 | 1901 | .via-black\/20 { |
1828 | 1902 | --tw-gradient-via: color-mix(in srgb, #000 20%, transparent); |
1829 | 1903 | @supports (color: color-mix(in lab, red, red)) { |
|
1963 | 2037 | .px-12 { |
1964 | 2038 | padding-inline: calc(var(--spacing) * 12); |
1965 | 2039 | } |
| 2040 | + .py-0 { |
| 2041 | + padding-block: calc(var(--spacing) * 0); |
| 2042 | + } |
1966 | 2043 | .py-0\.5 { |
1967 | 2044 | padding-block: calc(var(--spacing) * 0.5); |
1968 | 2045 | } |
|
1999 | 2076 | .py-12 { |
2000 | 2077 | padding-block: calc(var(--spacing) * 12); |
2001 | 2078 | } |
| 2079 | + .pt-0 { |
| 2080 | + padding-top: calc(var(--spacing) * 0); |
| 2081 | + } |
2002 | 2082 | .pt-0\.5 { |
2003 | 2083 | padding-top: calc(var(--spacing) * 0.5); |
2004 | 2084 | } |
|
2392 | 2472 | .text-sky-600 { |
2393 | 2473 | color: var(--color-sky-600); |
2394 | 2474 | } |
| 2475 | + .text-slate-300 { |
| 2476 | + color: var(--color-slate-300); |
| 2477 | + } |
2395 | 2478 | .text-slate-500 { |
2396 | 2479 | color: var(--color-slate-500); |
2397 | 2480 | } |
|
2579 | 2662 | --tw-inset-ring-shadow: inset 0 0 0 1px var(--tw-inset-ring-color, currentcolor); |
2580 | 2663 | box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); |
2581 | 2664 | } |
| 2665 | + .shadow-black { |
| 2666 | + --tw-shadow-color: #000; |
| 2667 | + @supports (color: color-mix(in lab, red, red)) { |
| 2668 | + --tw-shadow-color: color-mix(in oklab, var(--color-black) var(--tw-shadow-alpha), transparent); |
| 2669 | + } |
| 2670 | + } |
2582 | 2671 | .shadow-black\/5 { |
2583 | 2672 | --tw-shadow-color: color-mix(in srgb, #000 5%, transparent); |
2584 | 2673 | @supports (color: color-mix(in lab, red, red)) { |
2585 | 2674 | --tw-shadow-color: color-mix(in oklab, color-mix(in oklab, var(--color-black) 5%, transparent) var(--tw-shadow-alpha), transparent); |
2586 | 2675 | } |
2587 | 2676 | } |
| 2677 | + .shadow-fuchsia-500 { |
| 2678 | + --tw-shadow-color: oklch(66.7% 0.295 322.15); |
| 2679 | + @supports (color: color-mix(in lab, red, red)) { |
| 2680 | + --tw-shadow-color: color-mix(in oklab, var(--color-fuchsia-500) var(--tw-shadow-alpha), transparent); |
| 2681 | + } |
| 2682 | + } |
2588 | 2683 | .shadow-fuchsia-500\/10 { |
2589 | 2684 | --tw-shadow-color: color-mix(in srgb, oklch(66.7% 0.295 322.15) 10%, transparent); |
2590 | 2685 | @supports (color: color-mix(in lab, red, red)) { |
2591 | 2686 | --tw-shadow-color: color-mix(in oklab, color-mix(in oklab, var(--color-fuchsia-500) 10%, transparent) var(--tw-shadow-alpha), transparent); |
2592 | 2687 | } |
2593 | 2688 | } |
| 2689 | + .shadow-gray-200 { |
| 2690 | + --tw-shadow-color: oklch(92.8% 0.006 264.531); |
| 2691 | + @supports (color: color-mix(in lab, red, red)) { |
| 2692 | + --tw-shadow-color: color-mix(in oklab, var(--color-gray-200) var(--tw-shadow-alpha), transparent); |
| 2693 | + } |
| 2694 | + } |
2594 | 2695 | .shadow-gray-200\/50 { |
2595 | 2696 | --tw-shadow-color: color-mix(in srgb, oklch(92.8% 0.006 264.531) 50%, transparent); |
2596 | 2697 | @supports (color: color-mix(in lab, red, red)) { |
2597 | 2698 | --tw-shadow-color: color-mix(in oklab, color-mix(in oklab, var(--color-gray-200) 50%, transparent) var(--tw-shadow-alpha), transparent); |
2598 | 2699 | } |
2599 | 2700 | } |
| 2701 | + .ring-black { |
| 2702 | + --tw-ring-color: var(--color-black); |
| 2703 | + } |
2600 | 2704 | .ring-black\/5 { |
2601 | 2705 | --tw-ring-color: color-mix(in srgb, #000 5%, transparent); |
2602 | 2706 | @supports (color: color-mix(in lab, red, red)) { |
|
2618 | 2722 | .ring-indigo-500 { |
2619 | 2723 | --tw-ring-color: var(--color-indigo-500); |
2620 | 2724 | } |
| 2725 | + .ring-yellow-400 { |
| 2726 | + --tw-ring-color: var(--color-yellow-400); |
| 2727 | + } |
2621 | 2728 | .ring-yellow-400\/30 { |
2622 | 2729 | --tw-ring-color: color-mix(in srgb, oklch(85.2% 0.199 91.936) 30%, transparent); |
2623 | 2730 | @supports (color: color-mix(in lab, red, red)) { |
2624 | 2731 | --tw-ring-color: color-mix(in oklab, var(--color-yellow-400) 30%, transparent); |
2625 | 2732 | } |
2626 | 2733 | } |
| 2734 | + .inset-ring-gray-900 { |
| 2735 | + --tw-inset-ring-color: var(--color-gray-900); |
| 2736 | + } |
2627 | 2737 | .inset-ring-gray-900\/5 { |
2628 | 2738 | --tw-inset-ring-color: color-mix(in srgb, oklch(21% 0.034 264.665) 5%, transparent); |
2629 | 2739 | @supports (color: color-mix(in lab, red, red)) { |
|
0 commit comments