diff --git a/assets/css/theme.css b/assets/css/theme.css index 9168aad..fbc41bf 100755 --- a/assets/css/theme.css +++ b/assets/css/theme.css @@ -847,6 +847,10 @@ select { grid-column: span 1 / span 1; } +.col-span-3 { + grid-column: span 3 / span 3; +} + .col-start-1 { grid-column-start: 1; } @@ -871,10 +875,18 @@ select { grid-row-start: 1; } +.row-start-2 { + grid-row-start: 2; +} + .row-end-2 { grid-row-end: 2; } +.row-end-3 { + grid-row-end: 3; +} + .-mx-2 { margin-left: -0.5rem; margin-right: -0.5rem; @@ -890,6 +902,11 @@ select { margin-bottom: -0.75rem; } +.mx-1 { + margin-left: 0.25rem; + margin-right: 0.25rem; +} + .mx-3 { margin-left: 0.75rem; margin-right: 0.75rem; @@ -915,21 +932,26 @@ select { margin-bottom: 0.125rem; } +.my-12 { + margin-top: 3rem; + margin-bottom: 3rem; +} + .my-2 { margin-top: 0.5rem; margin-bottom: 0.5rem; } +.my-20 { + margin-top: 5rem; + margin-bottom: 5rem; +} + .my-8 { margin-top: 2rem; margin-bottom: 2rem; } -.my-32 { - margin-top: 8rem; - margin-bottom: 8rem; -} - .mb-1 { margin-bottom: 0.25rem; } @@ -938,10 +960,6 @@ select { margin-bottom: 3rem; } -.mb-16 { - margin-bottom: 4rem; -} - .mb-2 { margin-bottom: 0.5rem; } @@ -1014,10 +1032,18 @@ select { margin-top: 0.75rem; } +.mt-32 { + margin-top: 8rem; +} + .mt-4 { margin-top: 1rem; } +.mt-48 { + margin-top: 12rem; +} + .mt-6 { margin-top: 1.5rem; } @@ -1026,6 +1052,10 @@ select { margin-top: 2rem; } +.mt-9 { + margin-top: 2.25rem; +} + .block { display: block; } @@ -1058,6 +1088,10 @@ select { aspect-ratio: 342/513; } +.h-1\/2 { + height: 50%; +} + .h-12 { height: 3rem; } @@ -1078,16 +1112,28 @@ select { height: 1.5rem; } +.h-72 { + height: 18rem; +} + .h-8 { height: 2rem; } -.h-\[350px\] { - height: 350px; +.h-\[100px\] { + height: 100px; } -.h-\[380px\] { - height: 380px; +.h-\[20px\] { + height: 20px; +} + +.h-\[50px\] { + height: 50px; +} + +.h-\[50vh\] { + height: 50vh; } .h-auto { @@ -1162,6 +1208,14 @@ select { width: 160px; } +.w-\[20px\] { + width: 20px; +} + +.w-\[50px\] { + width: 50px; +} + .w-full { width: 100%; } @@ -1238,10 +1292,22 @@ select { list-style-type: square; } +.grid-flow-col { + grid-auto-flow: column; +} + .grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); } +.grid-cols-3 { + grid-template-columns: repeat(3, minmax(0, 1fr)); +} + +.grid-rows-3 { + grid-template-rows: repeat(3, minmax(0, 1fr)); +} + .flex-row { flex-direction: row; } @@ -1274,6 +1340,10 @@ select { align-items: baseline; } +.justify-start { + justify-content: flex-start; +} + .justify-end { justify-content: flex-end; } @@ -1327,16 +1397,31 @@ select { column-gap: 0.25rem; } +.gap-x-2 { + -moz-column-gap: 0.5rem; + column-gap: 0.5rem; +} + .gap-y-1 { row-gap: 0.25rem; } +.gap-y-2 { + row-gap: 0.5rem; +} + .space-x-2 > :not([hidden]) ~ :not([hidden]) { --tw-space-x-reverse: 0; margin-right: calc(0.5rem * var(--tw-space-x-reverse)); margin-left: calc(0.5rem * calc(1 - var(--tw-space-x-reverse))); } +.space-y-2 > :not([hidden]) ~ :not([hidden]) { + --tw-space-y-reverse: 0; + margin-top: calc(0.5rem * calc(1 - var(--tw-space-y-reverse))); + margin-bottom: calc(0.5rem * var(--tw-space-y-reverse)); +} + .overflow-y-auto { overflow-y: auto; } @@ -1359,6 +1444,10 @@ select { border-width: 1px; } +.border-2 { + border-width: 2px; +} + .border-t { border-top-width: 1px; } @@ -1367,6 +1456,11 @@ select { border-style: none; } +.border-black { + --tw-border-opacity: 1; + border-color: rgb(0 0 0 / var(--tw-border-opacity)); +} + .border-blue-300 { --tw-border-opacity: 1; border-color: rgb(147 197 253 / var(--tw-border-opacity)); @@ -1422,6 +1516,11 @@ select { border-color: rgb(252 165 165 / var(--tw-border-opacity)); } +.border-white { + --tw-border-opacity: 1; + border-color: rgb(255 255 255 / var(--tw-border-opacity)); +} + .bg-black\/70 { background-color: rgb(0 0 0 / 0.7); } @@ -1490,6 +1589,15 @@ select { object-fit: cover; } +.object-scale-down { + -o-object-fit: scale-down; + object-fit: scale-down; +} + +.p-1 { + padding: 0.25rem; +} + .p-2 { padding: 0.5rem; } @@ -1524,6 +1632,11 @@ select { padding-right: 1rem; } +.px-5 { + padding-left: 1.25rem; + padding-right: 1.25rem; +} + .px-6 { padding-left: 1.5rem; padding-right: 1.5rem; @@ -1559,11 +1672,6 @@ select { padding-bottom: 2rem; } -.px-5 { - padding-left: 1.25rem; - padding-right: 1.25rem; -} - .pb-10 { padding-bottom: 2.5rem; } @@ -1580,10 +1688,18 @@ select { padding-bottom: 0.75rem; } +.pb-4 { + padding-bottom: 1rem; +} + .pb-6 { padding-bottom: 1.5rem; } +.pl-0 { + padding-left: 0px; +} + .pl-12 { padding-left: 3rem; } @@ -1592,6 +1708,10 @@ select { padding-left: 0.5rem; } +.pl-4 { + padding-left: 1rem; +} + .pl-6 { padding-left: 1.5rem; } @@ -1624,14 +1744,26 @@ select { padding-right: 2rem; } +.pt-0 { + padding-top: 0px; +} + .pt-1 { padding-top: 0.25rem; } +.pt-2 { + padding-top: 0.5rem; +} + .pt-20 { padding-top: 5rem; } +.pt-3 { + padding-top: 0.75rem; +} + .pt-4 { padding-top: 1rem; } @@ -1644,6 +1776,14 @@ select { padding-top: 1.5rem; } +.pt-7 { + padding-top: 1.75rem; +} + +.pt-8 { + padding-top: 2rem; +} + .pt-9 { padding-top: 2.25rem; } @@ -1674,6 +1814,11 @@ select { line-height: 2.5rem; } +.text-5xl { + font-size: 3rem; + line-height: 1; +} + .text-base { font-size: 1rem; line-height: 1.5rem; @@ -1746,6 +1891,11 @@ select { color: rgb(23 37 84 / var(--tw-text-opacity)); } +.text-gray-300 { + --tw-text-opacity: 1; + color: rgb(209 213 219 / var(--tw-text-opacity)); +} + .text-gray-400 { --tw-text-opacity: 1; color: rgb(156 163 175 / var(--tw-text-opacity)); @@ -2151,10 +2301,6 @@ input[type="radio"]:focus,input[type="checkbox"]:focus { } @media (min-width: 640px) { - .sm\:mb-1 { - margin-bottom: 0.25rem; - } - .sm\:flex { display: flex; } @@ -2170,6 +2316,19 @@ input[type="radio"]:focus,input[type="checkbox"]:focus { position: absolute; } + .md\:bottom-28 { + bottom: 7rem; + } + + .md\:right-12 { + right: 3rem; + } + + .md\:my-24 { + margin-top: 6rem; + margin-bottom: 6rem; + } + .md\:mt-0 { margin-top: 0px; } @@ -2178,6 +2337,10 @@ input[type="radio"]:focus,input[type="checkbox"]:focus { margin-top: 6rem; } + .md\:mt-32 { + margin-top: 8rem; + } + .md\:block { display: block; } @@ -2194,10 +2357,30 @@ input[type="radio"]:focus,input[type="checkbox"]:focus { display: none; } + .md\:h-\[200px\] { + height: 200px; + } + + .md\:h-\[300px\] { + height: 300px; + } + .md\:h-\[3rem\] { height: 3rem; } + .md\:h-\[400px\] { + height: 400px; + } + + .md\:h-\[40px\] { + height: 40px; + } + + .md\:h-\[410px\] { + height: 410px; + } + .md\:w-1\/2 { width: 50%; } @@ -2226,6 +2409,34 @@ input[type="radio"]:focus,input[type="checkbox"]:focus { width: 50%; } + .md\:w-8\/12 { + width: 66.666667%; + } + + .md\:w-\[30\%\] { + width: 30%; + } + + .md\:w-\[40\%\] { + width: 40%; + } + + .md\:w-\[40px\] { + width: 40px; + } + + .md\:w-\[50\%\] { + width: 50%; + } + + .md\:w-\[60\%\] { + width: 60%; + } + + .md\:w-\[70\%\] { + width: 70%; + } + .md\:grid-cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); } @@ -2242,6 +2453,10 @@ input[type="radio"]:focus,input[type="checkbox"]:focus { align-items: flex-start; } + .md\:justify-start { + justify-content: flex-start; + } + .md\:gap-0 { gap: 0px; } @@ -2262,10 +2477,36 @@ input[type="radio"]:focus,input[type="checkbox"]:focus { padding: 2rem; } + .md\:px-10 { + padding-left: 2.5rem; + padding-right: 2.5rem; + } + + .md\:px-4 { + padding-left: 1rem; + padding-right: 1rem; + } + + .md\:pl-10 { + padding-left: 2.5rem; + } + + .md\:pl-12 { + padding-left: 3rem; + } + + .md\:pl-3 { + padding-left: 0.75rem; + } + .md\:pl-4 { padding-left: 1rem; } + .md\:pl-5 { + padding-left: 1.25rem; + } + .md\:pr-12 { padding-right: 3rem; } @@ -2278,10 +2519,38 @@ input[type="radio"]:focus,input[type="checkbox"]:focus { padding-right: 12rem; } + .md\:pr-5 { + padding-right: 1.25rem; + } + + .md\:pt-0 { + padding-top: 0px; + } + + .md\:pt-10 { + padding-top: 2.5rem; + } + + .md\:pt-12 { + padding-top: 3rem; + } + + .md\:pt-6 { + padding-top: 1.5rem; + } + + .md\:pt-8 { + padding-top: 2rem; + } + .md\:pt-9 { padding-top: 2.25rem; } + .md\:text-left { + text-align: left; + } + .md\:text-2xl { font-size: 1.5rem; line-height: 2rem; @@ -2312,9 +2581,27 @@ input[type="radio"]:focus,input[type="checkbox"]:focus { line-height: 1.25rem; } + .md\:text-xl { + font-size: 1.25rem; + line-height: 1.75rem; + } + + .md\:text-xs { + font-size: 0.75rem; + line-height: 1rem; + } + .md\:font-bold { font-weight: 700; } + + .md\:font-medium { + font-weight: 500; + } + + .md\:font-semibold { + font-weight: 600; + } } @media (min-width: 1024px) { @@ -2334,6 +2621,20 @@ input[type="radio"]:focus,input[type="checkbox"]:focus { right: 0px; } + .lg\:right-20 { + right: 5rem; + } + + .lg\:my-20 { + margin-top: 5rem; + margin-bottom: 5rem; + } + + .lg\:my-32 { + margin-top: 8rem; + margin-bottom: 8rem; + } + .lg\:mb-2 { margin-bottom: 0.5rem; } @@ -2342,6 +2643,10 @@ input[type="radio"]:focus,input[type="checkbox"]:focus { margin-bottom: 8rem; } + .lg\:mt-32 { + margin-top: 8rem; + } + .lg\:flex { display: flex; } @@ -2350,8 +2655,20 @@ input[type="radio"]:focus,input[type="checkbox"]:focus { display: none; } - .lg\:h-2\/3 { - height: 66.666667%; + .lg\:h-\[200px\] { + height: 200px; + } + + .lg\:h-\[400px\] { + height: 400px; + } + + .lg\:h-\[500px\] { + height: 500px; + } + + .lg\:h-\[60px\] { + height: 60px; } .lg\:h-\[90vh\] { @@ -2370,10 +2687,6 @@ input[type="radio"]:focus,input[type="checkbox"]:focus { width: 20%; } - .lg\:w-11\/12 { - width: 91.666667%; - } - .lg\:w-2\/5 { width: 40%; } @@ -2382,10 +2695,18 @@ input[type="radio"]:focus,input[type="checkbox"]:focus { width: 60%; } + .lg\:w-52 { + width: 13rem; + } + .lg\:w-80 { width: 20rem; } + .lg\:w-\[60px\] { + width: 60px; + } + .lg\:w-full { width: 100%; } @@ -2422,6 +2743,16 @@ input[type="radio"]:focus,input[type="checkbox"]:focus { padding: 1rem; } + .lg\:px-20 { + padding-left: 5rem; + padding-right: 5rem; + } + + .lg\:px-36 { + padding-left: 9rem; + padding-right: 9rem; + } + .lg\:px-8 { padding-left: 2rem; padding-right: 2rem; @@ -2432,31 +2763,72 @@ input[type="radio"]:focus,input[type="checkbox"]:focus { padding-bottom: 0px; } - .lg\:px-36 { - padding-left: 9rem; - padding-right: 9rem; + .lg\:py-8 { + padding-top: 2rem; + padding-bottom: 2rem; } - .lg\:pt-12 { - padding-top: 3rem; + .lg\:pb-6 { + padding-bottom: 1.5rem; } - .lg\:pt-14 { - padding-top: 3.5rem; + .lg\:pl-2 { + padding-left: 0.5rem; + } + + .lg\:pl-24 { + padding-left: 6rem; + } + + .lg\:pl-5 { + padding-left: 1.25rem; + } + + .lg\:pr-10 { + padding-right: 2.5rem; + } + + .lg\:pr-6 { + padding-right: 1.5rem; + } + + .lg\:pt-10 { + padding-top: 2.5rem; + } + + .lg\:pt-16 { + padding-top: 4rem; + } + + .lg\:pt-20 { + padding-top: 5rem; } .lg\:pt-24 { padding-top: 6rem; } + .lg\:pt-8 { + padding-top: 2rem; + } + + .lg\:pt-9 { + padding-top: 2.25rem; + } + + .lg\:text-2xl { + font-size: 1.5rem; + line-height: 2rem; + } + .lg\:text-3xl { font-size: 1.875rem; line-height: 2.25rem; } - .lg\:text-5xl { - font-size: 3rem; - line-height: 1; + .lg\:text-4xl { + font-size: 2.25rem; + line-height: 2.5rem; } .lg\:text-lg { @@ -2469,11 +2841,6 @@ input[type="radio"]:focus,input[type="checkbox"]:focus { line-height: 1.75rem; } - .lg\:text-4xl { - font-size: 2.25rem; - line-height: 2.5rem; - } - .lg\:font-bold { font-weight: 700; } @@ -2501,5 +2868,29 @@ input[type="radio"]:focus,input[type="checkbox"]:focus { .xl\:w-9\/12 { width: 75%; } + + .xl\:pl-12 { + padding-left: 3rem; + } + + .xl\:pr-12 { + padding-right: 3rem; + } + + .xl\:text-5xl { + font-size: 3rem; + line-height: 1; + } + + .xl\:text-xl { + font-size: 1.25rem; + line-height: 1.75rem; + } +} + +@media (min-width: 1536px) { + .\32xl\:pr-16 { + padding-right: 4rem; + } }