public/avo-assets/avo.base.css in avo-3.0.0.pre3 vs public/avo-assets/avo.base.css in avo-3.0.0.pre4

- old
+ new

@@ -6262,10 +6262,22 @@ .container{ max-width:1536px } } +.sr-only{ + position:absolute; + width:1px; + height:1px; + padding:0; + margin:-1px; + overflow:hidden; + clip:rect(0, 0, 0, 0); + white-space:nowrap; + border-width:0 +} + .pointer-events-none{ pointer-events:none } .pointer-events-auto{ @@ -6357,18 +6369,42 @@ .-top-\[0\.1rem\]{ top:-0.1rem } -.top-0{ - top:0px -} - .left-1{ left:0.25rem } +.top-1{ + top:0.25rem +} + +.top-auto{ + top:auto +} + +.-bottom-1{ + bottom:-0.25rem +} + +.left-auto{ + left:auto +} + +.top-2{ + top:0.5rem +} + +.right-3{ + right:0.75rem +} + +.top-0{ + top:0px +} + .bottom-1{ bottom:0.25rem } .top-3{ @@ -6409,10 +6445,62 @@ .z-30{ z-index:30 } +.col-span-full{ + grid-column:1 / -1 +} + +.col-span-1{ + grid-column:span 1 / span 1 +} + +.col-span-2{ + grid-column:span 2 / span 2 +} + +.col-span-3{ + grid-column:span 3 / span 3 +} + +.col-span-4{ + grid-column:span 4 / span 4 +} + +.col-span-5{ + grid-column:span 5 / span 5 +} + +.col-span-6{ + grid-column:span 6 / span 6 +} + +.row-span-1{ + grid-row:span 1 / span 1 +} + +.row-span-2{ + grid-row:span 2 / span 2 +} + +.row-span-3{ + grid-row:span 3 / span 3 +} + +.row-span-4{ + grid-row:span 4 / span 4 +} + +.row-span-5{ + grid-row:span 5 / span 5 +} + +.row-span-6{ + grid-row:span 6 / span 6 +} + .float-right{ float:right } .float-left{ @@ -6480,10 +6568,30 @@ .mx-6{ margin-left:1.5rem; margin-right:1.5rem } +.-mx-1{ + margin-left:-0.25rem; + margin-right:-0.25rem +} + +.-mx-4{ + margin-left:-1rem; + margin-right:-1rem +} + +.-my-4{ + margin-top:-1rem; + margin-bottom:-1rem +} + +.mx-auto{ + margin-left:auto; + margin-right:auto +} + .mt-4{ margin-top:1rem } .mt-3{ @@ -6608,10 +6716,46 @@ .mb-1{ margin-bottom:0.25rem } +.mr-px{ + margin-right:1px +} + +.-mt-2{ + margin-top:-0.5rem +} + +.-ml-px{ + margin-left:-1px +} + +.-ml-20{ + margin-left:-5rem +} + +.-ml-10{ + margin-left:-2.5rem +} + +.-mt-24{ + margin-top:-6rem +} + +.ml-8{ + margin-left:2rem +} + +.ml-20{ + margin-left:5rem +} + +.-mt-10{ + margin-top:-2.5rem +} + .block{ display:block } .inline-block{ @@ -6752,10 +6896,26 @@ .h-1{ height:0.25rem } +.h-14{ + height:3.5rem +} + +.h-36{ + height:9rem +} + +.h-72{ + height:18rem +} + +.h-40{ + height:10rem +} + .max-h-\[42rem\]{ max-height:42rem } .max-h-full{ @@ -6780,10 +6940,14 @@ .min-h-\[3rem\]{ min-height:3rem } +.min-h-inherit{ + min-height:inherit +} + .w-5{ width:1.25rem } .w-4{ @@ -6848,10 +7012,18 @@ .w-1{ width:0.25rem } +.w-11{ + width:2.75rem +} + +.w-2{ + width:0.5rem +} + .min-w-\[1rem\]{ min-width:1rem } .min-w-\[300px\]{ @@ -6888,10 +7060,14 @@ .max-w-lg{ max-width:32rem } +.max-w-xs{ + max-width:20rem +} + .flex-1{ flex:1 1 0% } .flex-shrink-0{ @@ -6952,10 +7128,15 @@ .translate-y-1{ --tw-translate-y:0.25rem; transform:translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)) } +.-translate-x-1{ + --tw-translate-x:-0.25rem; + transform:translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)) +} + .rotate-90{ --tw-rotate:90deg; transform:translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)) } @@ -6989,10 +7170,26 @@ .grid-cols-1{ grid-template-columns:repeat(1, minmax(0, 1fr)) } +.grid-cols-3{ + grid-template-columns:repeat(3, minmax(0, 1fr)) +} + +.grid-cols-4{ + grid-template-columns:repeat(4, minmax(0, 1fr)) +} + +.grid-cols-5{ + grid-template-columns:repeat(5, minmax(0, 1fr)) +} + +.grid-cols-6{ + grid-template-columns:repeat(6, minmax(0, 1fr)) +} + .flex-row{ flex-direction:row } .flex-col{ @@ -7045,10 +7242,14 @@ .justify-between{ justify-content:space-between } +.justify-around{ + justify-content:space-around +} + .justify-evenly{ justify-content:space-evenly } .gap-2{ @@ -7065,10 +7266,18 @@ .gap-3{ gap:0.75rem } +.gap-0{ + gap:0px +} + +.gap-1{ + gap:0.25rem +} + .space-y-4 > :not([hidden]) ~ :not([hidden]){ --tw-space-y-reverse:0; margin-top:calc(1rem * calc(1 - var(--tw-space-y-reverse))); margin-bottom:calc(1rem * var(--tw-space-y-reverse)) } @@ -7131,10 +7340,28 @@ --tw-space-y-reverse:0; margin-top:calc(0.75rem * calc(1 - var(--tw-space-y-reverse))); margin-bottom:calc(0.75rem * var(--tw-space-y-reverse)) } +.space-y-0 > :not([hidden]) ~ :not([hidden]){ + --tw-space-y-reverse:0; + margin-top:calc(0px * calc(1 - var(--tw-space-y-reverse))); + margin-bottom:calc(0px * var(--tw-space-y-reverse)) +} + +.space-x-8 > :not([hidden]) ~ :not([hidden]){ + --tw-space-x-reverse:0; + margin-right:calc(2rem * var(--tw-space-x-reverse)); + margin-left:calc(2rem * calc(1 - var(--tw-space-x-reverse))) +} + +.space-x-0 > :not([hidden]) ~ :not([hidden]){ + --tw-space-x-reverse:0; + margin-right:calc(0px * var(--tw-space-x-reverse)); + margin-left:calc(0px * calc(1 - var(--tw-space-x-reverse))) +} + .divide-y > :not([hidden]) ~ :not([hidden]){ --tw-divide-y-reverse:0; border-top-width:calc(1px * calc(1 - var(--tw-divide-y-reverse))); border-bottom-width:calc(1px * var(--tw-divide-y-reverse)) } @@ -7239,14 +7466,29 @@ .rounded-t{ border-top-left-radius:0.25rem; border-top-right-radius:0.25rem } +.rounded-r-md{ + border-top-right-radius:0.375rem; + border-bottom-right-radius:0.375rem +} + +.rounded-l-md{ + border-top-left-radius:0.375rem; + border-bottom-left-radius:0.375rem +} + .border{ border-width:1px } +.border-y{ + border-top-width:1px; + border-bottom-width:1px +} + .border-t{ border-top-width:1px } .border-b-2{ @@ -7446,10 +7688,14 @@ .border-gray-150{ --tw-border-opacity:1; border-color:rgb(214 216 220 / var(--tw-border-opacity)) } +.border-primary-300{ + border-color:rgb(var(--color-primary-300)) +} + .bg-slate-500{ --tw-bg-opacity:1; background-color:rgb(100 116 139 / var(--tw-bg-opacity)) } @@ -7638,10 +7884,23 @@ .bg-gray-600{ --tw-bg-opacity:1; background-color:rgb(94 100 110 / var(--tw-bg-opacity)) } +.bg-gray-200{ + --tw-bg-opacity:1; + background-color:rgb(200 203 208 / var(--tw-bg-opacity)) +} + +.bg-primary-400{ + background-color:rgb(var(--color-primary-400)) +} + +.bg-transparent{ + background-color:transparent +} + .bg-opacity-25{ --tw-bg-opacity:0.25 } .bg-none{ @@ -7768,10 +8027,25 @@ .py-8{ padding-top:2rem; padding-bottom:2rem } +.px-24{ + padding-left:6rem; + padding-right:6rem +} + +.px-8{ + padding-left:2rem; + padding-right:2rem +} + +.py-12{ + padding-top:3rem; + padding-bottom:3rem +} + .pb-6{ padding-bottom:1.5rem } .pb-3{ @@ -7832,10 +8106,14 @@ .pr-0{ padding-right:0px } +.pl-4{ + padding-left:1rem +} + .text-left{ text-align:left } .text-center{ @@ -7848,10 +8126,14 @@ .text-justify{ text-align:justify } +.font-sans{ + font-family:"Inter", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji" +} + .text-sm{ font-size:0.875rem; line-height:1.25rem } @@ -7878,10 +8160,20 @@ .text-2xl{ font-size:1.5rem; line-height:2rem } +.text-3xl{ + font-size:1.875rem; + line-height:2.25rem +} + +.text-5xl{ + font-size:3rem; + line-height:1 +} + .font-bold{ font-weight:700 } .font-semibold{ @@ -7890,10 +8182,14 @@ .font-medium{ font-weight:500 } +.font-normal{ + font-weight:400 +} + .uppercase{ text-transform:uppercase } .lowercase{ @@ -8129,10 +8425,15 @@ .text-green-600{ --tw-text-opacity:1; color:rgb(22 163 74 / var(--tw-text-opacity)) } +.\!text-blue-700{ + --tw-text-opacity:1 !important; + color:rgb(5 80 133 / var(--tw-text-opacity)) !important +} + .underline{ -webkit-text-decoration-line:underline; text-decoration-line:underline } @@ -8144,10 +8445,15 @@ .line-through{ -webkit-text-decoration-line:line-through; text-decoration-line:line-through } +.no-underline{ + -webkit-text-decoration-line:none; + text-decoration-line:none +} + .antialiased{ -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale } @@ -8170,10 +8476,14 @@ .opacity-100{ opacity:1 } +.opacity-80{ + opacity:0.8 +} + .shadow-md{ --tw-shadow:0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1); --tw-shadow-colored:0 4px 6px -1px var(--tw-shadow-color), 0 2px 4px -2px var(--tw-shadow-color); box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow) } @@ -8226,20 +8536,30 @@ .blur{ --tw-blur:blur(8px); 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) } +.drop-shadow{ + --tw-drop-shadow:drop-shadow(0 1px 2px rgb(0 0 0 / 0.1)) drop-shadow(0 1px 1px rgb(0 0 0 / 0.06)); + 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) +} + .grayscale{ --tw-grayscale:grayscale(100%); 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) } .invert{ --tw-invert:invert(100%); 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) } +.sepia{ + --tw-sepia:sepia(100%); + 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) +} + .filter{ 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) } .backdrop-filter{ @@ -8283,10 +8603,14 @@ .ease-in-out{ transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1) } +.will-change-transform{ + will-change:transform +} + html, body{ position:relative; height:100%; -webkit-font-smoothing:antialiased; @@ -8727,9 +9051,14 @@ } .hover\:bg-gray-50:hover{ --tw-bg-opacity:1; background-color:rgb(241 242 243 / var(--tw-bg-opacity)) +} + +.hover\:bg-blue-500:hover{ + --tw-bg-opacity:1; + background-color:rgb(8 134 222 / var(--tw-bg-opacity)) } .hover\:text-gray-600:hover{ --tw-text-opacity:1; color:rgb(94 100 110 / var(--tw-text-opacity))