From e778fc3db9a9a2c256a343d6c610c8ac4e8ac93a Mon Sep 17 00:00:00 2001 From: Josmithr Date: Tue, 24 Sep 2024 10:27:27 -0700 Subject: [PATCH] Update css --- src/output.css | 1008 +++++++++++++++++++++++++----------------------- 1 file changed, 520 insertions(+), 488 deletions(-) diff --git a/src/output.css b/src/output.css index 52bb638..5c507f8 100644 --- a/src/output.css +++ b/src/output.css @@ -10,19 +10,19 @@ *, ::before, ::after { - box-sizing: border-box; - /* 1 */ - border-width: 0; - /* 2 */ - border-style: solid; - /* 2 */ - border-color: #e5e7eb; - /* 2 */ + box-sizing: border-box; + /* 1 */ + border-width: 0; + /* 2 */ + border-style: solid; + /* 2 */ + border-color: #e5e7eb; + /* 2 */ } ::before, ::after { - --tw-content: ''; + --tw-content: ""; } /* @@ -37,23 +37,24 @@ html, :host { - line-height: 1.5; - /* 1 */ - -webkit-text-size-adjust: 100%; - /* 2 */ - -moz-tab-size: 4; - /* 3 */ - -o-tab-size: 4; - tab-size: 4; - /* 3 */ - font-family: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"; - /* 4 */ - font-feature-settings: normal; - /* 5 */ - font-variation-settings: normal; - /* 6 */ - -webkit-tap-highlight-color: transparent; - /* 7 */ + line-height: 1.5; + /* 1 */ + -webkit-text-size-adjust: 100%; + /* 2 */ + -moz-tab-size: 4; + /* 3 */ + -o-tab-size: 4; + tab-size: 4; + /* 3 */ + font-family: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", + "Segoe UI Symbol", "Noto Color Emoji"; + /* 4 */ + font-feature-settings: normal; + /* 5 */ + font-variation-settings: normal; + /* 6 */ + -webkit-tap-highlight-color: transparent; + /* 7 */ } /* @@ -62,10 +63,10 @@ html, */ body { - margin: 0; - /* 1 */ - line-height: inherit; - /* 2 */ + margin: 0; + /* 1 */ + line-height: inherit; + /* 2 */ } /* @@ -75,12 +76,12 @@ body { */ hr { - height: 0; - /* 1 */ - color: inherit; - /* 2 */ - border-top-width: 1px; - /* 3 */ + height: 0; + /* 1 */ + color: inherit; + /* 2 */ + border-top-width: 1px; + /* 3 */ } /* @@ -88,8 +89,8 @@ Add the correct text decoration in Chrome, Edge, and Safari. */ abbr:where([title]) { - -webkit-text-decoration: underline dotted; - text-decoration: underline dotted; + -webkit-text-decoration: underline dotted; + text-decoration: underline dotted; } /* @@ -102,8 +103,8 @@ h3, h4, h5, h6 { - font-size: inherit; - font-weight: inherit; + font-size: inherit; + font-weight: inherit; } /* @@ -111,8 +112,8 @@ Reset links to optimize for opt-in styling instead of opt-out. */ a { - color: inherit; - text-decoration: inherit; + color: inherit; + text-decoration: inherit; } /* @@ -121,7 +122,7 @@ Add the correct font weight in Edge and Safari. b, strong { - font-weight: bolder; + font-weight: bolder; } /* @@ -135,14 +136,15 @@ code, kbd, samp, pre { - font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; - /* 1 */ - font-feature-settings: normal; - /* 2 */ - font-variation-settings: normal; - /* 3 */ - font-size: 1em; - /* 4 */ + font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", + "Courier New", monospace; + /* 1 */ + font-feature-settings: normal; + /* 2 */ + font-variation-settings: normal; + /* 3 */ + font-size: 1em; + /* 4 */ } /* @@ -150,7 +152,7 @@ Add the correct font size in all browsers. */ small { - font-size: 80%; + font-size: 80%; } /* @@ -159,18 +161,18 @@ Prevent `sub` and `sup` elements from affecting the line height in all browsers. sub, sup { - font-size: 75%; - line-height: 0; - position: relative; - vertical-align: baseline; + font-size: 75%; + line-height: 0; + position: relative; + vertical-align: baseline; } sub { - bottom: -0.25em; + bottom: -0.25em; } sup { - top: -0.5em; + top: -0.5em; } /* @@ -180,12 +182,12 @@ sup { */ table { - text-indent: 0; - /* 1 */ - border-color: inherit; - /* 2 */ - border-collapse: collapse; - /* 3 */ + text-indent: 0; + /* 1 */ + border-color: inherit; + /* 2 */ + border-collapse: collapse; + /* 3 */ } /* @@ -199,26 +201,26 @@ input, optgroup, select, textarea { - font-family: inherit; - /* 1 */ - font-feature-settings: inherit; - /* 1 */ - font-variation-settings: inherit; - /* 1 */ - font-size: 100%; - /* 1 */ - font-weight: inherit; - /* 1 */ - line-height: inherit; - /* 1 */ - letter-spacing: inherit; - /* 1 */ - color: inherit; - /* 1 */ - margin: 0; - /* 2 */ - padding: 0; - /* 3 */ + font-family: inherit; + /* 1 */ + font-feature-settings: inherit; + /* 1 */ + font-variation-settings: inherit; + /* 1 */ + font-size: 100%; + /* 1 */ + font-weight: inherit; + /* 1 */ + line-height: inherit; + /* 1 */ + letter-spacing: inherit; + /* 1 */ + color: inherit; + /* 1 */ + margin: 0; + /* 2 */ + padding: 0; + /* 3 */ } /* @@ -227,7 +229,7 @@ Remove the inheritance of text transform in Edge and Firefox. button, select { - text-transform: none; + text-transform: none; } /* @@ -236,15 +238,15 @@ select { */ button, -input:where([type='button']), -input:where([type='reset']), -input:where([type='submit']) { - -webkit-appearance: button; - /* 1 */ - background-color: transparent; - /* 2 */ - background-image: none; - /* 2 */ +input:where([type="button"]), +input:where([type="reset"]), +input:where([type="submit"]) { + -webkit-appearance: button; + /* 1 */ + background-color: transparent; + /* 2 */ + background-image: none; + /* 2 */ } /* @@ -252,7 +254,7 @@ Use the modern Firefox focus style for all focusable elements. */ :-moz-focusring { - outline: auto; + outline: auto; } /* @@ -260,7 +262,7 @@ Remove the additional `:invalid` styles in Firefox. (https://github.com/mozilla/ */ :-moz-ui-invalid { - box-shadow: none; + box-shadow: none; } /* @@ -268,7 +270,7 @@ Add the correct vertical alignment in Chrome and Firefox. */ progress { - vertical-align: baseline; + vertical-align: baseline; } /* @@ -277,7 +279,7 @@ Correct the cursor style of increment and decrement buttons in Safari. ::-webkit-inner-spin-button, ::-webkit-outer-spin-button { - height: auto; + height: auto; } /* @@ -285,11 +287,11 @@ Correct the cursor style of increment and decrement buttons in Safari. 2. Correct the outline style in Safari. */ -[type='search'] { - -webkit-appearance: textfield; - /* 1 */ - outline-offset: -2px; - /* 2 */ +[type="search"] { + -webkit-appearance: textfield; + /* 1 */ + outline-offset: -2px; + /* 2 */ } /* @@ -297,7 +299,7 @@ Remove the inner padding in Chrome and Safari on macOS. */ ::-webkit-search-decoration { - -webkit-appearance: none; + -webkit-appearance: none; } /* @@ -306,10 +308,10 @@ Remove the inner padding in Chrome and Safari on macOS. */ ::-webkit-file-upload-button { - -webkit-appearance: button; - /* 1 */ - font: inherit; - /* 2 */ + -webkit-appearance: button; + /* 1 */ + font: inherit; + /* 2 */ } /* @@ -317,7 +319,7 @@ Add the correct display in Chrome and Safari. */ summary { - display: list-item; + display: list-item; } /* @@ -337,24 +339,24 @@ hr, figure, p, pre { - margin: 0; + margin: 0; } fieldset { - margin: 0; - padding: 0; + margin: 0; + padding: 0; } legend { - padding: 0; + padding: 0; } ol, ul, menu { - list-style: none; - margin: 0; - padding: 0; + list-style: none; + margin: 0; + padding: 0; } /* @@ -362,7 +364,7 @@ Reset default styling for dialogs. */ dialog { - padding: 0; + padding: 0; } /* @@ -370,7 +372,7 @@ Prevent resizing textareas horizontally by default. */ textarea { - resize: vertical; + resize: vertical; } /* @@ -378,19 +380,20 @@ textarea { 2. Set the default placeholder color to the user's configured gray 400 color. */ -input::-moz-placeholder, textarea::-moz-placeholder { - opacity: 1; - /* 1 */ - color: #9ca3af; - /* 2 */ +input::-moz-placeholder, +textarea::-moz-placeholder { + opacity: 1; + /* 1 */ + color: #9ca3af; + /* 2 */ } input::placeholder, textarea::placeholder { - opacity: 1; - /* 1 */ - color: #9ca3af; - /* 2 */ + opacity: 1; + /* 1 */ + color: #9ca3af; + /* 2 */ } /* @@ -399,7 +402,7 @@ Set the default cursor for buttons. button, [role="button"] { - cursor: pointer; + cursor: pointer; } /* @@ -407,7 +410,7 @@ Make sure disabled buttons don't get the pointer cursor. */ :disabled { - cursor: default; + cursor: default; } /* @@ -424,10 +427,10 @@ audio, iframe, embed, object { - display: block; - /* 1 */ - vertical-align: middle; - /* 2 */ + display: block; + /* 1 */ + vertical-align: middle; + /* 2 */ } /* @@ -436,812 +439,839 @@ Constrain images and videos to the parent width and preserve their intrinsic asp img, video { - max-width: 100%; - height: auto; + max-width: 100%; + height: auto; } /* Make elements with the HTML hidden attribute stay hidden by default */ [hidden] { - display: none; -} - -*, ::before, ::after { - --tw-border-spacing-x: 0; - --tw-border-spacing-y: 0; - --tw-translate-x: 0; - --tw-translate-y: 0; - --tw-rotate: 0; - --tw-skew-x: 0; - --tw-skew-y: 0; - --tw-scale-x: 1; - --tw-scale-y: 1; - --tw-pan-x: ; - --tw-pan-y: ; - --tw-pinch-zoom: ; - --tw-scroll-snap-strictness: proximity; - --tw-gradient-from-position: ; - --tw-gradient-via-position: ; - --tw-gradient-to-position: ; - --tw-ordinal: ; - --tw-slashed-zero: ; - --tw-numeric-figure: ; - --tw-numeric-spacing: ; - --tw-numeric-fraction: ; - --tw-ring-inset: ; - --tw-ring-offset-width: 0px; - --tw-ring-offset-color: #fff; - --tw-ring-color: rgb(59 130 246 / 0.5); - --tw-ring-offset-shadow: 0 0 #0000; - --tw-ring-shadow: 0 0 #0000; - --tw-shadow: 0 0 #0000; - --tw-shadow-colored: 0 0 #0000; - --tw-blur: ; - --tw-brightness: ; - --tw-contrast: ; - --tw-grayscale: ; - --tw-hue-rotate: ; - --tw-invert: ; - --tw-saturate: ; - --tw-sepia: ; - --tw-drop-shadow: ; - --tw-backdrop-blur: ; - --tw-backdrop-brightness: ; - --tw-backdrop-contrast: ; - --tw-backdrop-grayscale: ; - --tw-backdrop-hue-rotate: ; - --tw-backdrop-invert: ; - --tw-backdrop-opacity: ; - --tw-backdrop-saturate: ; - --tw-backdrop-sepia: ; - --tw-contain-size: ; - --tw-contain-layout: ; - --tw-contain-paint: ; - --tw-contain-style: ; + display: none; +} + +*, +::before, +::after { + --tw-border-spacing-x: 0; + --tw-border-spacing-y: 0; + --tw-translate-x: 0; + --tw-translate-y: 0; + --tw-rotate: 0; + --tw-skew-x: 0; + --tw-skew-y: 0; + --tw-scale-x: 1; + --tw-scale-y: 1; + --tw-pan-x: ; + --tw-pan-y: ; + --tw-pinch-zoom: ; + --tw-scroll-snap-strictness: proximity; + --tw-gradient-from-position: ; + --tw-gradient-via-position: ; + --tw-gradient-to-position: ; + --tw-ordinal: ; + --tw-slashed-zero: ; + --tw-numeric-figure: ; + --tw-numeric-spacing: ; + --tw-numeric-fraction: ; + --tw-ring-inset: ; + --tw-ring-offset-width: 0px; + --tw-ring-offset-color: #fff; + --tw-ring-color: rgb(59 130 246 / 0.5); + --tw-ring-offset-shadow: 0 0 #0000; + --tw-ring-shadow: 0 0 #0000; + --tw-shadow: 0 0 #0000; + --tw-shadow-colored: 0 0 #0000; + --tw-blur: ; + --tw-brightness: ; + --tw-contrast: ; + --tw-grayscale: ; + --tw-hue-rotate: ; + --tw-invert: ; + --tw-saturate: ; + --tw-sepia: ; + --tw-drop-shadow: ; + --tw-backdrop-blur: ; + --tw-backdrop-brightness: ; + --tw-backdrop-contrast: ; + --tw-backdrop-grayscale: ; + --tw-backdrop-hue-rotate: ; + --tw-backdrop-invert: ; + --tw-backdrop-opacity: ; + --tw-backdrop-saturate: ; + --tw-backdrop-sepia: ; + --tw-contain-size: ; + --tw-contain-layout: ; + --tw-contain-paint: ; + --tw-contain-style: ; } ::backdrop { - --tw-border-spacing-x: 0; - --tw-border-spacing-y: 0; - --tw-translate-x: 0; - --tw-translate-y: 0; - --tw-rotate: 0; - --tw-skew-x: 0; - --tw-skew-y: 0; - --tw-scale-x: 1; - --tw-scale-y: 1; - --tw-pan-x: ; - --tw-pan-y: ; - --tw-pinch-zoom: ; - --tw-scroll-snap-strictness: proximity; - --tw-gradient-from-position: ; - --tw-gradient-via-position: ; - --tw-gradient-to-position: ; - --tw-ordinal: ; - --tw-slashed-zero: ; - --tw-numeric-figure: ; - --tw-numeric-spacing: ; - --tw-numeric-fraction: ; - --tw-ring-inset: ; - --tw-ring-offset-width: 0px; - --tw-ring-offset-color: #fff; - --tw-ring-color: rgb(59 130 246 / 0.5); - --tw-ring-offset-shadow: 0 0 #0000; - --tw-ring-shadow: 0 0 #0000; - --tw-shadow: 0 0 #0000; - --tw-shadow-colored: 0 0 #0000; - --tw-blur: ; - --tw-brightness: ; - --tw-contrast: ; - --tw-grayscale: ; - --tw-hue-rotate: ; - --tw-invert: ; - --tw-saturate: ; - --tw-sepia: ; - --tw-drop-shadow: ; - --tw-backdrop-blur: ; - --tw-backdrop-brightness: ; - --tw-backdrop-contrast: ; - --tw-backdrop-grayscale: ; - --tw-backdrop-hue-rotate: ; - --tw-backdrop-invert: ; - --tw-backdrop-opacity: ; - --tw-backdrop-saturate: ; - --tw-backdrop-sepia: ; - --tw-contain-size: ; - --tw-contain-layout: ; - --tw-contain-paint: ; - --tw-contain-style: ; + --tw-border-spacing-x: 0; + --tw-border-spacing-y: 0; + --tw-translate-x: 0; + --tw-translate-y: 0; + --tw-rotate: 0; + --tw-skew-x: 0; + --tw-skew-y: 0; + --tw-scale-x: 1; + --tw-scale-y: 1; + --tw-pan-x: ; + --tw-pan-y: ; + --tw-pinch-zoom: ; + --tw-scroll-snap-strictness: proximity; + --tw-gradient-from-position: ; + --tw-gradient-via-position: ; + --tw-gradient-to-position: ; + --tw-ordinal: ; + --tw-slashed-zero: ; + --tw-numeric-figure: ; + --tw-numeric-spacing: ; + --tw-numeric-fraction: ; + --tw-ring-inset: ; + --tw-ring-offset-width: 0px; + --tw-ring-offset-color: #fff; + --tw-ring-color: rgb(59 130 246 / 0.5); + --tw-ring-offset-shadow: 0 0 #0000; + --tw-ring-shadow: 0 0 #0000; + --tw-shadow: 0 0 #0000; + --tw-shadow-colored: 0 0 #0000; + --tw-blur: ; + --tw-brightness: ; + --tw-contrast: ; + --tw-grayscale: ; + --tw-hue-rotate: ; + --tw-invert: ; + --tw-saturate: ; + --tw-sepia: ; + --tw-drop-shadow: ; + --tw-backdrop-blur: ; + --tw-backdrop-brightness: ; + --tw-backdrop-contrast: ; + --tw-backdrop-grayscale: ; + --tw-backdrop-hue-rotate: ; + --tw-backdrop-invert: ; + --tw-backdrop-opacity: ; + --tw-backdrop-saturate: ; + --tw-backdrop-sepia: ; + --tw-contain-size: ; + --tw-contain-layout: ; + --tw-contain-paint: ; + --tw-contain-style: ; } .container { - width: 100%; + width: 100%; } @media (min-width: 640px) { - .container { - max-width: 640px; - } + .container { + max-width: 640px; + } } @media (min-width: 768px) { - .container { - max-width: 768px; - } + .container { + max-width: 768px; + } } @media (min-width: 1024px) { - .container { - max-width: 1024px; - } + .container { + max-width: 1024px; + } } @media (min-width: 1280px) { - .container { - max-width: 1280px; - } + .container { + max-width: 1280px; + } } @media (min-width: 1536px) { - .container { - max-width: 1536px; - } + .container { + max-width: 1536px; + } } .absolute { - position: absolute; + position: absolute; } .relative { - position: relative; + position: relative; } .inset-x-0 { - left: 0px; - right: 0px; + left: 0px; + right: 0px; } .-bottom-2 { - bottom: -0.5rem; + bottom: -0.5rem; } .-left-2 { - left: -0.5rem; + left: -0.5rem; } .-right-2 { - right: -0.5rem; + right: -0.5rem; } .-top-2 { - top: -0.5rem; + top: -0.5rem; } .bottom-0 { - bottom: 0px; + bottom: 0px; } .bottom-4 { - bottom: 1rem; + bottom: 1rem; } .bottom-6 { - bottom: 1.5rem; + bottom: 1.5rem; } .left-0 { - left: 0px; + left: 0px; } .right-0 { - right: 0px; + right: 0px; } .right-6 { - right: 1.5rem; + right: 1.5rem; } .top-0 { - top: 0px; + top: 0px; } .bottom-16 { - bottom: 4rem; + bottom: 4rem; } .top-16 { - top: 4rem; + top: 4rem; } .top-4 { - top: 1rem; + top: 1rem; } .z-0 { - z-index: 0; + z-index: 0; } .z-10 { - z-index: 10; + z-index: 10; } .z-40 { - z-index: 40; + z-index: 40; } .z-50 { - z-index: 50; + z-index: 50; } .z-\[1000\] { - z-index: 1000; + z-index: 1000; } .m-2 { - margin: 0.5rem; + margin: 0.5rem; } .m-4 { - margin: 1rem; + margin: 1rem; } .m-auto { - margin: auto; + margin: auto; } .mx-auto { - margin-left: auto; - margin-right: auto; + margin-left: auto; + margin-right: auto; } .mb-2 { - margin-bottom: 0.5rem; + margin-bottom: 0.5rem; } .mr-2 { - margin-right: 0.5rem; + margin-right: 0.5rem; } .mt-1 { - margin-top: 0.25rem; + margin-top: 0.25rem; } .block { - display: block; + display: block; } .flex { - display: flex; + display: flex; } .inline-flex { - display: inline-flex; + display: inline-flex; } .h-32 { - height: 8rem; + height: 8rem; } .h-36 { - height: 9rem; + height: 9rem; } .h-6 { - height: 1.5rem; + height: 1.5rem; } .h-\[48px\] { - height: 48px; + height: 48px; } .h-\[calc\(100vh-182px\)\] { - height: calc(100vh - 182px); + height: calc(100vh - 182px); } .h-\[calc\(100vh-48px\)\] { - height: calc(100vh - 48px); + height: calc(100vh - 48px); } .h-fit { - height: -moz-fit-content; - height: fit-content; + height: -moz-fit-content; + height: fit-content; } .h-full { - height: 100%; + height: 100%; } .h-screen { - height: 100vh; + height: 100vh; } .max-h-60 { - max-height: 15rem; + max-height: 15rem; } .w-0 { - width: 0px; + width: 0px; } .w-20 { - width: 5rem; + width: 5rem; } .w-6 { - width: 1.5rem; + width: 1.5rem; } .w-60 { - width: 15rem; + width: 15rem; } .w-64 { - width: 16rem; + width: 16rem; } .w-\[500px\] { - width: 500px; + width: 500px; } .w-\[580px\] { - width: 580px; + width: 580px; } .w-fit { - width: -moz-fit-content; - width: fit-content; + width: -moz-fit-content; + width: fit-content; } .w-full { - width: 100%; + width: 100%; } .min-w-72 { - min-width: 18rem; + min-width: 18rem; } .max-w-screen-md { - max-width: 768px; + max-width: 768px; } .shrink-0 { - flex-shrink: 0; + flex-shrink: 0; } .grow { - flex-grow: 1; + flex-grow: 1; } .grow-0 { - flex-grow: 0; + flex-grow: 0; } .translate-x-3 { - --tw-translate-x: 0.75rem; - 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)); + --tw-translate-x: 0.75rem; + 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-y-0 { - --tw-translate-y: 0px; - 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)); + --tw-translate-y: 0px; + 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-y-3 { - --tw-translate-y: 0.75rem; - 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)); + --tw-translate-y: 0.75rem; + 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)); } .scale-100 { - --tw-scale-x: 1; - --tw-scale-y: 1; - 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)); + --tw-scale-x: 1; + --tw-scale-y: 1; + 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)); } .scale-110 { - --tw-scale-x: 1.1; - --tw-scale-y: 1.1; - 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)); + --tw-scale-x: 1.1; + --tw-scale-y: 1.1; + 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)); } .transform { - 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)); + 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)); } .cursor-pointer { - cursor: pointer; + cursor: pointer; } .select-none { - -webkit-user-select: none; - -moz-user-select: none; - user-select: none; + -webkit-user-select: none; + -moz-user-select: none; + user-select: none; } .resize-none { - resize: none; + resize: none; } .resize { - resize: both; + resize: both; } .flex-row { - flex-direction: row; + flex-direction: row; } .flex-col { - flex-direction: column; + flex-direction: column; } .flex-wrap { - flex-wrap: wrap; + flex-wrap: wrap; } .flex-nowrap { - flex-wrap: nowrap; + flex-wrap: nowrap; } .content-start { - align-content: flex-start; + align-content: flex-start; } .items-center { - align-items: center; + align-items: center; } .justify-center { - justify-content: center; + justify-content: center; } .justify-between { - justify-content: space-between; + justify-content: space-between; } .gap-2 { - gap: 0.5rem; + gap: 0.5rem; } .gap-4 { - gap: 1rem; + gap: 1rem; } .overflow-auto { - overflow: auto; + overflow: auto; } .overflow-hidden { - overflow: hidden; + overflow: hidden; } .overscroll-none { - overscroll-behavior: none; + overscroll-behavior: none; } .truncate { - overflow: hidden; - text-overflow: ellipsis; - white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; } .text-nowrap { - text-wrap: nowrap; + text-wrap: nowrap; } .rounded { - border-radius: 0.25rem; + border-radius: 0.25rem; } .rounded-full { - border-radius: 9999px; + border-radius: 9999px; } .rounded-lg { - border-radius: 0.5rem; + border-radius: 0.5rem; } .rounded-sm { - border-radius: 0.125rem; + border-radius: 0.125rem; } .border-2 { - border-width: 2px; + border-width: 2px; } .border-4 { - border-width: 4px; + border-width: 4px; } .border-l-4 { - border-left-width: 4px; + border-left-width: 4px; } .border-r { - border-right-width: 1px; + border-right-width: 1px; } .border-t-4 { - border-top-width: 4px; + border-top-width: 4px; } .border-dashed { - border-style: dashed; + border-style: dashed; } .border-black { - --tw-border-opacity: 1; - border-color: rgb(0 0 0 / var(--tw-border-opacity)); + --tw-border-opacity: 1; + border-color: rgb(0 0 0 / var(--tw-border-opacity)); } .border-gray-400 { - --tw-border-opacity: 1; - border-color: rgb(156 163 175 / var(--tw-border-opacity)); + --tw-border-opacity: 1; + border-color: rgb(156 163 175 / var(--tw-border-opacity)); } .border-gray-500 { - --tw-border-opacity: 1; - border-color: rgb(107 114 128 / var(--tw-border-opacity)); + --tw-border-opacity: 1; + border-color: rgb(107 114 128 / var(--tw-border-opacity)); } .border-indigo-800 { - --tw-border-opacity: 1; - border-color: rgb(55 48 163 / var(--tw-border-opacity)); + --tw-border-opacity: 1; + border-color: rgb(55 48 163 / var(--tw-border-opacity)); } .border-transparent { - border-color: transparent; + border-color: transparent; } .bg-black { - --tw-bg-opacity: 1; - background-color: rgb(0 0 0 / var(--tw-bg-opacity)); + --tw-bg-opacity: 1; + background-color: rgb(0 0 0 / var(--tw-bg-opacity)); } .bg-blue-200 { - --tw-bg-opacity: 1; - background-color: rgb(191 219 254 / var(--tw-bg-opacity)); + --tw-bg-opacity: 1; + background-color: rgb(191 219 254 / var(--tw-bg-opacity)); } .bg-blue-500 { - --tw-bg-opacity: 1; - background-color: rgb(59 130 246 / var(--tw-bg-opacity)); + --tw-bg-opacity: 1; + background-color: rgb(59 130 246 / var(--tw-bg-opacity)); } .bg-gray-100 { - --tw-bg-opacity: 1; - background-color: rgb(243 244 246 / var(--tw-bg-opacity)); + --tw-bg-opacity: 1; + background-color: rgb(243 244 246 / var(--tw-bg-opacity)); } .bg-gray-200 { - --tw-bg-opacity: 1; - background-color: rgb(229 231 235 / var(--tw-bg-opacity)); + --tw-bg-opacity: 1; + background-color: rgb(229 231 235 / var(--tw-bg-opacity)); } .bg-gray-500 { - --tw-bg-opacity: 1; - background-color: rgb(107 114 128 / var(--tw-bg-opacity)); + --tw-bg-opacity: 1; + background-color: rgb(107 114 128 / var(--tw-bg-opacity)); } .bg-green-200 { - --tw-bg-opacity: 1; - background-color: rgb(187 247 208 / var(--tw-bg-opacity)); + --tw-bg-opacity: 1; + background-color: rgb(187 247 208 / var(--tw-bg-opacity)); } .bg-green-500 { - --tw-bg-opacity: 1; - background-color: rgb(34 197 94 / var(--tw-bg-opacity)); + --tw-bg-opacity: 1; + background-color: rgb(34 197 94 / var(--tw-bg-opacity)); } .bg-red-400 { - --tw-bg-opacity: 1; - background-color: rgb(248 113 113 / var(--tw-bg-opacity)); + --tw-bg-opacity: 1; + background-color: rgb(248 113 113 / var(--tw-bg-opacity)); } .bg-red-500 { - --tw-bg-opacity: 1; - background-color: rgb(239 68 68 / var(--tw-bg-opacity)); + --tw-bg-opacity: 1; + background-color: rgb(239 68 68 / var(--tw-bg-opacity)); } .bg-transparent { - background-color: transparent; + background-color: transparent; } .bg-white { - --tw-bg-opacity: 1; - background-color: rgb(255 255 255 / var(--tw-bg-opacity)); + --tw-bg-opacity: 1; + background-color: rgb(255 255 255 / var(--tw-bg-opacity)); } .bg-yellow-100 { - --tw-bg-opacity: 1; - background-color: rgb(254 249 195 / var(--tw-bg-opacity)); + --tw-bg-opacity: 1; + background-color: rgb(254 249 195 / var(--tw-bg-opacity)); } .bg-yellow-500 { - --tw-bg-opacity: 1; - background-color: rgb(234 179 8 / var(--tw-bg-opacity)); + --tw-bg-opacity: 1; + background-color: rgb(234 179 8 / var(--tw-bg-opacity)); } .p-1 { - padding: 0.25rem; + padding: 0.25rem; } .p-2 { - padding: 0.5rem; + padding: 0.5rem; } .p-4 { - padding: 1rem; + padding: 1rem; } .px-2 { - padding-left: 0.5rem; - padding-right: 0.5rem; + padding-left: 0.5rem; + padding-right: 0.5rem; } .px-4 { - padding-left: 1rem; - padding-right: 1rem; + padding-left: 1rem; + padding-right: 1rem; } .py-1 { - padding-top: 0.25rem; - padding-bottom: 0.25rem; + padding-top: 0.25rem; + padding-bottom: 0.25rem; } .py-2 { - padding-top: 0.5rem; - padding-bottom: 0.5rem; + padding-top: 0.5rem; + padding-bottom: 0.5rem; } .pb-1 { - padding-bottom: 0.25rem; + padding-bottom: 0.25rem; } .pb-2 { - padding-bottom: 0.5rem; + padding-bottom: 0.5rem; } .pl-2 { - padding-left: 0.5rem; + padding-left: 0.5rem; } .pr-2 { - padding-right: 0.5rem; + padding-right: 0.5rem; } .text-left { - text-align: left; + text-align: left; } .text-center { - text-align: center; + text-align: center; } .align-middle { - vertical-align: middle; + vertical-align: middle; } .align-bottom { - vertical-align: bottom; + vertical-align: bottom; } .font-mono { - font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; + font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", + "Courier New", monospace; } .text-7xl { - font-size: 4.5rem; - line-height: 1; + font-size: 4.5rem; + line-height: 1; } .text-base { - font-size: 1rem; - line-height: 1.5rem; + font-size: 1rem; + line-height: 1.5rem; } .text-lg { - font-size: 1.125rem; - line-height: 1.75rem; + font-size: 1.125rem; + line-height: 1.75rem; } .text-sm { - font-size: 0.875rem; - line-height: 1.25rem; + font-size: 0.875rem; + line-height: 1.25rem; } .font-bold { - font-weight: 700; + font-weight: 700; } .font-extrabold { - font-weight: 800; + font-weight: 800; } .leading-none { - line-height: 1; + line-height: 1; } .text-black { - --tw-text-opacity: 1; - color: rgb(0 0 0 / var(--tw-text-opacity)); + --tw-text-opacity: 1; + color: rgb(0 0 0 / var(--tw-text-opacity)); } .text-blue-300 { - --tw-text-opacity: 1; - color: rgb(147 197 253 / var(--tw-text-opacity)); + --tw-text-opacity: 1; + color: rgb(147 197 253 / var(--tw-text-opacity)); } .text-gray-300 { - --tw-text-opacity: 1; - color: rgb(209 213 219 / var(--tw-text-opacity)); + --tw-text-opacity: 1; + color: rgb(209 213 219 / var(--tw-text-opacity)); } .text-gray-600 { - --tw-text-opacity: 1; - color: rgb(75 85 99 / var(--tw-text-opacity)); + --tw-text-opacity: 1; + color: rgb(75 85 99 / var(--tw-text-opacity)); } .text-white { - --tw-text-opacity: 1; - color: rgb(255 255 255 / var(--tw-text-opacity)); + --tw-text-opacity: 1; + color: rgb(255 255 255 / var(--tw-text-opacity)); } .opacity-0 { - opacity: 0; + opacity: 0; } .opacity-100 { - opacity: 1; + opacity: 1; } .shadow-lg { - --tw-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1); - --tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color); - box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow); + --tw-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1); + --tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), + 0 4px 6px -4px var(--tw-shadow-color); + box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), + var(--tw-shadow); } .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); + --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); } .drop-shadow-xl { - --tw-drop-shadow: drop-shadow(0 20px 13px rgb(0 0 0 / 0.03)) drop-shadow(0 8px 5px rgb(0 0 0 / 0.08)); - 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); + --tw-drop-shadow: drop-shadow(0 20px 13px rgb(0 0 0 / 0.03)) + drop-shadow(0 8px 5px rgb(0 0 0 / 0.08)); + 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); + 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); } .transition { - transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-backdrop-filter; - transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter; - transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-backdrop-filter; - transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); - transition-duration: 150ms; + transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, + opacity, box-shadow, transform, filter, -webkit-backdrop-filter; + transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, + opacity, box-shadow, transform, filter, backdrop-filter; + transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, + opacity, box-shadow, transform, filter, backdrop-filter, -webkit-backdrop-filter; + transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); + transition-duration: 150ms; } .transition-all { - transition-property: all; - transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); - transition-duration: 150ms; + transition-property: all; + transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); + transition-duration: 150ms; } .duration-100 { - transition-duration: 100ms; + transition-duration: 100ms; } .duration-500 { - transition-duration: 500ms; + transition-duration: 500ms; } .ease-in { - transition-timing-function: cubic-bezier(0.4, 0, 1, 1); + transition-timing-function: cubic-bezier(0.4, 0, 1, 1); } .ease-out { - transition-timing-function: cubic-bezier(0, 0, 0.2, 1); + transition-timing-function: cubic-bezier(0, 0, 0.2, 1); } /* @@ -1394,47 +1424,49 @@ body { */ .hover\:bg-gray-600:hover { - --tw-bg-opacity: 1; - background-color: rgb(75 85 99 / var(--tw-bg-opacity)); + --tw-bg-opacity: 1; + background-color: rgb(75 85 99 / var(--tw-bg-opacity)); } .hover\:bg-gray-800:hover { - --tw-bg-opacity: 1; - background-color: rgb(31 41 55 / var(--tw-bg-opacity)); + --tw-bg-opacity: 1; + background-color: rgb(31 41 55 / var(--tw-bg-opacity)); } .hover\:bg-red-800:hover { - --tw-bg-opacity: 1; - background-color: rgb(153 27 27 / var(--tw-bg-opacity)); + --tw-bg-opacity: 1; + background-color: rgb(153 27 27 / var(--tw-bg-opacity)); } .hover\:text-white:hover { - --tw-text-opacity: 1; - color: rgb(255 255 255 / var(--tw-text-opacity)); + --tw-text-opacity: 1; + color: rgb(255 255 255 / var(--tw-text-opacity)); } .hover\:shadow-lg:hover { - --tw-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1); - --tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color); - box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow); + --tw-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1); + --tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), + 0 4px 6px -4px var(--tw-shadow-color); + box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), + var(--tw-shadow); } .focus\:outline-none:focus { - outline: 2px solid transparent; - outline-offset: 2px; + outline: 2px solid transparent; + outline-offset: 2px; } @media (min-width: 640px) { - .sm\:p-3 { - padding: 0.75rem; - } - - .sm\:px-4 { - padding-left: 1rem; - padding-right: 1rem; - } - - .sm\:pb-5 { - padding-bottom: 1.25rem; - } + .sm\:p-3 { + padding: 0.75rem; + } + + .sm\:px-4 { + padding-left: 1rem; + padding-right: 1rem; + } + + .sm\:pb-5 { + padding-bottom: 1.25rem; + } }