diff --git a/public/css/style.min.css b/public/css/style.min.css index ba5b479..4f4c478 100644 --- a/public/css/style.min.css +++ b/public/css/style.min.css @@ -1,4 +1,4 @@ -/*! tailwindcss v4.1.11 | MIT License | https://tailwindcss.com */ +/*! tailwindcss v4.1.8 | MIT License | https://tailwindcss.com */ @layer properties; @layer theme, base, components, utilities; @layer theme { @@ -7,14 +7,11 @@ "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"; --font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; - --color-red-400: oklch(70.4% 0.191 22.216); --color-red-500: oklch(63.7% 0.237 25.331); --color-red-600: oklch(57.7% 0.245 27.325); --color-red-700: oklch(50.5% 0.213 27.518); - --color-yellow-400: oklch(85.2% 0.199 91.936); + --color-yellow-500: oklch(79.5% 0.184 86.047); --color-yellow-600: oklch(68.1% 0.162 75.834); - --color-yellow-700: oklch(55.4% 0.135 66.442); - --color-green-400: oklch(79.2% 0.209 151.711); --color-green-600: oklch(62.7% 0.194 149.214); --color-green-700: oklch(52.7% 0.154 150.069); --color-teal-400: oklch(77.7% 0.152 181.912); @@ -26,10 +23,10 @@ --color-blue-500: oklch(62.3% 0.214 259.815); --color-blue-600: oklch(54.6% 0.245 262.881); --color-blue-700: oklch(48.8% 0.243 264.376); + --color-blue-800: oklch(42.4% 0.199 265.638); + --color-blue-900: oklch(37.9% 0.146 265.522); --color-purple-600: oklch(55.8% 0.288 302.321); --color-purple-700: oklch(49.6% 0.265 301.924); - --color-gray-100: oklch(96.7% 0.003 264.542); - --color-gray-200: oklch(92.8% 0.006 264.531); --color-gray-300: oklch(87.2% 0.01 258.338); --color-gray-400: oklch(70.7% 0.022 261.325); --color-gray-500: oklch(55.1% 0.027 264.364); @@ -42,7 +39,6 @@ --spacing: 0.25rem; --container-md: 28rem; --container-xl: 36rem; - --container-2xl: 42rem; --container-7xl: 80rem; --text-xs: 0.75rem; --text-xs--line-height: calc(1 / 0.75); @@ -58,6 +54,8 @@ --text-2xl--line-height: calc(2 / 1.5); --text-3xl: 1.875rem; --text-3xl--line-height: calc(2.25 / 1.875); + --text-4xl: 2.25rem; + --text-4xl--line-height: calc(2.5 / 2.25); --text-5xl: 3rem; --text-5xl--line-height: 1; --font-weight-medium: 500; @@ -65,14 +63,13 @@ --font-weight-bold: 700; --tracking-wide: 0.025em; --leading-relaxed: 1.625; + --radius-sm: 0.25rem; --radius-md: 0.375rem; --radius-lg: 0.5rem; --radius-xl: 0.75rem; - --radius-2xl: 1rem; + --ease-out: cubic-bezier(0, 0, 0.2, 1); --ease-in-out: cubic-bezier(0.4, 0, 0.2, 1); --animate-spin: spin 1s linear infinite; - --animate-pulse: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite; - --blur-md: 12px; --blur-xl: 24px; --default-transition-duration: 150ms; --default-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); @@ -226,15 +223,6 @@ } } @layer utilities { - .collapse { - visibility: collapse; - } - .invisible { - visibility: hidden; - } - .visible { - visibility: visible; - } .absolute { position: absolute; } @@ -247,20 +235,11 @@ .static { position: static; } - .sticky { - position: sticky; - } .inset-0 { inset: calc(var(--spacing) * 0); } - .right-4 { - right: calc(var(--spacing) * 4); - } - .bottom-4 { - bottom: calc(var(--spacing) * 4); - } - .z-10 { - z-index: 10; + .z-2 { + z-index: 2; } .z-50 { z-index: 50; @@ -298,9 +277,6 @@ .mt-4 { margin-top: calc(var(--spacing) * 4); } - .mt-6 { - margin-top: calc(var(--spacing) * 6); - } .mr-2 { margin-right: calc(var(--spacing) * 2); } @@ -337,9 +313,6 @@ .block { display: block; } - .contents { - display: contents; - } .flex { display: flex; } @@ -349,20 +322,14 @@ .hidden { display: none; } - .inline { - display: inline; - } .inline-block { display: inline-block; } - .table { - display: table; - } .h-0\.5 { height: calc(var(--spacing) * 0.5); } - .h-5 { - height: calc(var(--spacing) * 5); + .h-4 { + height: calc(var(--spacing) * 4); } .h-10 { height: calc(var(--spacing) * 10); @@ -376,9 +343,6 @@ .h-full { height: 100%; } - .max-h-\[95vh\] { - max-height: 95vh; - } .max-h-\[calc\(95vh-10rem\)\] { max-height: calc(95vh - 10rem); } @@ -391,8 +355,8 @@ .w-2\/3 { width: calc(2/3 * 100%); } - .w-5 { - width: calc(var(--spacing) * 5); + .w-4 { + width: calc(var(--spacing) * 4); } .w-6 { width: calc(var(--spacing) * 6); @@ -409,36 +373,27 @@ .w-full { width: 100%; } - .max-w-2xl { - max-width: var(--container-2xl); - } .max-w-7xl { max-width: var(--container-7xl); } - .max-w-\[95\%\] { - max-width: 95%; - } - .max-w-full { - max-width: 100%; - } .max-w-md { max-width: var(--container-md); } + .min-w-0 { + min-width: calc(var(--spacing) * 0); + } + .min-w-\[250px\] { + min-width: 250px; + } .flex-1 { flex: 1; } .flex-grow { flex-grow: 1; } - .grow { - flex-grow: 1; - } .transform { transform: var(--tw-rotate-x,) var(--tw-rotate-y,) var(--tw-rotate-z,) var(--tw-skew-x,) var(--tw-skew-y,); } - .animate-pulse { - animation: var(--animate-pulse); - } .cursor-not-allowed { cursor: not-allowed; } @@ -460,6 +415,9 @@ .flex-col { flex-direction: column; } + .flex-row { + flex-direction: row; + } .flex-wrap { flex-wrap: wrap; } @@ -478,33 +436,12 @@ .justify-end { justify-content: flex-end; } - .justify-start { - justify-content: flex-start; - } .gap-2 { gap: calc(var(--spacing) * 2); } .gap-4 { gap: calc(var(--spacing) * 4); } - .gap-5 { - gap: calc(var(--spacing) * 5); - } - .gap-6 { - gap: calc(var(--spacing) * 6); - } - .gap-8 { - gap: calc(var(--spacing) * 8); - } - .gap-10 { - gap: calc(var(--spacing) * 10); - } - .gap-15 { - gap: calc(var(--spacing) * 15); - } - .gap-20 { - gap: calc(var(--spacing) * 20); - } .space-y-1 { :where(& > :not(:last-child)) { --tw-space-y-reverse: 0; @@ -526,13 +463,6 @@ margin-block-end: calc(calc(var(--spacing) * 4) * calc(1 - var(--tw-space-y-reverse))); } } - .space-y-6 { - :where(& > :not(:last-child)) { - --tw-space-y-reverse: 0; - margin-block-start: calc(calc(var(--spacing) * 6) * var(--tw-space-y-reverse)); - margin-block-end: calc(calc(var(--spacing) * 6) * calc(1 - var(--tw-space-y-reverse))); - } - } .space-x-1 { :where(& > :not(:last-child)) { --tw-space-x-reverse: 0; @@ -547,6 +477,13 @@ margin-inline-end: calc(calc(var(--spacing) * 2) * calc(1 - var(--tw-space-x-reverse))); } } + .space-x-3 { + :where(& > :not(:last-child)) { + --tw-space-x-reverse: 0; + margin-inline-start: calc(calc(var(--spacing) * 3) * var(--tw-space-x-reverse)); + margin-inline-end: calc(calc(var(--spacing) * 3) * calc(1 - var(--tw-space-x-reverse))); + } + } .space-x-4 { :where(& > :not(:last-child)) { --tw-space-x-reverse: 0; @@ -554,26 +491,15 @@ margin-inline-end: calc(calc(var(--spacing) * 4) * calc(1 - var(--tw-space-x-reverse))); } } - .truncate { - overflow: hidden; - text-overflow: ellipsis; - white-space: nowrap; - } .overflow-x-auto { overflow-x: auto; } - .overflow-x-hidden { - overflow-x: hidden; - } .overflow-y-auto { overflow-y: auto; } .rounded { border-radius: 0.25rem; } - .rounded-2xl { - border-radius: var(--radius-2xl); - } .rounded-full { border-radius: calc(infinity * 1px); } @@ -598,14 +524,17 @@ border-bottom-style: var(--tw-border-style); border-bottom-width: 1px; } - .border-gray-500 { - border-color: var(--color-gray-500); + .border-\[rgba\(255\,255\,255\,0\.12\)\] { + border-color: rgba(255,255,255,0.12); } - .border-gray-600 { - border-color: var(--color-gray-600); + .border-\[rgba\(255\,255\,255\,0\.15\)\] { + border-color: rgba(255,255,255,0.15); } - .\!bg-transparent { - background-color: transparent !important; + .bg-\[rgba\(10\,17\,40\,0\.3\)\] { + background-color: rgba(10,17,40,0.3); + } + .bg-\[rgba\(10\,17\,40\,0\.75\)\] { + background-color: rgba(10,17,40,0.75); } .bg-black { background-color: var(--color-black); @@ -622,28 +551,13 @@ .bg-gray-700 { background-color: var(--color-gray-700); } - .bg-gray-700\/50 { - background-color: color-mix(in srgb, oklch(37.3% 0.034 259.733) 50%, transparent); - @supports (color: color-mix(in lab, red, red)) { - background-color: color-mix(in oklab, var(--color-gray-700) 50%, transparent); - } - } .bg-gray-800 { background-color: var(--color-gray-800); } - .bg-gray-800\/50 { - background-color: color-mix(in srgb, oklch(27.8% 0.033 256.848) 50%, transparent); + .bg-gray-800\/40 { + background-color: color-mix(in srgb, oklch(27.8% 0.033 256.848) 40%, transparent); @supports (color: color-mix(in lab, red, red)) { - background-color: color-mix(in oklab, var(--color-gray-800) 50%, transparent); - } - } - .bg-gray-900 { - background-color: var(--color-gray-900); - } - .bg-gray-900\/20 { - background-color: color-mix(in srgb, oklch(21% 0.034 264.665) 20%, transparent); - @supports (color: color-mix(in lab, red, red)) { - background-color: color-mix(in oklab, var(--color-gray-900) 20%, transparent); + background-color: color-mix(in oklab, var(--color-gray-800) 40%, transparent); } } .bg-green-600 { @@ -661,15 +575,9 @@ .bg-teal-600 { background-color: var(--color-teal-600); } - .bg-transparent { - background-color: transparent; - } .bg-white { background-color: var(--color-white); } - .bg-yellow-600 { - background-color: var(--color-yellow-600); - } .bg-gradient-to-r { --tw-gradient-position: to right in oklab; background-image: linear-gradient(var(--tw-gradient-stops)); @@ -697,9 +605,6 @@ .p-6 { padding: calc(var(--spacing) * 6); } - .p-8 { - padding: calc(var(--spacing) * 8); - } .px-1 { padding-inline: calc(var(--spacing) * 1); } @@ -712,30 +617,18 @@ .px-4 { padding-inline: calc(var(--spacing) * 4); } - .px-6 { - padding-inline: calc(var(--spacing) * 6); - } .py-1 { padding-block: calc(var(--spacing) * 1); } .py-2 { padding-block: calc(var(--spacing) * 2); } - .py-3 { - padding-block: calc(var(--spacing) * 3); - } - .py-4 { - padding-block: calc(var(--spacing) * 4); - } .py-8 { padding-block: calc(var(--spacing) * 8); } .py-16 { padding-block: calc(var(--spacing) * 16); } - .pb-2 { - padding-bottom: calc(var(--spacing) * 2); - } .pb-16 { padding-bottom: calc(var(--spacing) * 16); } @@ -806,30 +699,18 @@ .whitespace-pre-wrap { white-space: pre-wrap; } + .text-\[\#e0e7ff\] { + color: #e0e7ff; + } .text-blue-400 { color: var(--color-blue-400); } - .text-gray-100 { - color: var(--color-gray-100); - } - .text-gray-200 { - color: var(--color-gray-200); - } .text-gray-300 { color: var(--color-gray-300); } .text-gray-400 { color: var(--color-gray-400); } - .text-gray-900 { - color: var(--color-gray-900); - } - .text-green-400 { - color: var(--color-green-400); - } - .text-red-400 { - color: var(--color-red-400); - } .text-red-500 { color: var(--color-red-500); } @@ -842,74 +723,24 @@ .text-white { color: var(--color-white); } - .text-yellow-400 { - color: var(--color-yellow-400); - } - .lowercase { - text-transform: lowercase; - } - .uppercase { - text-transform: uppercase; - } .underline { text-decoration-line: underline; } - .placeholder-gray-400 { - &::placeholder { - color: var(--color-gray-400); - } - } .opacity-50 { opacity: 50%; } .opacity-90 { opacity: 90%; } - .shadow-lg { - --tw-shadow: 0 10px 15px -3px var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 4px 6px -4px var(--tw-shadow-color, rgb(0 0 0 / 0.1)); - box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); - } .shadow-md { --tw-shadow: 0 4px 6px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 2px 4px -2px var(--tw-shadow-color, rgb(0 0 0 / 0.1)); box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } - .shadow-sm { - --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1)); - box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); - } - .shadow-xl { - --tw-shadow: 0 20px 25px -5px var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 8px 10px -6px var(--tw-shadow-color, rgb(0 0 0 / 0.1)); - box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); - } - .ring-1 { - --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor); - box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); - } - .ring-gray-600\/50 { - --tw-ring-color: color-mix(in srgb, oklch(44.6% 0.03 256.802) 50%, transparent); - @supports (color: color-mix(in lab, red, red)) { - --tw-ring-color: color-mix(in oklab, var(--color-gray-600) 50%, transparent); - } - } - .ring-gray-700\/50 { - --tw-ring-color: color-mix(in srgb, oklch(37.3% 0.034 259.733) 50%, transparent); - @supports (color: color-mix(in lab, red, red)) { - --tw-ring-color: color-mix(in oklab, var(--color-gray-700) 50%, transparent); - } - } - .outline { - outline-style: var(--tw-outline-style); - outline-width: 1px; - } - .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,); - } .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-blur-md { - --tw-backdrop-blur: blur(var(--blur-md)); + .backdrop-blur-\[12px\] { + --tw-backdrop-blur: blur(12px); -webkit-backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,); backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,); } @@ -932,6 +763,16 @@ transition-timing-function: var(--tw-ease, var(--default-transition-timing-function)); transition-duration: var(--tw-duration, var(--default-transition-duration)); } + .transition-colors { + transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to; + transition-timing-function: var(--tw-ease, var(--default-transition-timing-function)); + transition-duration: var(--tw-duration, var(--default-transition-duration)); + } + .transition-shadow { + transition-property: box-shadow; + transition-timing-function: var(--tw-ease, var(--default-transition-timing-function)); + transition-duration: var(--tw-duration, var(--default-transition-duration)); + } .duration-200 { --tw-duration: 200ms; transition-duration: 200ms; @@ -944,14 +785,9 @@ --tw-ease: var(--ease-in-out); transition-timing-function: var(--ease-in-out); } - .select-all { - -webkit-user-select: all; - user-select: all; - } - .autofill\:bg-transparent { - &:autofill { - background-color: transparent; - } + .ease-out { + --tw-ease: var(--ease-out); + transition-timing-function: var(--ease-out); } .hover\:bg-blue-700 { &:hover { @@ -967,26 +803,6 @@ } } } - .hover\:bg-gray-600\/30 { - &:hover { - @media (hover: hover) { - background-color: color-mix(in srgb, oklch(44.6% 0.03 256.802) 30%, transparent); - @supports (color: color-mix(in lab, red, red)) { - background-color: color-mix(in oklab, var(--color-gray-600) 30%, transparent); - } - } - } - } - .hover\:bg-gray-600\/50 { - &:hover { - @media (hover: hover) { - background-color: color-mix(in srgb, oklch(44.6% 0.03 256.802) 50%, transparent); - @supports (color: color-mix(in lab, red, red)) { - background-color: color-mix(in oklab, var(--color-gray-600) 50%, transparent); - } - } - } - } .hover\:bg-gray-700 { &:hover { @media (hover: hover) { @@ -1022,13 +838,6 @@ } } } - .hover\:bg-yellow-700 { - &:hover { - @media (hover: hover) { - background-color: var(--color-yellow-700); - } - } - } .hover\:bg-gradient-to-r { &:hover { @media (hover: hover) { @@ -1053,10 +862,10 @@ } } } - .hover\:text-blue-500 { + .hover\:text-blue-400 { &:hover { @media (hover: hover) { - color: var(--color-blue-500); + color: var(--color-blue-400); } } } @@ -1067,13 +876,6 @@ } } } - .hover\:text-white { - &:hover { - @media (hover: hover) { - color: var(--color-white); - } - } - } .hover\:underline { &:hover { @media (hover: hover) { @@ -1089,83 +891,20 @@ } } } - .focus\:border-blue-500 { - &:focus { - border-color: var(--color-blue-500); - } - } - .focus\:bg-transparent { - &:focus { - background-color: transparent; - } - } - .focus\:ring-blue-500 { - &:focus { - --tw-ring-color: var(--color-blue-500); - } - } .focus\:outline-none { &:focus { --tw-outline-style: none; outline-style: none; } } - .active\:bg-transparent { - &:active { - background-color: transparent; - } - } - .sm\:w-\[90\%\] { - @media (width >= 40rem) { - width: 90%; - } - } - .sm\:grid-cols-2 { - @media (width >= 40rem) { - grid-template-columns: repeat(2, minmax(0, 1fr)); - } - } - .sm\:p-4 { - @media (width >= 40rem) { - padding: calc(var(--spacing) * 4); - } - } - .sm\:p-6 { - @media (width >= 40rem) { - padding: calc(var(--spacing) * 6); - } - } - .sm\:p-8 { - @media (width >= 40rem) { - padding: calc(var(--spacing) * 8); - } - } - .sm\:p-10 { - @media (width >= 40rem) { - padding: calc(var(--spacing) * 10); - } - } .sm\:px-6 { @media (width >= 40rem) { padding-inline: calc(var(--spacing) * 6); } } - .sm\:text-2xl { - @media (width >= 40rem) { - font-size: var(--text-2xl); - line-height: var(--tw-leading, var(--text-2xl--line-height)); - } - } - .sm\:text-base { - @media (width >= 40rem) { - font-size: var(--text-base); - line-height: var(--tw-leading, var(--text-base--line-height)); - } - } - .sm\:text-xl { - @media (width >= 40rem) { - font-size: var(--text-xl); - line-height: var(--tw-leading, var(--text-xl--line-height)); + .md\:mt-0 { + @media (width >= 48rem) { + margin-top: calc(var(--spacing) * 0); } } .md\:flex { @@ -1178,36 +917,11 @@ display: none; } } - .md\:w-\[85\%\] { - @media (width >= 48rem) { - width: 85%; - } - } .md\:grid-cols-2 { @media (width >= 48rem) { grid-template-columns: repeat(2, minmax(0, 1fr)); } } - .md\:grid-cols-3 { - @media (width >= 48rem) { - grid-template-columns: repeat(3, minmax(0, 1fr)); - } - } - .lg\:w-\[80\%\] { - @media (width >= 64rem) { - width: 80%; - } - } - .lg\:grid-cols-2 { - @media (width >= 64rem) { - grid-template-columns: repeat(2, minmax(0, 1fr)); - } - } - .lg\:grid-cols-4 { - @media (width >= 64rem) { - grid-template-columns: repeat(4, minmax(0, 1fr)); - } - } .lg\:px-8 { @media (width >= 64rem) { padding-inline: calc(var(--spacing) * 8); @@ -1448,11 +1162,6 @@ input:-internal-autofill-selected, input:-webkit-autofill, input:-webkit-autofil inherits: false; initial-value: 0 0 #0000; } -@property --tw-outline-style { - syntax: "*"; - inherits: false; - initial-value: solid; -} @property --tw-blur { syntax: "*"; inherits: false; @@ -1597,7 +1306,6 @@ input:-internal-autofill-selected, input:-webkit-autofill, input:-webkit-autofil --tw-ring-offset-width: 0px; --tw-ring-offset-color: #fff; --tw-ring-offset-shadow: 0 0 #0000; - --tw-outline-style: solid; --tw-blur: initial; --tw-brightness: initial; --tw-contrast: initial;