+1 -1

paw/__init__.py

reviewed

··· 1 1 from django import get_version 2 2 3 3 - VERSION = (0, 1, 0, "beta", 5) 3 3 + VERSION = (0, 1, 0, "beta", 6) 4 4 5 5 __version__ = get_version(VERSION)

+9

paw/templates/ticketing/ticket_detail.html

reviewed

··· 14 14 {% else %} 15 15 <div class="chat chat-end"> 16 16 {% endif %} 17 17 + <div class="chat-image avatar placeholder"> 18 18 + <div class="bg-base-300 text-base-content rounded-full w-10"> 19 19 + {% if comment.user.profile_picture %} 20 20 + <img src="{{ comment.user.profile_picture.url }}" /> 21 21 + {% else %} 22 22 + <span>{{ comment.user.username|slice:":2" }}</span> 23 23 + {% endif %} 24 24 + </div> 25 25 + </div> 17 26 <div class="chat-header"> 18 27 {{ comment.user.username }} 19 28 <time class="text-xs opacity-50">{{ comment.created_at|date:"d.m.y" }}</time>

+88 -1174

static/css/paw.css

reviewed

··· 639 639 --tw-backdrop-sepia: ; 640 640 } 641 641 642 642 - .container { 643 643 - width: 100%; 644 644 - } 645 645 - 646 646 - @media (min-width: 640px) { 647 647 - .container { 648 648 - max-width: 640px; 649 649 - } 650 650 - } 651 651 - 652 652 - @media (min-width: 768px) { 653 653 - .container { 654 654 - max-width: 768px; 655 655 - } 656 656 - } 657 657 - 658 658 - @media (min-width: 1024px) { 659 659 - .container { 660 660 - max-width: 1024px; 661 661 - } 662 662 - } 663 663 - 664 664 - @media (min-width: 1280px) { 665 665 - .container { 666 666 - max-width: 1280px; 667 667 - } 668 668 - } 669 669 - 670 670 - @media (min-width: 1536px) { 671 671 - .container { 672 672 - max-width: 1536px; 673 673 - } 674 674 - } 675 675 - 676 676 - .alert { 677 677 - display: grid; 678 678 - width: 100%; 679 679 - grid-auto-flow: row; 680 680 - align-content: flex-start; 681 681 - align-items: center; 682 682 - justify-items: center; 683 683 - gap: 1rem; 684 684 - text-align: center; 685 685 - border-radius: var(--rounded-box, 1rem); 686 686 - border-width: 1px; 687 687 - --tw-border-opacity: 1; 688 688 - border-color: var(--fallback-b2,oklch(var(--b2)/var(--tw-border-opacity))); 689 689 - padding: 1rem; 690 690 - --tw-text-opacity: 1; 691 691 - color: var(--fallback-bc,oklch(var(--bc)/var(--tw-text-opacity))); 692 692 - --alert-bg: var(--fallback-b2,oklch(var(--b2)/1)); 693 693 - --alert-bg-mix: var(--fallback-b1,oklch(var(--b1)/1)); 694 694 - background-color: var(--alert-bg); 695 695 - } 696 696 - 697 697 - @media (min-width: 640px) { 698 698 - .alert { 699 699 - grid-auto-flow: column; 700 700 - grid-template-columns: auto minmax(auto,1fr); 701 701 - justify-items: start; 702 702 - text-align: start; 703 703 - } 704 704 - } 705 705 - 706 642 .avatar { 707 643 position: relative; 708 644 display: inline-flex; ··· 760 696 color: var(--fallback-bc,oklch(var(--bc)/var(--tw-text-opacity))); 761 697 } 762 698 763 763 - .menu li > *:not(ul, .menu-title, details, .btn):active, 764 764 - .menu li > *:not(ul, .menu-title, details, .btn).active, 765 765 - .menu li > details > summary:active { 766 766 - --tw-bg-opacity: 1; 767 767 - background-color: var(--fallback-n,oklch(var(--n)/var(--tw-bg-opacity))); 768 768 - --tw-text-opacity: 1; 769 769 - color: var(--fallback-nc,oklch(var(--nc)/var(--tw-text-opacity))); 770 770 - } 771 771 - 772 699 .table tr.hover:hover, 773 700 .table tr.hover:nth-child(even):hover { 774 701 --tw-bg-opacity: 1; ··· 901 828 padding-bottom: 0.25rem; 902 829 } 903 830 831 831 + .chat-image { 832 832 + grid-row: span 2 / span 2; 833 833 + align-self: flex-end; 834 834 + } 835 835 + 904 836 .chat-header { 905 837 grid-row-start: 1; 906 838 font-size: 0.875rem; ··· 1013 945 mask-image: url("data:image/svg+xml,%3csvg width='3' height='3' xmlns='http://www.w3.org/2000/svg'%3e%3cpath fill='black' d='m 0 3 L 3 3 L 3 0 C 3 1 1 3 0 3'/%3e%3c/svg%3e"); 1014 946 } 1015 947 1016 1016 - .checkbox { 1017 1017 - flex-shrink: 0; 1018 1018 - --chkbg: var(--fallback-bc,oklch(var(--bc)/1)); 1019 1019 - --chkfg: var(--fallback-b1,oklch(var(--b1)/1)); 1020 1020 - height: 1.5rem; 1021 1021 - width: 1.5rem; 1022 1022 - cursor: pointer; 1023 1023 - -webkit-appearance: none; 1024 1024 - -moz-appearance: none; 1025 1025 - appearance: none; 1026 1026 - border-radius: var(--rounded-btn, 0.5rem); 1027 1027 - border-width: 1px; 1028 1028 - border-color: var(--fallback-bc,oklch(var(--bc)/var(--tw-border-opacity))); 1029 1029 - --tw-border-opacity: 0.2; 1030 1030 - } 1031 1031 - 1032 948 .divider { 1033 949 display: flex; 1034 950 flex-direction: row; ··· 1050 966 background-color: var(--fallback-bc,oklch(var(--bc)/0.1)); 1051 967 } 1052 968 1053 1053 - .drawer { 1054 1054 - position: relative; 1055 1055 - display: grid; 1056 1056 - grid-auto-columns: max-content auto; 1057 1057 - width: 100%; 1058 1058 - } 1059 1059 - 1060 1060 - .drawer-content { 1061 1061 - grid-column-start: 2; 1062 1062 - grid-row-start: 1; 1063 1063 - min-width: 0px; 1064 1064 - } 1065 1065 - 1066 1066 - .drawer-side { 1067 1067 - pointer-events: none; 1068 1068 - position: fixed; 1069 1069 - inset-inline-start: 0px; 1070 1070 - top: 0px; 1071 1071 - grid-column-start: 1; 1072 1072 - grid-row-start: 1; 1073 1073 - display: grid; 1074 1074 - width: 100%; 1075 1075 - grid-template-columns: repeat(1, minmax(0, 1fr)); 1076 1076 - grid-template-rows: repeat(1, minmax(0, 1fr)); 1077 1077 - align-items: flex-start; 1078 1078 - justify-items: start; 1079 1079 - overflow-x: hidden; 1080 1080 - overflow-y: hidden; 1081 1081 - overscroll-behavior: contain; 1082 1082 - height: 100vh; 1083 1083 - height: 100dvh; 1084 1084 - } 1085 1085 - 1086 1086 - .drawer-side > .drawer-overlay { 1087 1087 - position: sticky; 1088 1088 - top: 0px; 1089 1089 - place-self: stretch; 1090 1090 - cursor: pointer; 1091 1091 - background-color: transparent; 1092 1092 - transition-property: color, background-color, border-color, text-decoration-color, fill, stroke; 1093 1093 - transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); 1094 1094 - transition-timing-function: cubic-bezier(0, 0, 0.2, 1); 1095 1095 - transition-duration: 200ms; 1096 1096 - } 1097 1097 - 1098 1098 - .drawer-side > * { 1099 1099 - grid-column-start: 1; 1100 1100 - grid-row-start: 1; 1101 1101 - } 1102 1102 - 1103 1103 - .drawer-side > *:not(.drawer-overlay) { 1104 1104 - transition-property: transform; 1105 1105 - transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); 1106 1106 - transition-timing-function: cubic-bezier(0, 0, 0.2, 1); 1107 1107 - transition-duration: 300ms; 1108 1108 - will-change: transform; 1109 1109 - transform: translateX(-100%); 1110 1110 - } 1111 1111 - 1112 1112 - [dir="rtl"] .drawer-side > *:not(.drawer-overlay) { 1113 1113 - transform: translateX(100%); 1114 1114 - } 1115 1115 - 1116 1116 - .drawer-toggle { 1117 1117 - position: fixed; 1118 1118 - height: 0px; 1119 1119 - width: 0px; 1120 1120 - -webkit-appearance: none; 1121 1121 - -moz-appearance: none; 1122 1122 - appearance: none; 1123 1123 - opacity: 0; 1124 1124 - } 1125 1125 - 1126 1126 - .drawer-toggle:checked ~ .drawer-side { 1127 1127 - pointer-events: auto; 1128 1128 - visibility: visible; 1129 1129 - overflow-y: auto; 1130 1130 - } 1131 1131 - 1132 1132 - .drawer-toggle:checked ~ .drawer-side > *:not(.drawer-overlay) { 1133 1133 - transform: translateX(0%); 1134 1134 - } 1135 1135 - 1136 1136 - .drawer-end .drawer-toggle ~ .drawer-content { 1137 1137 - grid-column-start: 1; 1138 1138 - } 1139 1139 - 1140 1140 - .drawer-end .drawer-toggle ~ .drawer-side { 1141 1141 - grid-column-start: 2; 1142 1142 - justify-items: end; 1143 1143 - } 1144 1144 - 1145 1145 - .drawer-end .drawer-toggle ~ .drawer-side > *:not(.drawer-overlay) { 1146 1146 - transform: translateX(100%); 1147 1147 - } 1148 1148 - 1149 1149 - [dir="rtl"] .drawer-end .drawer-toggle ~ .drawer-side > *:not(.drawer-overlay) { 1150 1150 - transform: translateX(-100%); 1151 1151 - } 1152 1152 - 1153 1153 - .drawer-end .drawer-toggle:checked ~ .drawer-side > *:not(.drawer-overlay) { 1154 1154 - transform: translateX(0%); 1155 1155 - } 1156 1156 - 1157 969 @media (hover: hover) { 1158 1158 - .btm-nav > *.disabled:hover, 1159 1159 - .btm-nav > *[disabled]:hover { 1160 1160 - pointer-events: none; 1161 1161 - --tw-border-opacity: 0; 1162 1162 - background-color: var(--fallback-n,oklch(var(--n)/var(--tw-bg-opacity))); 1163 1163 - --tw-bg-opacity: 0.1; 1164 1164 - color: var(--fallback-bc,oklch(var(--bc)/var(--tw-text-opacity))); 1165 1165 - --tw-text-opacity: 0.2; 1166 1166 - } 1167 1167 - 1168 970 .btn:hover { 1169 971 --tw-border-opacity: 1; 1170 972 border-color: var(--fallback-b3,oklch(var(--b3)/var(--tw-border-opacity))); ··· 1209 1011 } 1210 1012 } 1211 1013 1212 1212 - .btn-outline.btn-primary:hover { 1213 1213 - --tw-text-opacity: 1; 1214 1214 - color: var(--fallback-pc,oklch(var(--pc)/var(--tw-text-opacity))); 1215 1215 - } 1216 1216 - 1217 1217 - @supports (color: color-mix(in oklab, black, black)) { 1218 1218 - .btn-outline.btn-primary:hover { 1219 1219 - background-color: color-mix(in oklab, var(--fallback-p,oklch(var(--p)/1)) 90%, black); 1220 1220 - border-color: color-mix(in oklab, var(--fallback-p,oklch(var(--p)/1)) 90%, black); 1221 1221 - } 1222 1222 - } 1223 1223 - 1224 1014 .btn-outline.btn-accent:hover { 1225 1015 --tw-text-opacity: 1; 1226 1016 color: var(--fallback-ac,oklch(var(--ac)/var(--tw-text-opacity))); ··· 1285 1075 border-color: color-mix(in oklab, var(--fallback-p,oklch(var(--p)/1)) 90%, black); 1286 1076 } 1287 1077 } 1288 1288 - 1289 1289 - :where(.menu li:not(.menu-title, .disabled) > *:not(ul, details, .menu-title)):not(.active, .btn):hover, :where(.menu li:not(.menu-title, .disabled) > details > summary:not(.menu-title)):not(.active, .btn):hover { 1290 1290 - cursor: pointer; 1291 1291 - outline: 2px solid transparent; 1292 1292 - outline-offset: 2px; 1293 1293 - } 1294 1294 - 1295 1295 - @supports (color: oklch(0 0 0)) { 1296 1296 - :where(.menu li:not(.menu-title, .disabled) > *:not(ul, details, .menu-title)):not(.active, .btn):hover, :where(.menu li:not(.menu-title, .disabled) > details > summary:not(.menu-title)):not(.active, .btn):hover { 1297 1297 - background-color: var(--fallback-bc,oklch(var(--bc)/0.1)); 1298 1298 - } 1299 1299 - } 1300 1078 } 1301 1079 1302 1080 .file-input { ··· 1353 1131 animation: button-pop var(--animation-btn, 0.25s) ease-out; 1354 1132 } 1355 1133 1356 1356 - .footer { 1357 1357 - display: grid; 1358 1358 - width: 100%; 1359 1359 - grid-auto-flow: row; 1360 1360 - place-items: start; 1361 1361 - -moz-column-gap: 1rem; 1362 1362 - column-gap: 1rem; 1363 1363 - row-gap: 2.5rem; 1364 1364 - font-size: 0.875rem; 1365 1365 - line-height: 1.25rem; 1366 1366 - } 1367 1367 - 1368 1368 - .footer > * { 1369 1369 - display: grid; 1370 1370 - place-items: start; 1371 1371 - gap: 0.5rem; 1372 1372 - } 1373 1373 - 1374 1374 - @media (min-width: 48rem) { 1375 1375 - .footer { 1376 1376 - grid-auto-flow: column; 1377 1377 - } 1378 1378 - 1379 1379 - .footer-center { 1380 1380 - grid-auto-flow: row dense; 1381 1381 - } 1382 1382 - } 1383 1383 - 1384 1134 .form-control { 1385 1135 display: flex; 1386 1136 flex-direction: column; ··· 1492 1242 text-decoration-line: underline; 1493 1243 } 1494 1244 1495 1495 - .mask { 1496 1496 - -webkit-mask-size: contain; 1497 1497 - mask-size: contain; 1498 1498 - -webkit-mask-repeat: no-repeat; 1499 1499 - mask-repeat: no-repeat; 1500 1500 - -webkit-mask-position: center; 1501 1501 - mask-position: center; 1502 1502 - } 1503 1503 - 1504 1504 - .menu { 1505 1505 - display: flex; 1506 1506 - flex-direction: column; 1507 1507 - flex-wrap: wrap; 1508 1508 - font-size: 0.875rem; 1509 1509 - line-height: 1.25rem; 1510 1510 - padding: 0.5rem; 1511 1511 - } 1512 1512 - 1513 1513 - .menu :where(li ul) { 1514 1514 - position: relative; 1515 1515 - white-space: nowrap; 1516 1516 - margin-inline-start: 1rem; 1517 1517 - padding-inline-start: 0.5rem; 1518 1518 - } 1519 1519 - 1520 1520 - .menu :where(li:not(.menu-title) > *:not(ul, details, .menu-title, .btn)), .menu :where(li:not(.menu-title) > details > summary:not(.menu-title)) { 1521 1521 - display: grid; 1522 1522 - grid-auto-flow: column; 1523 1523 - align-content: flex-start; 1524 1524 - align-items: center; 1525 1525 - gap: 0.5rem; 1526 1526 - grid-auto-columns: minmax(auto, max-content) auto max-content; 1527 1527 - -webkit-user-select: none; 1528 1528 - -moz-user-select: none; 1529 1529 - user-select: none; 1530 1530 - } 1531 1531 - 1532 1532 - .menu li.disabled { 1533 1533 - cursor: not-allowed; 1534 1534 - -webkit-user-select: none; 1535 1535 - -moz-user-select: none; 1536 1536 - user-select: none; 1537 1537 - color: var(--fallback-bc,oklch(var(--bc)/0.3)); 1538 1538 - } 1539 1539 - 1540 1540 - .menu :where(li > .menu-dropdown:not(.menu-dropdown-show)) { 1541 1541 - display: none; 1542 1542 - } 1543 1543 - 1544 1544 - :where(.menu li) { 1545 1545 - position: relative; 1546 1546 - display: flex; 1547 1547 - flex-shrink: 0; 1548 1548 - flex-direction: column; 1549 1549 - flex-wrap: wrap; 1550 1550 - align-items: stretch; 1551 1551 - } 1552 1552 - 1553 1245 :where(.menu li) .badge { 1554 1246 justify-self: end; 1555 1247 } ··· 1638 1330 font-weight: 800; 1639 1331 } 1640 1332 1641 1641 - .stat-desc { 1642 1642 - grid-column-start: 1; 1643 1643 - white-space: nowrap; 1644 1644 - font-size: 0.75rem; 1645 1645 - line-height: 1rem; 1646 1646 - color: var(--fallback-bc,oklch(var(--bc)/0.6)); 1647 1647 - } 1648 1648 - 1649 1333 .table { 1650 1334 position: relative; 1651 1335 width: 100%; ··· 1696 1380 background-color: var(--fallback-b1,oklch(var(--b1)/var(--tw-bg-opacity))); 1697 1381 } 1698 1382 1699 1699 - .toggle { 1700 1700 - flex-shrink: 0; 1701 1701 - --tglbg: var(--fallback-b1,oklch(var(--b1)/1)); 1702 1702 - --handleoffset: 1.5rem; 1703 1703 - --handleoffsetcalculator: calc(var(--handleoffset) * -1); 1704 1704 - --togglehandleborder: 0 0; 1705 1705 - height: 1.5rem; 1706 1706 - width: 3rem; 1707 1707 - cursor: pointer; 1708 1708 - -webkit-appearance: none; 1709 1709 - -moz-appearance: none; 1710 1710 - appearance: none; 1711 1711 - border-radius: var(--rounded-badge, 1.9rem); 1712 1712 - border-width: 1px; 1713 1713 - border-color: currentColor; 1714 1714 - background-color: currentColor; 1715 1715 - color: var(--fallback-bc,oklch(var(--bc)/0.5)); 1716 1716 - transition: background, 1717 1717 - box-shadow var(--animation-input, 0.2s) ease-out; 1718 1718 - box-shadow: var(--handleoffsetcalculator) 0 0 2px var(--tglbg) inset, 1719 1719 - 0 0 0 2px var(--tglbg) inset, 1720 1720 - var(--togglehandleborder); 1721 1721 - } 1722 1722 - 1723 1723 - .alert-error { 1724 1724 - border-color: var(--fallback-er,oklch(var(--er)/0.2)); 1725 1725 - --tw-text-opacity: 1; 1726 1726 - color: var(--fallback-erc,oklch(var(--erc)/var(--tw-text-opacity))); 1727 1727 - --alert-bg: var(--fallback-er,oklch(var(--er)/1)); 1728 1728 - --alert-bg-mix: var(--fallback-b1,oklch(var(--b1)/1)); 1729 1729 - } 1730 1730 - 1731 1383 .avatar-group :where(.avatar) { 1732 1384 overflow: hidden; 1733 1385 border-radius: 9999px; ··· 1743 1395 background-color: var(--fallback-n,oklch(var(--n)/var(--tw-bg-opacity))); 1744 1396 --tw-text-opacity: 1; 1745 1397 color: var(--fallback-nc,oklch(var(--nc)/var(--tw-text-opacity))); 1746 1746 - } 1747 1747 - 1748 1748 - .badge-primary { 1749 1749 - --tw-border-opacity: 1; 1750 1750 - border-color: var(--fallback-p,oklch(var(--p)/var(--tw-border-opacity))); 1751 1751 - --tw-bg-opacity: 1; 1752 1752 - background-color: var(--fallback-p,oklch(var(--p)/var(--tw-bg-opacity))); 1753 1753 - --tw-text-opacity: 1; 1754 1754 - color: var(--fallback-pc,oklch(var(--pc)/var(--tw-text-opacity))); 1755 1755 - } 1756 1756 - 1757 1757 - .badge-accent { 1758 1758 - --tw-border-opacity: 1; 1759 1759 - border-color: var(--fallback-a,oklch(var(--a)/var(--tw-border-opacity))); 1760 1760 - --tw-bg-opacity: 1; 1761 1761 - background-color: var(--fallback-a,oklch(var(--a)/var(--tw-bg-opacity))); 1762 1762 - --tw-text-opacity: 1; 1763 1763 - color: var(--fallback-ac,oklch(var(--ac)/var(--tw-text-opacity))); 1764 1398 } 1765 1399 1766 1400 .badge-success { ··· 1787 1421 color: var(--fallback-erc,oklch(var(--erc)/var(--tw-text-opacity))); 1788 1422 } 1789 1423 1790 1790 - .badge-ghost { 1791 1791 - --tw-border-opacity: 1; 1792 1792 - border-color: var(--fallback-b2,oklch(var(--b2)/var(--tw-border-opacity))); 1793 1793 - --tw-bg-opacity: 1; 1794 1794 - background-color: var(--fallback-b2,oklch(var(--b2)/var(--tw-bg-opacity))); 1795 1795 - --tw-text-opacity: 1; 1796 1796 - color: var(--fallback-bc,oklch(var(--bc)/var(--tw-text-opacity))); 1797 1797 - } 1798 1798 - 1799 1424 .badge-outline.badge-neutral { 1800 1425 --tw-text-opacity: 1; 1801 1426 color: var(--fallback-n,oklch(var(--n)/var(--tw-text-opacity))); 1802 1802 - } 1803 1803 - 1804 1804 - .badge-outline.badge-primary { 1805 1805 - --tw-text-opacity: 1; 1806 1806 - color: var(--fallback-p,oklch(var(--p)/var(--tw-text-opacity))); 1807 1807 - } 1808 1808 - 1809 1809 - .badge-outline.badge-accent { 1810 1810 - --tw-text-opacity: 1; 1811 1811 - color: var(--fallback-a,oklch(var(--a)/var(--tw-text-opacity))); 1812 1427 } 1813 1428 1814 1429 .badge-outline.badge-success { ··· 1826 1441 color: var(--fallback-er,oklch(var(--er)/var(--tw-text-opacity))); 1827 1442 } 1828 1443 1829 1829 - .btm-nav > *.disabled, 1830 1830 - .btm-nav > *[disabled] { 1831 1831 - pointer-events: none; 1832 1832 - --tw-border-opacity: 0; 1833 1833 - background-color: var(--fallback-n,oklch(var(--n)/var(--tw-bg-opacity))); 1834 1834 - --tw-bg-opacity: 0.1; 1835 1835 - color: var(--fallback-bc,oklch(var(--bc)/var(--tw-text-opacity))); 1836 1836 - --tw-text-opacity: 0.2; 1837 1837 - } 1838 1838 - 1839 1444 .btm-nav > * .label { 1840 1445 font-size: 1rem; 1841 1446 line-height: 1.5rem; ··· 1853 1458 border-color: var(--btn-color, var(--fallback-b2)); 1854 1459 } 1855 1460 1856 1856 - .btn-primary { 1857 1857 - --btn-color: var(--fallback-p); 1858 1858 - } 1859 1859 - 1860 1461 .btn-accent { 1861 1462 --btn-color: var(--fallback-a); 1862 1463 } ··· 1879 1480 } 1880 1481 1881 1482 @supports (color: color-mix(in oklab, black, black)) { 1882 1882 - .btn-outline.btn-primary.btn-active { 1883 1883 - background-color: color-mix(in oklab, var(--fallback-p,oklch(var(--p)/1)) 90%, black); 1884 1884 - border-color: color-mix(in oklab, var(--fallback-p,oklch(var(--p)/1)) 90%, black); 1885 1885 - } 1886 1886 - 1887 1483 .btn-outline.btn-accent.btn-active { 1888 1484 background-color: color-mix(in oklab, var(--fallback-a,oklch(var(--a)/1)) 90%, black); 1889 1485 border-color: color-mix(in oklab, var(--fallback-a,oklch(var(--a)/1)) 90%, black); ··· 1911 1507 outline-offset: 2px; 1912 1508 } 1913 1509 1914 1914 - .btn-primary { 1915 1915 - --tw-text-opacity: 1; 1916 1916 - color: var(--fallback-pc,oklch(var(--pc)/var(--tw-text-opacity))); 1917 1917 - outline-color: var(--fallback-p,oklch(var(--p)/1)); 1918 1918 - } 1919 1919 - 1920 1510 @supports (color: oklch(0 0 0)) { 1921 1921 - .btn-primary { 1922 1922 - --btn-color: var(--p); 1923 1923 - } 1924 1924 - 1925 1511 .btn-accent { 1926 1512 --btn-color: var(--a); 1927 1513 } ··· 1999 1585 .btn-ghost.btn-active { 2000 1586 border-color: transparent; 2001 1587 background-color: var(--fallback-bc,oklch(var(--bc)/0.2)); 2002 2002 - } 2003 2003 - 2004 2004 - .btn-outline.btn-primary { 2005 2005 - --tw-text-opacity: 1; 2006 2006 - color: var(--fallback-p,oklch(var(--p)/var(--tw-text-opacity))); 2007 2007 - } 2008 2008 - 2009 2009 - .btn-outline.btn-primary.btn-active { 2010 2010 - --tw-text-opacity: 1; 2011 2011 - color: var(--fallback-pc,oklch(var(--pc)/var(--tw-text-opacity))); 2012 1588 } 2013 1589 2014 1590 .btn-outline.btn-accent { ··· 2127 1703 border-radius: inherit; 2128 1704 } 2129 1705 2130 2130 - .checkbox:focus { 2131 2131 - box-shadow: none; 2132 2132 - } 2133 2133 - 2134 2134 - .checkbox:focus-visible { 2135 2135 - outline-style: solid; 2136 2136 - outline-width: 2px; 2137 2137 - outline-offset: 2px; 2138 2138 - outline-color: var(--fallback-bc,oklch(var(--bc)/1)); 2139 2139 - } 2140 2140 - 2141 2141 - .checkbox:checked, 2142 2142 - .checkbox[checked="true"], 2143 2143 - .checkbox[aria-checked="true"] { 2144 2144 - background-repeat: no-repeat; 2145 2145 - animation: checkmark var(--animation-input, 0.2s) ease-out; 2146 2146 - background-color: var(--chkbg); 2147 2147 - background-image: linear-gradient(-45deg, transparent 65%, var(--chkbg) 65.99%), 2148 2148 - linear-gradient(45deg, transparent 75%, var(--chkbg) 75.99%), 2149 2149 - linear-gradient(-45deg, var(--chkbg) 40%, transparent 40.99%), 2150 2150 - linear-gradient( 2151 2151 - 45deg, 2152 2152 - var(--chkbg) 30%, 2153 2153 - var(--chkfg) 30.99%, 2154 2154 - var(--chkfg) 40%, 2155 2155 - transparent 40.99% 2156 2156 - ), 2157 2157 - linear-gradient(-45deg, var(--chkfg) 50%, var(--chkbg) 50.99%); 2158 2158 - } 2159 2159 - 2160 2160 - .checkbox:indeterminate { 2161 2161 - --tw-bg-opacity: 1; 2162 2162 - background-color: var(--fallback-bc,oklch(var(--bc)/var(--tw-bg-opacity))); 2163 2163 - background-repeat: no-repeat; 2164 2164 - animation: checkmark var(--animation-input, 0.2s) ease-out; 2165 2165 - background-image: linear-gradient(90deg, transparent 80%, var(--chkbg) 80%), 2166 2166 - linear-gradient(-90deg, transparent 80%, var(--chkbg) 80%), 2167 2167 - linear-gradient(0deg, var(--chkbg) 43%, var(--chkfg) 43%, var(--chkfg) 57%, var(--chkbg) 57%); 2168 2168 - } 2169 2169 - 2170 2170 - .checkbox:disabled { 2171 2171 - cursor: not-allowed; 2172 2172 - border-color: transparent; 2173 2173 - --tw-bg-opacity: 1; 2174 2174 - background-color: var(--fallback-bc,oklch(var(--bc)/var(--tw-bg-opacity))); 2175 2175 - opacity: 0.2; 2176 2176 - } 2177 2177 - 2178 1706 @keyframes checkmark { 2179 1707 0% { 2180 1708 background-position-y: 5px; ··· 2191 1719 2192 1720 .divider:not(:empty) { 2193 1721 gap: 1rem; 2194 2194 - } 2195 2195 - 2196 2196 - .drawer-toggle:checked ~ .drawer-side > .drawer-overlay { 2197 2197 - background-color: #0006; 2198 2198 - } 2199 2199 - 2200 2200 - .drawer-toggle:focus-visible ~ .drawer-content label.drawer-button { 2201 2201 - outline-style: solid; 2202 2202 - outline-width: 2px; 2203 2203 - outline-offset: 2px; 2204 1722 } 2205 1723 2206 1724 .file-input-bordered { ··· 2250 1768 color: var(--fallback-bc,oklch(var(--bc)/var(--tw-text-opacity))); 2251 1769 } 2252 1770 2253 2253 - .label-text-alt { 2254 2254 - font-size: 0.75rem; 2255 2255 - line-height: 1rem; 2256 2256 - --tw-text-opacity: 1; 2257 2257 - color: var(--fallback-bc,oklch(var(--bc)/var(--tw-text-opacity))); 2258 2258 - } 2259 2259 - 2260 1771 .input input { 2261 1772 --tw-bg-opacity: 1; 2262 1773 background-color: var(--fallback-p,oklch(var(--p)/var(--tw-bg-opacity))); ··· 2345 1856 outline-offset: 2px; 2346 1857 } 2347 1858 2348 2348 - .mask-squircle { 2349 2349 - -webkit-mask-image: url("data:image/svg+xml,%3csvg width='200' height='200' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M100 0C20 0 0 20 0 100s20 100 100 100 100-20 100-100S180 0 100 0Z'/%3e%3c/svg%3e"); 2350 2350 - mask-image: url("data:image/svg+xml,%3csvg width='200' height='200' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M100 0C20 0 0 20 0 100s20 100 100 100 100-20 100-100S180 0 100 0Z'/%3e%3c/svg%3e"); 2351 2351 - } 2352 2352 - 2353 2353 - :where(.menu li:empty) { 2354 2354 - --tw-bg-opacity: 1; 2355 2355 - background-color: var(--fallback-bc,oklch(var(--bc)/var(--tw-bg-opacity))); 2356 2356 - opacity: 0.1; 2357 2357 - margin: 0.5rem 1rem; 2358 2358 - height: 1px; 2359 2359 - } 2360 2360 - 2361 2361 - .menu :where(li ul):before { 2362 2362 - position: absolute; 2363 2363 - bottom: 0.75rem; 2364 2364 - inset-inline-start: 0px; 2365 2365 - top: 0.75rem; 2366 2366 - width: 1px; 2367 2367 - --tw-bg-opacity: 1; 2368 2368 - background-color: var(--fallback-bc,oklch(var(--bc)/var(--tw-bg-opacity))); 2369 2369 - opacity: 0.1; 2370 2370 - content: ""; 2371 2371 - } 2372 2372 - 2373 2373 - .menu :where(li:not(.menu-title) > *:not(ul, details, .menu-title, .btn)), 2374 2374 - .menu :where(li:not(.menu-title) > details > summary:not(.menu-title)) { 2375 2375 - border-radius: var(--rounded-btn, 0.5rem); 2376 2376 - padding-left: 1rem; 2377 2377 - padding-right: 1rem; 2378 2378 - padding-top: 0.5rem; 2379 2379 - padding-bottom: 0.5rem; 2380 2380 - text-align: start; 2381 2381 - transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-backdrop-filter; 2382 2382 - transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter; 2383 2383 - transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-backdrop-filter; 2384 2384 - transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); 2385 2385 - transition-timing-function: cubic-bezier(0, 0, 0.2, 1); 2386 2386 - transition-duration: 200ms; 2387 2387 - text-wrap: balance; 2388 2388 - } 2389 2389 - 2390 2390 - :where(.menu li:not(.menu-title, .disabled) > *:not(ul, details, .menu-title)):not(summary, .active, .btn).focus, :where(.menu li:not(.menu-title, .disabled) > *:not(ul, details, .menu-title)):not(summary, .active, .btn):focus, :where(.menu li:not(.menu-title, .disabled) > *:not(ul, details, .menu-title)):is(summary):not(.active, .btn):focus-visible, :where(.menu li:not(.menu-title, .disabled) > details > summary:not(.menu-title)):not(summary, .active, .btn).focus, :where(.menu li:not(.menu-title, .disabled) > details > summary:not(.menu-title)):not(summary, .active, .btn):focus, :where(.menu li:not(.menu-title, .disabled) > details > summary:not(.menu-title)):is(summary):not(.active, .btn):focus-visible { 2391 2391 - cursor: pointer; 2392 2392 - background-color: var(--fallback-bc,oklch(var(--bc)/0.1)); 2393 2393 - --tw-text-opacity: 1; 2394 2394 - color: var(--fallback-bc,oklch(var(--bc)/var(--tw-text-opacity))); 2395 2395 - outline: 2px solid transparent; 2396 2396 - outline-offset: 2px; 2397 2397 - } 2398 2398 - 2399 2399 - .menu li > *:not(ul, .menu-title, details, .btn):active, 2400 2400 - .menu li > *:not(ul, .menu-title, details, .btn).active, 2401 2401 - .menu li > details > summary:active { 2402 2402 - --tw-bg-opacity: 1; 2403 2403 - background-color: var(--fallback-n,oklch(var(--n)/var(--tw-bg-opacity))); 2404 2404 - --tw-text-opacity: 1; 2405 2405 - color: var(--fallback-nc,oklch(var(--nc)/var(--tw-text-opacity))); 2406 2406 - } 2407 2407 - 2408 2408 - .menu :where(li > details > summary)::-webkit-details-marker { 2409 2409 - display: none; 2410 2410 - } 2411 2411 - 2412 2412 - .menu :where(li > details > summary):after, 2413 2413 - .menu :where(li > .menu-dropdown-toggle):after { 2414 2414 - justify-self: end; 2415 2415 - display: block; 2416 2416 - margin-top: -0.5rem; 2417 2417 - height: 0.5rem; 2418 2418 - width: 0.5rem; 2419 2419 - transform: rotate(45deg); 2420 2420 - transition-property: transform, margin-top; 2421 2421 - transition-duration: 0.3s; 2422 2422 - transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); 2423 2423 - content: ""; 2424 2424 - transform-origin: 75% 75%; 2425 2425 - box-shadow: 2px 2px; 2426 2426 - pointer-events: none; 2427 2427 - } 2428 2428 - 2429 2429 - .menu :where(li > details[open] > summary):after, 2430 2430 - .menu :where(li > .menu-dropdown-toggle.menu-dropdown-show):after { 2431 2431 - transform: rotate(225deg); 2432 2432 - margin-top: 0; 2433 2433 - } 2434 2434 - 2435 1859 .mockup-browser .mockup-browser-toolbar .input { 2436 1860 position: relative; 2437 1861 margin-left: auto; ··· 2534 1958 outline-color: var(--fallback-bc,oklch(var(--bc)/0.2)); 2535 1959 } 2536 1960 2537 2537 - .select-primary { 2538 2538 - --tw-border-opacity: 1; 2539 2539 - border-color: var(--fallback-p,oklch(var(--p)/var(--tw-border-opacity))); 2540 2540 - } 2541 2541 - 2542 2542 - .select-primary:focus { 2543 2543 - --tw-border-opacity: 1; 2544 2544 - border-color: var(--fallback-p,oklch(var(--p)/var(--tw-border-opacity))); 2545 2545 - outline-color: var(--fallback-p,oklch(var(--p)/1)); 2546 2546 - } 2547 2547 - 2548 2548 - .select-warning { 2549 2549 - --tw-border-opacity: 1; 2550 2550 - border-color: var(--fallback-wa,oklch(var(--wa)/var(--tw-border-opacity))); 2551 2551 - } 2552 2552 - 2553 2553 - .select-warning:focus { 2554 2554 - --tw-border-opacity: 1; 2555 2555 - border-color: var(--fallback-wa,oklch(var(--wa)/var(--tw-border-opacity))); 2556 2556 - outline-color: var(--fallback-wa,oklch(var(--wa)/1)); 2557 2557 - } 2558 2558 - 2559 2559 - .select-error { 2560 2560 - --tw-border-opacity: 1; 2561 2561 - border-color: var(--fallback-er,oklch(var(--er)/var(--tw-border-opacity))); 2562 2562 - } 2563 2563 - 2564 2564 - .select-error:focus { 2565 2565 - --tw-border-opacity: 1; 2566 2566 - border-color: var(--fallback-er,oklch(var(--er)/var(--tw-border-opacity))); 2567 2567 - outline-color: var(--fallback-er,oklch(var(--er)/1)); 2568 2568 - } 2569 2569 - 2570 1961 .select-disabled, 2571 1962 .select:disabled, 2572 1963 .select[disabled] { ··· 2708 2099 } 2709 2100 } 2710 2101 2711 2711 - [dir="rtl"] .toggle { 2712 2712 - --handleoffsetcalculator: calc(var(--handleoffset) * 1); 2713 2713 - } 2714 2714 - 2715 2715 - .toggle:focus-visible { 2716 2716 - outline-style: solid; 2717 2717 - outline-width: 2px; 2718 2718 - outline-offset: 2px; 2719 2719 - outline-color: var(--fallback-bc,oklch(var(--bc)/0.2)); 2720 2720 - } 2721 2721 - 2722 2722 - .toggle:hover { 2723 2723 - background-color: currentColor; 2724 2724 - } 2725 2725 - 2726 2726 - .toggle:checked, 2727 2727 - .toggle[checked="true"], 2728 2728 - .toggle[aria-checked="true"] { 2729 2729 - background-image: none; 2730 2730 - --handleoffsetcalculator: var(--handleoffset); 2731 2731 - --tw-text-opacity: 1; 2732 2732 - color: var(--fallback-bc,oklch(var(--bc)/var(--tw-text-opacity))); 2733 2733 - } 2734 2734 - 2735 2735 - [dir="rtl"] .toggle:checked, [dir="rtl"] .toggle[checked="true"], [dir="rtl"] .toggle[aria-checked="true"] { 2736 2736 - --handleoffsetcalculator: calc(var(--handleoffset) * -1); 2737 2737 - } 2738 2738 - 2739 2739 - .toggle:indeterminate { 2740 2740 - --tw-text-opacity: 1; 2741 2741 - color: var(--fallback-bc,oklch(var(--bc)/var(--tw-text-opacity))); 2742 2742 - box-shadow: calc(var(--handleoffset) / 2) 0 0 2px var(--tglbg) inset, 2743 2743 - calc(var(--handleoffset) / -2) 0 0 2px var(--tglbg) inset, 2744 2744 - 0 0 0 2px var(--tglbg) inset; 2745 2745 - } 2746 2746 - 2747 2747 - [dir="rtl"] .toggle:indeterminate { 2748 2748 - box-shadow: calc(var(--handleoffset) / 2) 0 0 2px var(--tglbg) inset, 2749 2749 - calc(var(--handleoffset) / -2) 0 0 2px var(--tglbg) inset, 2750 2750 - 0 0 0 2px var(--tglbg) inset; 2751 2751 - } 2752 2752 - 2753 2753 - .toggle-accent:focus-visible { 2754 2754 - outline-color: var(--fallback-a,oklch(var(--a)/1)); 2755 2755 - } 2756 2756 - 2757 2757 - .toggle-accent:checked, 2758 2758 - .toggle-accent[checked="true"], 2759 2759 - .toggle-accent[aria-checked="true"] { 2760 2760 - border-color: var(--fallback-a,oklch(var(--a)/var(--tw-border-opacity))); 2761 2761 - --tw-border-opacity: 0.1; 2762 2762 - --tw-bg-opacity: 1; 2763 2763 - background-color: var(--fallback-a,oklch(var(--a)/var(--tw-bg-opacity))); 2764 2764 - --tw-text-opacity: 1; 2765 2765 - color: var(--fallback-ac,oklch(var(--ac)/var(--tw-text-opacity))); 2766 2766 - } 2767 2767 - 2768 2768 - .toggle-error:focus-visible { 2769 2769 - outline-color: var(--fallback-er,oklch(var(--er)/1)); 2770 2770 - } 2771 2771 - 2772 2772 - .toggle-error:checked, 2773 2773 - .toggle-error[checked="true"], 2774 2774 - .toggle-error[aria-checked="true"] { 2775 2775 - border-color: var(--fallback-er,oklch(var(--er)/var(--tw-border-opacity))); 2776 2776 - --tw-border-opacity: 0.1; 2777 2777 - --tw-bg-opacity: 1; 2778 2778 - background-color: var(--fallback-er,oklch(var(--er)/var(--tw-bg-opacity))); 2779 2779 - --tw-text-opacity: 1; 2780 2780 - color: var(--fallback-erc,oklch(var(--erc)/var(--tw-text-opacity))); 2781 2781 - } 2782 2782 - 2783 2783 - .toggle:disabled { 2784 2784 - cursor: not-allowed; 2785 2785 - --tw-border-opacity: 1; 2786 2786 - border-color: var(--fallback-bc,oklch(var(--bc)/var(--tw-border-opacity))); 2787 2787 - background-color: transparent; 2788 2788 - opacity: 0.3; 2789 2789 - --togglehandleborder: 0 0 0 3px var(--fallback-bc,oklch(var(--bc)/1)) inset, 2790 2790 - var(--handleoffsetcalculator) 0 0 3px var(--fallback-bc,oklch(var(--bc)/1)) inset; 2791 2791 - } 2792 2792 - 2793 2102 .badge-sm { 2794 2103 height: 1rem; 2795 2104 font-size: 0.75rem; ··· 2814 2123 font-size: 0.875rem; 2815 2124 } 2816 2125 2817 2817 - .btn-lg { 2818 2818 - height: 4rem; 2819 2819 - min-height: 4rem; 2820 2820 - padding-left: 1.5rem; 2821 2821 - padding-right: 1.5rem; 2822 2822 - font-size: 1.125rem; 2823 2823 - } 2824 2824 - 2825 2825 - .btn-block { 2826 2826 - width: 100%; 2827 2827 - } 2828 2828 - 2829 2126 .btn-square:where(.btn-xs) { 2830 2127 height: 1.5rem; 2831 2128 width: 1.5rem; ··· 2864 2161 padding: 0px; 2865 2162 } 2866 2163 2867 2867 - .btn-circle:where(.btn-lg) { 2868 2868 - height: 4rem; 2869 2869 - width: 4rem; 2870 2870 - border-radius: 9999px; 2871 2871 - padding: 0px; 2872 2872 - } 2873 2873 - 2874 2874 - .drawer-open > .drawer-toggle { 2875 2875 - display: none; 2876 2876 - } 2877 2877 - 2878 2878 - .drawer-open > .drawer-toggle ~ .drawer-side { 2879 2879 - pointer-events: auto; 2880 2880 - visibility: visible; 2881 2881 - position: sticky; 2882 2882 - display: block; 2883 2883 - width: auto; 2884 2884 - overscroll-behavior: auto; 2885 2885 - } 2886 2886 - 2887 2887 - .drawer-open > .drawer-toggle ~ .drawer-side > *:not(.drawer-overlay) { 2888 2888 - transform: translateX(0%); 2889 2889 - } 2890 2890 - 2891 2891 - [dir="rtl"] .drawer-open > .drawer-toggle ~ .drawer-side > *:not(.drawer-overlay) { 2892 2892 - transform: translateX(0%); 2893 2893 - } 2894 2894 - 2895 2895 - .drawer-open > .drawer-toggle:checked ~ .drawer-side { 2896 2896 - pointer-events: auto; 2897 2897 - visibility: visible; 2898 2898 - } 2899 2899 - 2900 2900 - .drawer-open > .drawer-side { 2901 2901 - overflow-y: auto; 2902 2902 - } 2903 2903 - 2904 2904 - html:has(.drawer-toggle:checked) { 2905 2905 - overflow-y: hidden; 2906 2906 - scrollbar-gutter: stable; 2907 2907 - } 2908 2908 - 2909 2164 .join.join-vertical { 2910 2165 flex-direction: column; 2911 2166 } ··· 2994 2249 right: 7%; 2995 2250 } 2996 2251 2997 2997 - .drawer-open > .drawer-toggle ~ .drawer-side > .drawer-overlay { 2998 2998 - cursor: default; 2999 2999 - background-color: transparent; 3000 3000 - } 3001 3001 - 3002 2252 .join.join-vertical > :where(*:not(:first-child)) { 3003 2253 margin-left: 0px; 3004 2254 margin-right: 0px; ··· 3021 2271 3022 2272 .order-first { 3023 2273 order: -9999; 3024 3024 - } 3025 3025 - 3026 3026 - .m-10 { 3027 3027 - margin: 2.5rem; 3028 2274 } 3029 2275 3030 2276 .mx-auto { ··· 3037 2283 margin-bottom: 1rem; 3038 2284 } 3039 2285 2286 2286 + .mb-1 { 2287 2287 + margin-bottom: 0.25rem; 2288 2288 + } 2289 2289 + 3040 2290 .mb-10 { 3041 2291 margin-bottom: 2.5rem; 3042 2292 } 3043 2293 3044 3044 - .mb-6 { 3045 3045 - margin-bottom: 1.5rem; 2294 2294 + .mb-2 { 2295 2295 + margin-bottom: 0.5rem; 3046 2296 } 3047 2297 3048 2298 .mb-4 { 3049 2299 margin-bottom: 1rem; 3050 2300 } 3051 2301 3052 3052 - .mr-10 { 3053 3053 - margin-right: 2.5rem; 3054 3054 - } 3055 3055 - 3056 3056 - .mr-2 { 3057 3057 - margin-right: 0.5rem; 3058 3058 - } 3059 3059 - 3060 3060 - .mt-4 { 3061 3061 - margin-top: 1rem; 3062 3062 - } 3063 3063 - 3064 3064 - .mr-4 { 3065 3065 - margin-right: 1rem; 3066 3066 - } 3067 3067 - 3068 3068 - .ml-4 { 3069 3069 - margin-left: 1rem; 2302 2302 + .mb-6 { 2303 2303 + margin-bottom: 1.5rem; 3070 2304 } 3071 2305 3072 2306 .ml-2 { 3073 2307 margin-left: 0.5rem; 3074 2308 } 3075 2309 3076 3076 - .mb-2 { 3077 3077 - margin-bottom: 0.5rem; 3078 3078 - } 3079 3079 - 3080 3080 - .mb-1 { 3081 3081 - margin-bottom: 0.25rem; 3082 3082 - } 3083 3083 - 3084 3084 - .-ml-2 { 3085 3085 - margin-left: -0.5rem; 3086 3086 - } 3087 3087 - 3088 3088 - .ml-64 { 3089 3089 - margin-left: 16rem; 2310 2310 + .ml-20 { 2311 2311 + margin-left: 5rem; 3090 2312 } 3091 2313 3092 3092 - .ml-72 { 3093 3093 - margin-left: 18rem; 2314 2314 + .ml-4 { 2315 2315 + margin-left: 1rem; 3094 2316 } 3095 2317 3096 2318 .mr-1 { 3097 2319 margin-right: 0.25rem; 3098 2320 } 3099 2321 3100 3100 - .ml-36 { 3101 3101 - margin-left: 9rem; 2322 2322 + .mr-2 { 2323 2323 + margin-right: 0.5rem; 2324 2324 + } 2325 2325 + 2326 2326 + .mr-4 { 2327 2327 + margin-right: 1rem; 3102 2328 } 3103 2329 3104 3104 - .ml-20 { 3105 3105 - margin-left: 5rem; 2330 2330 + .mt-4 { 2331 2331 + margin-top: 1rem; 3106 2332 } 3107 2333 3108 2334 .mt-8 { ··· 3125 2351 display: table; 3126 2352 } 3127 2353 3128 3128 - .grid { 3129 3129 - display: grid; 3130 3130 - } 3131 3131 - 3132 2354 .hidden { 3133 2355 display: none; 3134 2356 } 3135 2357 3136 3136 - .h-20 { 3137 3137 - height: 5rem; 3138 3138 - } 3139 3139 - 3140 2358 .h-10 { 3141 2359 height: 2.5rem; 3142 2360 } 3143 2361 3144 3144 - .h-6 { 3145 3145 - height: 1.5rem; 3146 3146 - } 3147 3147 - 3148 3148 - .h-full { 3149 3149 - height: 100%; 3150 3150 - } 3151 3151 - 3152 3152 - .h-screen { 3153 3153 - height: 100vh; 3154 3154 - } 3155 3155 - 3156 3156 - .h-24 { 3157 3157 - height: 6rem; 2362 2362 + .h-12 { 2363 2363 + height: 3rem; 3158 2364 } 3159 2365 3160 2366 .h-32 { 3161 2367 height: 8rem; 3162 2368 } 3163 2369 3164 3164 - .h-8 { 3165 3165 - height: 2rem; 2370 2370 + .h-4 { 2371 2371 + height: 1rem; 3166 2372 } 3167 2373 3168 3168 - .h-12 { 3169 3169 - height: 3rem; 2374 2374 + .h-5 { 2375 2375 + height: 1.25rem; 3170 2376 } 3171 2377 3172 3172 - .h-16 { 3173 3173 - height: 4rem; 2378 2378 + .h-6 { 2379 2379 + height: 1.5rem; 3174 2380 } 3175 2381 3176 2382 .h-7 { 3177 2383 height: 1.75rem; 3178 2384 } 3179 2385 3180 3180 - .h-4 { 3181 3181 - height: 1rem; 3182 3182 - } 3183 3183 - 3184 3184 - .h-5 { 3185 3185 - height: 1.25rem; 3186 3186 - } 3187 3187 - 3188 3188 - .min-h-full { 3189 3189 - min-height: 100%; 2386 2386 + .h-full { 2387 2387 + height: 100%; 3190 2388 } 3191 2389 3192 2390 .min-h-screen { 3193 2391 min-height: 100vh; 3194 2392 } 3195 2393 3196 3196 - .w-full { 3197 3197 - width: 100%; 3198 3198 - } 3199 3199 - 3200 2394 .w-10 { 3201 2395 width: 2.5rem; 3202 2396 } 3203 2397 3204 3204 - .w-6 { 3205 3205 - width: 1.5rem; 3206 3206 - } 3207 3207 - 3208 3208 - .w-80 { 3209 3209 - width: 20rem; 3210 3210 - } 3211 3211 - 3212 3212 - .w-56 { 3213 3213 - width: 14rem; 3214 3214 - } 3215 3215 - 3216 3216 - .w-64 { 3217 3217 - width: 16rem; 3218 3218 - } 3219 3219 - 3220 3220 - .w-72 { 3221 3221 - width: 18rem; 3222 3222 - } 3223 3223 - 3224 3224 - .w-52 { 3225 3225 - width: 13rem; 3226 3226 - } 3227 3227 - 3228 3228 - .w-8 { 3229 3229 - width: 2rem; 3230 3230 - } 3231 3231 - 3232 2398 .w-12 { 3233 2399 width: 3rem; 3234 2400 } 3235 2401 3236 3236 - .w-32 { 3237 3237 - width: 8rem; 2402 2402 + .w-20 { 2403 2403 + width: 5rem; 3238 2404 } 3239 2405 3240 3240 - .w-24 { 3241 3241 - width: 6rem; 2406 2406 + .w-4 { 2407 2407 + width: 1rem; 3242 2408 } 3243 2409 3244 2410 .w-48 { 3245 2411 width: 12rem; 3246 2412 } 3247 2413 3248 3248 - .w-96 { 3249 3249 - width: 24rem; 3250 3250 - } 3251 3251 - 3252 3252 - .w-16 { 3253 3253 - width: 4rem; 2414 2414 + .w-5 { 2415 2415 + width: 1.25rem; 3254 2416 } 3255 2417 3256 3256 - .w-4 { 3257 3257 - width: 1rem; 2418 2418 + .w-52 { 2419 2419 + width: 13rem; 3258 2420 } 3259 2421 3260 3260 - .w-36 { 3261 3261 - width: 9rem; 3262 3262 - } 3263 3263 - 3264 3264 - .w-20 { 3265 3265 - width: 5rem; 2422 2422 + .w-6 { 2423 2423 + width: 1.5rem; 3266 2424 } 3267 2425 3268 2426 .w-7 { 3269 2427 width: 1.75rem; 3270 2428 } 3271 2429 3272 3272 - .w-5 { 3273 3273 - width: 1.25rem; 3274 3274 - } 3275 3275 - 3276 3276 - .max-w-3xl { 3277 3277 - max-width: 48rem; 2430 2430 + .w-full { 2431 2431 + width: 100%; 3278 2432 } 3279 2433 3280 2434 .max-w-4xl { ··· 3285 2439 max-width: 36rem; 3286 2440 } 3287 2441 3288 3288 - .max-w-lg { 3289 3289 - max-width: 32rem; 3290 3290 - } 3291 3291 - 3292 3292 - .max-w-md { 3293 3293 - max-width: 28rem; 3294 3294 - } 3295 3295 - 3296 3296 - .max-w-2xl { 3297 3297 - max-width: 42rem; 3298 3298 - } 3299 3299 - 3300 2442 .max-w-xs { 3301 2443 max-width: 20rem; 3302 3302 - } 3303 3303 - 3304 3304 - .max-w-80 { 3305 3305 - max-width: 20rem; 3306 3306 - } 3307 3307 - 3308 3308 - .max-w-sm { 3309 3309 - max-width: 24rem; 3310 2444 } 3311 2445 3312 2446 .flex-none { ··· 3333 2467 flex-direction: column; 3334 2468 } 3335 2469 3336 3336 - .place-items-center { 3337 3337 - place-items: center; 3338 3338 - } 3339 3339 - 3340 3340 - .items-start { 3341 3341 - align-items: flex-start; 3342 3342 - } 3343 3343 - 3344 3344 - .items-end { 3345 3345 - align-items: flex-end; 3346 3346 - } 3347 3347 - 3348 2470 .items-center { 3349 2471 align-items: center; 3350 2472 } ··· 3361 2483 justify-content: center; 3362 2484 } 3363 2485 3364 3364 - .gap-3 { 3365 3365 - gap: 0.75rem; 3366 3366 - } 3367 3367 - 3368 2486 .gap-2 { 3369 2487 gap: 0.5rem; 3370 2488 } ··· 3373 2491 align-self: flex-end; 3374 2492 } 3375 2493 3376 3376 - .overflow-hidden { 3377 3377 - overflow: hidden; 3378 3378 - } 3379 3379 - 3380 2494 .overflow-y-auto { 3381 2495 overflow-y: auto; 3382 2496 } ··· 3385 2499 white-space: pre-line; 3386 2500 } 3387 2501 2502 2502 + .rounded { 2503 2503 + border-radius: 0.25rem; 2504 2504 + } 2505 2505 + 3388 2506 .rounded-box { 3389 2507 border-radius: var(--rounded-box, 1rem); 3390 2508 } 3391 2509 3392 3392 - .rounded { 3393 3393 - border-radius: 0.25rem; 3394 3394 - } 3395 3395 - 3396 2510 .rounded-full { 3397 2511 border-radius: 9999px; 3398 3398 - } 3399 3399 - 3400 3400 - .border { 3401 3401 - border-width: 1px; 3402 2512 } 3403 2513 3404 2514 .border-l-2 { ··· 3410 2520 border-color: var(--fallback-b3,oklch(var(--b3)/var(--tw-border-opacity))); 3411 2521 } 3412 2522 3413 3413 - .border-neutral { 3414 3414 - --tw-border-opacity: 1; 3415 3415 - border-color: var(--fallback-n,oklch(var(--n)/var(--tw-border-opacity))); 3416 3416 - } 3417 3417 - 3418 3418 - .bg-base-300 { 3419 3419 - --tw-bg-opacity: 1; 3420 3420 - background-color: var(--fallback-b3,oklch(var(--b3)/var(--tw-bg-opacity))); 3421 3421 - } 3422 3422 - 3423 2523 .bg-base-200 { 3424 2524 --tw-bg-opacity: 1; 3425 2525 background-color: var(--fallback-b2,oklch(var(--b2)/var(--tw-bg-opacity))); 3426 2526 } 3427 2527 3428 3428 - .bg-black { 2528 2528 + .bg-base-300 { 3429 2529 --tw-bg-opacity: 1; 3430 3430 - background-color: rgb(0 0 0 / var(--tw-bg-opacity)); 2530 2530 + background-color: var(--fallback-b3,oklch(var(--b3)/var(--tw-bg-opacity))); 3431 2531 } 3432 2532 3433 2533 .bg-neutral { ··· 3435 2535 background-color: var(--fallback-n,oklch(var(--n)/var(--tw-bg-opacity))); 3436 2536 } 3437 2537 3438 3438 - .bg-blue-500 { 3439 3439 - --tw-bg-opacity: 1; 3440 3440 - background-color: rgb(59 130 246 / var(--tw-bg-opacity)); 3441 3441 - } 3442 3442 - 3443 3443 - .bg-base-100 { 3444 3444 - --tw-bg-opacity: 1; 3445 3445 - background-color: var(--fallback-b1,oklch(var(--b1)/var(--tw-bg-opacity))); 3446 3446 - } 3447 3447 - 3448 2538 .stroke-current { 3449 2539 stroke: currentColor; 3450 2540 } 3451 2541 3452 3452 - .p-10 { 3453 3453 - padding: 2.5rem; 3454 3454 - } 3455 3455 - 3456 3456 - .p-4 { 3457 3457 - padding: 1rem; 3458 3458 - } 3459 3459 - 3460 3460 - .p-6 { 3461 3461 - padding: 1.5rem; 2542 2542 + .p-1 { 2543 2543 + padding: 0.25rem; 3462 2544 } 3463 2545 3464 3464 - .p-8 { 3465 3465 - padding: 2rem; 2546 2546 + .p-10 { 2547 2547 + padding: 2.5rem; 3466 2548 } 3467 2549 3468 2550 .p-2 { 3469 2551 padding: 0.5rem; 3470 2552 } 3471 2553 3472 3472 - .p-1 { 3473 3473 - padding: 0.25rem; 2554 2554 + .p-4 { 2555 2555 + padding: 1rem; 3474 2556 } 3475 2557 3476 3476 - .px-4 { 3477 3477 - padding-left: 1rem; 3478 3478 - padding-right: 1rem; 2558 2558 + .p-8 { 2559 2559 + padding: 2rem; 3479 2560 } 3480 2561 3481 2562 .py-2 { ··· 3483 2564 padding-bottom: 0.5rem; 3484 2565 } 3485 2566 3486 3486 - .text-left { 3487 3487 - text-align: left; 3488 3488 - } 3489 3489 - 3490 2567 .text-center { 3491 2568 text-align: center; 3492 2569 } 3493 2570 3494 3494 - .align-middle { 3495 3495 - vertical-align: middle; 3496 3496 - } 3497 3497 - 3498 2571 .font-mono { 3499 2572 font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; 3500 2573 } 3501 2574 3502 3502 - .text-sm { 3503 3503 - font-size: 0.875rem; 3504 3504 - line-height: 1.25rem; 3505 3505 - } 3506 3506 - 3507 2575 .text-2xl { 3508 2576 font-size: 1.5rem; 3509 2577 line-height: 2rem; 3510 2578 } 3511 2579 3512 3512 - .text-xl { 3513 3513 - font-size: 1.25rem; 3514 3514 - line-height: 1.75rem; 2580 2580 + .text-3xl { 2581 2581 + font-size: 1.875rem; 2582 2582 + line-height: 2.25rem; 3515 2583 } 3516 2584 3517 3517 - .text-xs { 3518 3518 - font-size: 0.75rem; 3519 3519 - line-height: 1rem; 2585 2585 + .text-4xl { 2586 2586 + font-size: 2.25rem; 2587 2587 + line-height: 2.5rem; 3520 2588 } 3521 2589 3522 2590 .text-base { ··· 3524 2592 line-height: 1.5rem; 3525 2593 } 3526 2594 3527 3527 - .text-3xl { 3528 3528 - font-size: 1.875rem; 3529 3529 - line-height: 2.25rem; 2595 2595 + .text-sm { 2596 2596 + font-size: 0.875rem; 2597 2597 + line-height: 1.25rem; 3530 2598 } 3531 2599 3532 3532 - .text-4xl { 3533 3533 - font-size: 2.25rem; 3534 3534 - line-height: 2.5rem; 2600 2600 + .text-xl { 2601 2601 + font-size: 1.25rem; 2602 2602 + line-height: 1.75rem; 2603 2603 + } 2604 2604 + 2605 2605 + .text-xs { 2606 2606 + font-size: 0.75rem; 2607 2607 + line-height: 1rem; 3535 2608 } 3536 2609 3537 2610 .font-bold { ··· 3542 2615 font-weight: 600; 3543 2616 } 3544 2617 3545 3545 - .capitalize { 3546 3546 - text-transform: capitalize; 3547 3547 - } 3548 3548 - 3549 2618 .italic { 3550 2619 font-style: italic; 3551 2620 } 3552 2621 3553 3553 - .text-base-100 { 2622 2622 + .text-accent { 3554 2623 --tw-text-opacity: 1; 3555 3555 - color: var(--fallback-b1,oklch(var(--b1)/var(--tw-text-opacity))); 2624 2624 + color: var(--fallback-a,oklch(var(--a)/var(--tw-text-opacity))); 3556 2625 } 3557 2626 3558 3558 - .text-base-300 { 2627 2627 + .text-base-content { 3559 2628 --tw-text-opacity: 1; 3560 3560 - color: var(--fallback-b3,oklch(var(--b3)/var(--tw-text-opacity))); 2629 2629 + color: var(--fallback-bc,oklch(var(--bc)/var(--tw-text-opacity))); 3561 2630 } 3562 2631 3563 3563 - .text-neutral { 2632 2632 + .text-error { 3564 2633 --tw-text-opacity: 1; 3565 3565 - color: var(--fallback-n,oklch(var(--n)/var(--tw-text-opacity))); 2634 2634 + color: var(--fallback-er,oklch(var(--er)/var(--tw-text-opacity))); 3566 2635 } 3567 2636 3568 3568 - .text-base-content { 2637 2637 + .text-neutral { 3569 2638 --tw-text-opacity: 1; 3570 3570 - color: var(--fallback-bc,oklch(var(--bc)/var(--tw-text-opacity))); 3571 3571 - } 3572 3572 - 3573 3573 - .text-blue-500 { 3574 3574 - --tw-text-opacity: 1; 3575 3575 - color: rgb(59 130 246 / var(--tw-text-opacity)); 2639 2639 + color: var(--fallback-n,oklch(var(--n)/var(--tw-text-opacity))); 3576 2640 } 3577 2641 3578 2642 .text-neutral-content { ··· 3580 2644 color: var(--fallback-nc,oklch(var(--nc)/var(--tw-text-opacity))); 3581 2645 } 3582 2646 3583 3583 - .text-white { 3584 3584 - --tw-text-opacity: 1; 3585 3585 - color: rgb(255 255 255 / var(--tw-text-opacity)); 3586 3586 - } 3587 3587 - 3588 3588 - .text-secondary { 3589 3589 - --tw-text-opacity: 1; 3590 3590 - color: var(--fallback-s,oklch(var(--s)/var(--tw-text-opacity))); 3591 3591 - } 3592 3592 - 3593 3593 - .text-accent { 3594 3594 - --tw-text-opacity: 1; 3595 3595 - color: var(--fallback-a,oklch(var(--a)/var(--tw-text-opacity))); 3596 3596 - } 3597 3597 - 3598 2647 .text-success { 3599 2648 --tw-text-opacity: 1; 3600 2649 color: var(--fallback-su,oklch(var(--su)/var(--tw-text-opacity))); 3601 2650 } 3602 2651 3603 3603 - .text-error { 3604 3604 - --tw-text-opacity: 1; 3605 3605 - color: var(--fallback-er,oklch(var(--er)/var(--tw-text-opacity))); 3606 3606 - } 3607 3607 - 3608 2652 .text-warning { 3609 2653 --tw-text-opacity: 1; 3610 2654 color: var(--fallback-wa,oklch(var(--wa)/var(--tw-text-opacity))); ··· 3622 2666 opacity: 0.7; 3623 2667 } 3624 2668 3625 3625 - .shadow { 3626 3626 - --tw-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1); 3627 3627 - --tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color); 3628 3628 - box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow); 3629 3629 - } 3630 3630 - 3631 3631 - .ring { 3632 3632 - --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color); 3633 3633 - --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(3px + var(--tw-ring-offset-width)) var(--tw-ring-color); 3634 3634 - box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000); 3635 3635 - } 3636 3636 - 3637 3637 - .ring-primary { 3638 3638 - --tw-ring-opacity: 1; 3639 3639 - --tw-ring-color: var(--fallback-p,oklch(var(--p)/var(--tw-ring-opacity))); 3640 3640 - } 3641 3641 - 3642 3642 - .ring-warning { 3643 3643 - --tw-ring-opacity: 1; 3644 3644 - --tw-ring-color: var(--fallback-wa,oklch(var(--wa)/var(--tw-ring-opacity))); 3645 3645 - } 3646 3646 - 3647 3647 - .ring-neutral { 3648 3648 - --tw-ring-opacity: 1; 3649 3649 - --tw-ring-color: var(--fallback-n,oklch(var(--n)/var(--tw-ring-opacity))); 3650 3650 - } 3651 3651 - 3652 3652 - .ring-offset-2 { 3653 3653 - --tw-ring-offset-width: 2px; 3654 3654 - } 3655 3655 - 3656 3656 - .ring-offset-base-100 { 3657 3657 - --tw-ring-offset-color: var(--fallback-b1,oklch(var(--b1)/1)); 3658 3658 - } 3659 3659 - 3660 3660 - .ring-offset-neutral { 3661 3661 - --tw-ring-offset-color: var(--fallback-n,oklch(var(--n)/1)); 3662 3662 - } 3663 3663 - 3664 2669 @media (min-width: 1024px) { 3665 2670 .lg\:btn-sm { 3666 2671 height: 2rem; ··· 3676 2681 padding-left: 1.5rem; 3677 2682 padding-right: 1.5rem; 3678 2683 font-size: 1.125rem; 3679 3679 - } 3680 3680 - 3681 3681 - .lg\:btn-block { 3682 3682 - width: 100%; 3683 2684 } 3684 2685 3685 2686 .btn-square:where(.lg\:btn-sm) { ··· 3708 2709 padding: 0px; 3709 2710 } 3710 2711 3711 3711 - .lg\:drawer-open > .drawer-toggle { 3712 3712 - display: none; 3713 3713 - } 3714 3714 - 3715 3715 - .lg\:drawer-open > .drawer-toggle ~ .drawer-side { 3716 3716 - pointer-events: auto; 3717 3717 - visibility: visible; 3718 3718 - position: sticky; 3719 3719 - display: block; 3720 3720 - width: auto; 3721 3721 - overscroll-behavior: auto; 3722 3722 - } 3723 3723 - 3724 3724 - .lg\:drawer-open > .drawer-toggle ~ .drawer-side > *:not(.drawer-overlay) { 3725 3725 - transform: translateX(0%); 3726 3726 - } 3727 3727 - 3728 3728 - [dir="rtl"] .lg\:drawer-open > .drawer-toggle ~ .drawer-side > *:not(.drawer-overlay) { 3729 3729 - transform: translateX(0%); 3730 3730 - } 3731 3731 - 3732 3732 - .lg\:drawer-open > .drawer-toggle:checked ~ .drawer-side { 3733 3733 - pointer-events: auto; 3734 3734 - visibility: visible; 3735 3735 - } 3736 3736 - 3737 3737 - .lg\:drawer-open > .drawer-side { 3738 3738 - overflow-y: auto; 3739 3739 - } 3740 3740 - 3741 3741 - html:has(.lg\:drawer-open.lg\:drawer-open) { 3742 3742 - overflow-y: auto; 3743 3743 - scrollbar-gutter: auto; 3744 3744 - } 3745 3745 - 3746 3746 - .lg\:drawer-open > .drawer-toggle ~ .drawer-side > .drawer-overlay { 3747 3747 - cursor: default; 3748 3748 - background-color: transparent; 3749 3749 - } 3750 3750 - } 3751 3751 - 3752 3752 - .hover\:bg-blue-700:hover { 3753 3753 - --tw-bg-opacity: 1; 3754 3754 - background-color: rgb(29 78 216 / var(--tw-bg-opacity)); 3755 3755 - } 3756 3756 - 3757 3757 - @media (min-width: 640px) { 3758 3758 - .sm\:max-w-md { 3759 3759 - max-width: 28rem; 3760 3760 - } 3761 3761 - 3762 3762 - .sm\:flex-row { 3763 3763 - flex-direction: row; 3764 3764 - } 3765 3765 - } 3766 3766 - 3767 3767 - @media (min-width: 768px) { 3768 3768 - .md\:max-w-md { 3769 3769 - max-width: 28rem; 3770 3770 - } 3771 3771 - 3772 3772 - .md\:flex-row { 3773 3773 - flex-direction: row; 3774 3774 - } 3775 3775 - } 3776 3776 - 3777 3777 - @media (min-width: 1024px) { 3778 2712 .lg\:order-none { 3779 2713 order: 0; 3780 2714 } ··· 3791 2725 display: flex; 3792 2726 } 3793 2727 3794 3794 - .lg\:hidden { 3795 3795 - display: none; 3796 3796 - } 3797 3797 - 3798 3798 - .lg\:h-7 { 3799 3799 - height: 1.75rem; 3800 3800 - } 3801 3801 - 3802 2728 .lg\:w-72 { 3803 2729 width: 18rem; 3804 2730 } ··· 3807 2733 width: 100%; 3808 2734 } 3809 2735 3810 3810 - .lg\:w-7 { 3811 3811 - width: 1.75rem; 3812 3812 - } 3813 3813 - 3814 2736 .lg\:max-w-md { 3815 2737 max-width: 28rem; 3816 2738 } ··· 3823 2745 justify-content: flex-start; 3824 2746 } 3825 2747 3826 3826 - .lg\:p-4 { 3827 3827 - padding: 1rem; 3828 3828 - } 3829 3829 - 3830 2748 .lg\:p-2 { 3831 2749 padding: 0.5rem; 3832 2750 } 3833 2751 3834 3834 - .lg\:p-1 { 3835 3835 - padding: 0.25rem; 3836 3836 - } 3837 3837 - 3838 3838 - .lg\:p-3 { 3839 3839 - padding: 0.75rem; 2752 2752 + .lg\:p-4 { 2753 2753 + padding: 1rem; 3840 2754 } 3841 2755 3842 2756 .lg\:px-3 {