diff --git a/internal/app/handlers/page_handler.go b/internal/app/handlers/page_handler.go new file mode 100644 index 0000000..309c071 --- /dev/null +++ b/internal/app/handlers/page_handler.go @@ -0,0 +1,14 @@ +package handlers + +import ( + "github.com/gin-gonic/gin" + layouts "github.com/haydenhargreaves/Potion/internal/templates/layouts" + pages "github.com/haydenhargreaves/Potion/internal/templates/pages" +) + +func LoginPage(ctx *gin.Context) { + title := "Potion - Login" + page := pages.LoginPage() + + ctx.HTML(200, "", layouts.AppLayout(title, page)) +} diff --git a/internal/templates/layouts/app_layout.templ b/internal/templates/layouts/app_layout.templ index e69de29..9df544e 100644 --- a/internal/templates/layouts/app_layout.templ +++ b/internal/templates/layouts/app_layout.templ @@ -0,0 +1,20 @@ +package templates + +// AppLayout is the main application layout, this does not contain any content other than +// meta data, links, scripts and whatever is passed into it as a component. +templ AppLayout(title string, child templ.Component) { + + + + + + + { title } + + + + + @child + + +} diff --git a/internal/templates/layouts/app_layout_templ.go b/internal/templates/layouts/app_layout_templ.go index 1d1995d..f7c4eee 100644 --- a/internal/templates/layouts/app_layout_templ.go +++ b/internal/templates/layouts/app_layout_templ.go @@ -1,10 +1,63 @@ // Code generated by templ - DO NOT EDIT. // templ: version: v0.3.865 +package templates //lint:file-ignore SA4006 This context is only used if a nested component is present. import "github.com/a-h/templ" import templruntime "github.com/a-h/templ/runtime" -var _ = templruntime.GeneratedTemplate \ No newline at end of file +// AppLayout is the main application layout, this does not contain any content other than +// meta data, links, scripts and whatever is passed into it as a component. +func AppLayout(title string, child templ.Component) templ.Component { + return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) { + templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context + if templ_7745c5c3_CtxErr := ctx.Err(); templ_7745c5c3_CtxErr != nil { + return templ_7745c5c3_CtxErr + } + templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W) + if !templ_7745c5c3_IsBuffer { + defer func() { + templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer) + if templ_7745c5c3_Err == nil { + templ_7745c5c3_Err = templ_7745c5c3_BufErr + } + }() + } + ctx = templ.InitializeContext(ctx) + templ_7745c5c3_Var1 := templ.GetChildren(ctx) + if templ_7745c5c3_Var1 == nil { + templ_7745c5c3_Var1 = templ.NopComponent + } + ctx = templ.ClearChildren(ctx) + templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 1, "") + if templ_7745c5c3_Err != nil { + return templ_7745c5c3_Err + } + var templ_7745c5c3_Var2 string + templ_7745c5c3_Var2, templ_7745c5c3_Err = templ.JoinStringErrs(title) + if templ_7745c5c3_Err != nil { + return templ.Error{Err: templ_7745c5c3_Err, FileName: `internal/templates/layouts/app_layout.templ`, Line: 12, Col: 16} + } + _, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var2)) + if templ_7745c5c3_Err != nil { + return templ_7745c5c3_Err + } + templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 2, "") + if templ_7745c5c3_Err != nil { + return templ_7745c5c3_Err + } + templ_7745c5c3_Err = child.Render(ctx, templ_7745c5c3_Buffer) + if templ_7745c5c3_Err != nil { + return templ_7745c5c3_Err + } + templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 3, "") + if templ_7745c5c3_Err != nil { + return templ_7745c5c3_Err + } + return nil + }) +} + +var _ = templruntime.GeneratedTemplate diff --git a/internal/templates/pages/login.templ b/internal/templates/pages/login.templ new file mode 100644 index 0000000..45b028a --- /dev/null +++ b/internal/templates/pages/login.templ @@ -0,0 +1,45 @@ +package templates + +templ LoginPage() { +
+
+
+
+

+ Sign in to Continue +

+

+ You need to sign in to continue. Don't have an account? Signing in will + create one for you! +

+
+
+ + + + + + + + Sign in with Google + +
+
+
+
+} diff --git a/internal/templates/pages/login_templ.go b/internal/templates/pages/login_templ.go new file mode 100644 index 0000000..cc8c7ab --- /dev/null +++ b/internal/templates/pages/login_templ.go @@ -0,0 +1,40 @@ +// Code generated by templ - DO NOT EDIT. + +// templ: version: v0.3.865 +package templates + +//lint:file-ignore SA4006 This context is only used if a nested component is present. + +import "github.com/a-h/templ" +import templruntime "github.com/a-h/templ/runtime" + +func LoginPage() templ.Component { + return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) { + templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context + if templ_7745c5c3_CtxErr := ctx.Err(); templ_7745c5c3_CtxErr != nil { + return templ_7745c5c3_CtxErr + } + templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W) + if !templ_7745c5c3_IsBuffer { + defer func() { + templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer) + if templ_7745c5c3_Err == nil { + templ_7745c5c3_Err = templ_7745c5c3_BufErr + } + }() + } + ctx = templ.InitializeContext(ctx) + templ_7745c5c3_Var1 := templ.GetChildren(ctx) + if templ_7745c5c3_Var1 == nil { + templ_7745c5c3_Var1 = templ.NopComponent + } + ctx = templ.ClearChildren(ctx) + templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 1, "

Sign in to Continue

You need to sign in to continue. Don't have an account? Signing in will create one for you!

Sign in with Google
") + if templ_7745c5c3_Err != nil { + return templ_7745c5c3_Err + } + return nil + }) +} + +var _ = templruntime.GeneratedTemplate diff --git a/web/static/css/main.css b/web/static/css/main.css index f1d8c73..fc92c62 100644 --- a/web/static/css/main.css +++ b/web/static/css/main.css @@ -1 +1,3 @@ @import "tailwindcss"; +@source "./internal/templates/**/*.templ"; +@plugin "daisyui"; diff --git a/web/static/css/tailwind.css b/web/static/css/tailwind.css index c5ce61b..9759576 100644 --- a/web/static/css/tailwind.css +++ b/web/static/css/tailwind.css @@ -1,13 +1,63 @@ -/*! tailwindcss v4.1.8 | MIT License | https://tailwindcss.com */ +/*! tailwindcss v4.1.10 | MIT License | https://tailwindcss.com */ @layer properties; @layer theme, base, components, utilities; @layer theme { :root, :host { --font-sans: ui-sans-serif, system-ui, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji'; + --font-serif: ui-serif, Georgia, Cambria, 'Times New Roman', Times, serif; --font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, 'Liberation Mono', 'Courier New', monospace; --color-red-500: oklch(63.7% 0.237 25.331); + --color-red-600: oklch(57.7% 0.245 27.325); + --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-purple-700: oklch(49.6% 0.265 301.924); + --color-purple-800: oklch(43.8% 0.218 303.724); + --color-purple-900: oklch(38.1% 0.176 304.987); + --color-purple-950: oklch(29.1% 0.149 302.717); + --color-pink-100: oklch(94.8% 0.028 342.258); + --color-pink-200: oklch(89.9% 0.061 343.231); + --color-pink-400: oklch(71.8% 0.202 349.761); + --color-gray-50: oklch(98.5% 0.002 247.839); + --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-600: oklch(44.6% 0.03 256.802); + --color-gray-800: oklch(27.8% 0.033 256.848); + --color-gray-900: oklch(21% 0.034 264.665); + --color-gray-950: oklch(13% 0.028 261.692); + --color-neutral-400: oklch(70.8% 0 0); + --color-neutral-500: oklch(55.6% 0 0); + --color-neutral-600: oklch(43.9% 0 0); + --color-neutral-700: oklch(37.1% 0 0); + --color-neutral-800: oklch(26.9% 0 0); + --color-neutral-900: oklch(20.5% 0 0); + --color-black: #000; + --color-white: #fff; + --spacing: 0.25rem; + --text-xs: 0.75rem; + --text-xs--line-height: calc(1 / 0.75); + --text-sm: 0.875rem; + --text-sm--line-height: calc(1.25 / 0.875); + --text-2xl: 1.5rem; + --text-2xl--line-height: calc(2 / 1.5); + --text-3xl: 1.875rem; + --text-3xl--line-height: calc(2.25 / 1.875); + --font-weight-medium: 500; + --font-weight-semibold: 600; + --font-weight-bold: 700; + --radius-sm: 0.25rem; + --radius-lg: 0.5rem; + --radius-xl: 0.75rem; + --blur-xs: 4px; + --blur-sm: 8px; + --blur-xl: 24px; + --blur-3xl: 64px; + --default-transition-duration: 150ms; + --default-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); --default-font-family: var(--font-sans); --default-mono-font-family: var(--font-mono); } @@ -158,44 +208,988 @@ } } @layer utilities { + .pointer-events-none { + pointer-events: none; + } + .absolute { + position: absolute; + } + .relative { + position: relative; + } .static { position: static; } + .inset-y-0 { + inset-block: calc(var(--spacing) * 0); + } + .end-0 { + inset-inline-end: calc(var(--spacing) * 0); + } + .my-2 { + margin-block: calc(var(--spacing) * 2); + } + .my-4 { + margin-block: calc(var(--spacing) * 4); + } + .my-5 { + margin-block: calc(var(--spacing) * 5); + } + .my-8 { + margin-block: calc(var(--spacing) * 8); + } + .my-10 { + margin-block: calc(var(--spacing) * 10); + } + .ms-3 { + margin-inline-start: calc(var(--spacing) * 3); + } + .mt-0 { + margin-top: calc(var(--spacing) * 0); + } + .mt-0\.5 { + margin-top: calc(var(--spacing) * 0.5); + } + .mt-2 { + margin-top: calc(var(--spacing) * 2); + } + .mt-5 { + margin-top: calc(var(--spacing) * 5); + } + .mt-7 { + margin-top: calc(var(--spacing) * 7); + } + .mt-8 { + margin-top: calc(var(--spacing) * 8); + } + .mt-10 { + margin-top: calc(var(--spacing) * 10); + } + .mt-14 { + margin-top: calc(var(--spacing) * 14); + } + .mb-2 { + margin-bottom: calc(var(--spacing) * 2); + } + .block { + display: block; + } + .flex { + display: flex; + } + .grid { + display: grid; + } .hidden { display: none; } + .inline-flex { + display: inline-flex; + } .table { display: table; } + .size-1 { + width: calc(var(--spacing) * 1); + height: calc(var(--spacing) * 1); + } + .size-1\/3 { + width: calc(1/3 * 100%); + height: calc(1/3 * 100%); + } + .size-5 { + width: calc(var(--spacing) * 5); + height: calc(var(--spacing) * 5); + } + .size-6 { + width: calc(var(--spacing) * 6); + height: calc(var(--spacing) * 6); + } + .size-10 { + width: calc(var(--spacing) * 10); + height: calc(var(--spacing) * 10); + } + .h-1 { + height: calc(var(--spacing) * 1); + } + .h-1\/2 { + height: calc(1/2 * 100%); + } + .h-auto { + height: auto; + } .h-screen { height: 100vh; } + .w-1 { + width: calc(var(--spacing) * 1); + } + .w-1\/2 { + width: calc(1/2 * 100%); + } + .w-1\/3 { + width: calc(1/3 * 100%); + } + .w-1\/4 { + width: calc(1/4 * 100%); + } + .w-2 { + width: calc(var(--spacing) * 2); + } + .w-2\/5 { + width: calc(2/5 * 100%); + } + .w-2\/7 { + width: calc(2/7 * 100%); + } + .w-3 { + width: calc(var(--spacing) * 3); + } + .w-3\/4 { + width: calc(3/4 * 100%); + } + .w-4 { + width: calc(var(--spacing) * 4); + } + .w-4\/5 { + width: calc(4/5 * 100%); + } .w-full { width: 100%; } + .flex-shrink { + flex-shrink: 1; + } + .shrink-0 { + flex-shrink: 0; + } + .border-collapse { + border-collapse: collapse; + } + .transform { + transform: var(--tw-rotate-x,) var(--tw-rotate-y,) var(--tw-rotate-z,) var(--tw-skew-x,) var(--tw-skew-y,); + } + .resize { + resize: both; + } + .flex-col { + flex-direction: column; + } + .flex-wrap { + flex-wrap: wrap; + } + .place-items-center { + place-items: center; + } + .items-center { + align-items: center; + } + .justify-between { + justify-content: space-between; + } + .justify-center { + justify-content: center; + } + .justify-evenly { + justify-content: space-evenly; + } + .gap-2 { + gap: calc(var(--spacing) * 2); + } + .gap-4 { + gap: calc(var(--spacing) * 4); + } + .gap-x-1 { + column-gap: calc(var(--spacing) * 1); + } + .gap-x-2 { + column-gap: calc(var(--spacing) * 2); + } + .gap-y-4 { + row-gap: calc(var(--spacing) * 4); + } + .rounded-lg { + border-radius: var(--radius-lg); + } + .rounded-sm { + border-radius: var(--radius-sm); + } + .rounded-xl { + border-radius: var(--radius-xl); + } .border { border-style: var(--tw-border-style); border-width: 1px; } + .border-2 { + border-style: var(--tw-border-style); + border-width: 2px; + } + .border-4 { + border-style: var(--tw-border-style); + border-width: 4px; + } + .border-gray-200 { + border-color: var(--color-gray-200); + } + .border-gray-300 { + border-color: var(--color-gray-300); + } + .border-purple-700 { + border-color: var(--color-purple-700); + } + .border-purple-900 { + border-color: var(--color-purple-900); + } + .border-red-500 { + border-color: var(--color-red-500); + } + .border-transparent { + border-color: transparent; + } + .bg-\[\#0F0A26\] { + background-color: #0F0A26; + } + .bg-\[\#120B2A\] { + background-color: #120B2A; + } + .bg-\[\#FF0A26\] { + background-color: #FF0A26; + } + .bg-blue-600 { + background-color: var(--color-blue-600); + } + .bg-gray-50 { + background-color: var(--color-gray-50); + } + .bg-gray-100 { + background-color: var(--color-gray-100); + } + .bg-gray-200 { + background-color: var(--color-gray-200); + } + .bg-gray-800 { + background-color: var(--color-gray-800); + } + .bg-gray-900 { + background-color: var(--color-gray-900); + } + .bg-gray-950 { + background-color: var(--color-gray-950); + } + .bg-pink-100 { + background-color: var(--color-pink-100); + } + .bg-pink-200 { + background-color: var(--color-pink-200); + } + .bg-pink-400 { + background-color: var(--color-pink-400); + } .bg-red-500 { background-color: var(--color-red-500); } + .bg-white { + background-color: var(--color-white); + } + .bg-gradient-to-b { + --tw-gradient-position: to bottom in oklab; + background-image: linear-gradient(var(--tw-gradient-stops)); + } + .bg-radial { + --tw-gradient-position: in oklab; + background-image: radial-gradient(var(--tw-gradient-stops)); + } + .bg-radial-\[at_25\%_25\%\] { + --tw-gradient-position: at 25% 25%; + background-image: radial-gradient(var(--tw-gradient-stops,at 25% 25%)); + } + .bg-radial-\[at_75\%_75\%\] { + --tw-gradient-position: at 75% 75%; + background-image: radial-gradient(var(--tw-gradient-stops,at 75% 75%)); + } + .from-gray-800 { + --tw-gradient-from: var(--color-gray-800); + --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position)); + } + .from-gray-950 { + --tw-gradient-from: var(--color-gray-950); + --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position)); + } + .from-pink-100 { + --tw-gradient-from: var(--color-pink-100); + --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position)); + } + .from-purple-700 { + --tw-gradient-from: var(--color-purple-700); + --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position)); + } + .from-purple-800 { + --tw-gradient-from: var(--color-purple-800); + --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position)); + } + .from-purple-900 { + --tw-gradient-from: var(--color-purple-900); + --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position)); + } + .from-purple-950 { + --tw-gradient-from: var(--color-purple-950); + --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position)); + } + .to-black { + --tw-gradient-to: var(--color-black); + --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position)); + } + .to-gray-950 { + --tw-gradient-to: var(--color-gray-950); + --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position)); + } + .to-purple-900 { + --tw-gradient-to: var(--color-purple-900); + --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position)); + } + .to-red-500 { + --tw-gradient-to: var(--color-red-500); + --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position)); + } + .p-4 { + padding: calc(var(--spacing) * 4); + } + .p-5 { + padding: calc(var(--spacing) * 5); + } + .p-10 { + padding: calc(var(--spacing) * 10); + } + .p-14 { + padding: calc(var(--spacing) * 14); + } + .p-44 { + padding: calc(var(--spacing) * 44); + } + .px-4 { + padding-inline: calc(var(--spacing) * 4); + } + .py-2 { + padding-block: calc(var(--spacing) * 2); + } + .py-2\.5 { + padding-block: calc(var(--spacing) * 2.5); + } + .py-3 { + padding-block: calc(var(--spacing) * 3); + } + .py-4 { + padding-block: calc(var(--spacing) * 4); + } + .pe-3 { + padding-inline-end: calc(var(--spacing) * 3); + } + .text-center { + text-align: center; + } + .text-left { + text-align: left; + } + .font-mono { + font-family: var(--font-mono); + } + .font-serif { + font-family: var(--font-serif); + } + .text-2xl { + font-size: var(--text-2xl); + line-height: var(--tw-leading, var(--text-2xl--line-height)); + } + .text-3xl { + font-size: var(--text-3xl); + line-height: var(--tw-leading, var(--text-3xl--line-height)); + } + .text-sm { + font-size: var(--text-sm); + line-height: var(--tw-leading, var(--text-sm--line-height)); + } + .text-xs { + font-size: var(--text-xs); + line-height: var(--tw-leading, var(--text-xs--line-height)); + } + .font-bold { + --tw-font-weight: var(--font-weight-bold); + font-weight: var(--font-weight-bold); + } + .font-medium { + --tw-font-weight: var(--font-weight-medium); + font-weight: var(--font-weight-medium); + } + .font-semibold { + --tw-font-weight: var(--font-weight-semibold); + font-weight: var(--font-weight-semibold); + } + .text-blue-600 { + color: var(--color-blue-600); + } + .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-600 { + color: var(--color-gray-600); + } + .text-gray-800 { + color: var(--color-gray-800); + } .text-red-500 { color: var(--color-red-500); } + .text-red-600 { + color: var(--color-red-600); + } + .text-white { + color: var(--color-white); + } + .uppercase { + text-transform: uppercase; + } + .italic { + font-style: italic; + } + .underline { + text-decoration-line: underline; + } + .decoration-2 { + text-decoration-thickness: 2px; + } + .shadow-lg\/50 { + --tw-shadow-alpha: 50%; + --tw-shadow: 0 10px 15px -3px var(--tw-shadow-color, oklab(from rgb(0 0 0 / 0.1) l a b / 50%)), 0 4px 6px -4px var(--tw-shadow-color, oklab(from rgb(0 0 0 / 0.1) l a b / 50%)); + 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\/20 { + --tw-shadow-alpha: 20%; + --tw-shadow: 0 20px 25px -5px var(--tw-shadow-color, oklab(from rgb(0 0 0 / 0.1) l a b / 20%)), 0 8px 10px -6px var(--tw-shadow-color, oklab(from rgb(0 0 0 / 0.1) l a b / 20%)); + 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\/50 { + --tw-shadow-alpha: 50%; + --tw-shadow: 0 20px 25px -5px var(--tw-shadow-color, oklab(from rgb(0 0 0 / 0.1) l a b / 50%)), 0 8px 10px -6px var(--tw-shadow-color, oklab(from rgb(0 0 0 / 0.1) l a b / 50%)); + box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); + } + .shadow-2xl { + --tw-shadow: 0 25px 50px -12px var(--tw-shadow-color, rgb(0 0 0 / 0.25)); + box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); + } + .shadow-2xs { + --tw-shadow: 0 1px var(--tw-shadow-color, rgb(0 0 0 / 0.05)); + box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); + } + .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-2 { + --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + 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); + } + .shadow-black { + --tw-shadow-color: #000; + @supports (color: color-mix(in lab, red, red)) { + --tw-shadow-color: color-mix(in oklab, var(--color-black) var(--tw-shadow-alpha), transparent); + } + } + .shadow-purple-800 { + --tw-shadow-color: oklch(43.8% 0.218 303.724); + @supports (color: color-mix(in lab, red, red)) { + --tw-shadow-color: color-mix(in oklab, var(--color-purple-800) var(--tw-shadow-alpha), transparent); + } + } + .shadow-purple-900 { + --tw-shadow-color: oklch(38.1% 0.176 304.987); + @supports (color: color-mix(in lab, red, red)) { + --tw-shadow-color: color-mix(in oklab, var(--color-purple-900) var(--tw-shadow-alpha), transparent); + } + } + .shadow-purple-950 { + --tw-shadow-color: oklch(29.1% 0.149 302.717); + @supports (color: color-mix(in lab, red, red)) { + --tw-shadow-color: color-mix(in oklab, var(--color-purple-950) var(--tw-shadow-alpha), transparent); + } + } + .ring-black { + --tw-ring-color: var(--color-black); + } + .ring-red-500 { + --tw-ring-color: var(--color-red-500); + } .outline { outline-style: var(--tw-outline-style); outline-width: 1px; } + .blur-3xl { + --tw-blur: blur(var(--blur-3xl)); + 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,); + } + .blur-sm { + --tw-blur: blur(var(--blur-sm)); + 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,); + } + .blur-xl { + --tw-blur: blur(var(--blur-xl)); + 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,); + } + .blur-xs { + --tw-blur: blur(var(--blur-xs)); + 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,); } + .transition-all { + transition-property: all; + 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; + } + .before\:me-6 { + &::before { + content: var(--tw-content); + margin-inline-end: calc(var(--spacing) * 6); + } + } + .before\:flex-1 { + &::before { + content: var(--tw-content); + flex: 1; + } + } + .before\:border-t { + &::before { + content: var(--tw-content); + border-top-style: var(--tw-border-style); + border-top-width: 1px; + } + } + .before\:border-gray-200 { + &::before { + content: var(--tw-content); + border-color: var(--color-gray-200); + } + } + .after\:ms-6 { + &::after { + content: var(--tw-content); + margin-inline-start: calc(var(--spacing) * 6); + } + } + .after\:flex-1 { + &::after { + content: var(--tw-content); + flex: 1; + } + } + .after\:border-t { + &::after { + content: var(--tw-content); + border-top-style: var(--tw-border-style); + border-top-width: 1px; + } + } + .after\:border-gray-200 { + &::after { + content: var(--tw-content); + border-color: var(--color-gray-200); + } + } + .hover\:bg-blue-700 { + &:hover { + @media (hover: hover) { + background-color: var(--color-blue-700); + } + } + } + .hover\:bg-gray-50 { + &:hover { + @media (hover: hover) { + background-color: var(--color-gray-50); + } + } + } + .hover\:bg-gray-800 { + &:hover { + @media (hover: hover) { + background-color: var(--color-gray-800); + } + } + } + .hover\:underline { + &:hover { + @media (hover: hover) { + text-decoration-line: underline; + } + } + } + .focus\:border-blue-500 { + &:focus { + border-color: var(--color-blue-500); + } + } + .focus\:bg-blue-700 { + &:focus { + background-color: var(--color-blue-700); + } + } + .focus\:bg-gray-50 { + &:focus { + background-color: var(--color-gray-50); + } + } + .focus\:underline { + &:focus { + text-decoration-line: underline; + } + } + .focus\:ring-blue-500 { + &:focus { + --tw-ring-color: var(--color-blue-500); + } + } + .focus\:outline-hidden { + &:focus { + --tw-outline-style: none; + outline-style: none; + @media (forced-colors: active) { + outline: 2px solid transparent; + outline-offset: 2px; + } + } + } + .disabled\:pointer-events-none { + &:disabled { + pointer-events: none; + } + } + .disabled\:opacity-50 { + &:disabled { + opacity: 50%; + } + } + .sm\:w-3\/4 { + @media (width >= 40rem) { + width: calc(3/4 * 100%); + } + } + .sm\:p-7 { + @media (width >= 40rem) { + padding: calc(var(--spacing) * 7); + } + } + .sm\:py-3 { + @media (width >= 40rem) { + padding-block: calc(var(--spacing) * 3); + } + } + .sm\:text-sm { + @media (width >= 40rem) { + font-size: var(--text-sm); + line-height: var(--tw-leading, var(--text-sm--line-height)); + } + } + .md\:w-1\/2 { + @media (width >= 48rem) { + width: calc(1/2 * 100%); + } + } + .md\:w-1\/3 { + @media (width >= 48rem) { + width: calc(1/3 * 100%); + } + } + .lg\:w-1\/2 { + @media (width >= 64rem) { + width: calc(1/2 * 100%); + } + } + .lg\:w-1\/3 { + @media (width >= 64rem) { + width: calc(1/3 * 100%); + } + } + .lg\:w-1\/4 { + @media (width >= 64rem) { + width: calc(1/4 * 100%); + } + } + .lg\:w-2\/5 { + @media (width >= 64rem) { + width: calc(2/5 * 100%); + } + } + .lg\:w-2\/7 { + @media (width >= 64rem) { + width: calc(2/7 * 100%); + } + } + .dark\:border-neutral-700 { + @media (prefers-color-scheme: dark) { + border-color: var(--color-neutral-700); + } + } + .dark\:bg-neutral-800 { + @media (prefers-color-scheme: dark) { + background-color: var(--color-neutral-800); + } + } + .dark\:bg-neutral-900 { + @media (prefers-color-scheme: dark) { + background-color: var(--color-neutral-900); + } + } + .dark\:text-blue-500 { + @media (prefers-color-scheme: dark) { + color: var(--color-blue-500); + } + } + .dark\:text-neutral-400 { + @media (prefers-color-scheme: dark) { + color: var(--color-neutral-400); + } + } + .dark\:text-neutral-500 { + @media (prefers-color-scheme: dark) { + color: var(--color-neutral-500); + } + } + .dark\:text-white { + @media (prefers-color-scheme: dark) { + color: var(--color-white); + } + } + .dark\:placeholder-neutral-500 { + @media (prefers-color-scheme: dark) { + &::placeholder { + color: var(--color-neutral-500); + } + } + } + .dark\:before\:border-neutral-600 { + @media (prefers-color-scheme: dark) { + &::before { + content: var(--tw-content); + border-color: var(--color-neutral-600); + } + } + } + .dark\:after\:border-neutral-600 { + @media (prefers-color-scheme: dark) { + &::after { + content: var(--tw-content); + border-color: var(--color-neutral-600); + } + } + } + .dark\:checked\:border-blue-500 { + @media (prefers-color-scheme: dark) { + &:checked { + border-color: var(--color-blue-500); + } + } + } + .dark\:checked\:bg-blue-500 { + @media (prefers-color-scheme: dark) { + &:checked { + background-color: var(--color-blue-500); + } + } + } + .dark\:hover\:bg-neutral-800 { + @media (prefers-color-scheme: dark) { + &:hover { + @media (hover: hover) { + background-color: var(--color-neutral-800); + } + } + } + } + .dark\:focus\:bg-neutral-800 { + @media (prefers-color-scheme: dark) { + &:focus { + background-color: var(--color-neutral-800); + } + } + } + .dark\:focus\:ring-neutral-600 { + @media (prefers-color-scheme: dark) { + &:focus { + --tw-ring-color: var(--color-neutral-600); + } + } + } + .dark\:focus\:ring-offset-gray-800 { + @media (prefers-color-scheme: dark) { + &:focus { + --tw-ring-offset-color: var(--color-gray-800); + } + } + } +} +@property --tw-rotate-x { + syntax: "*"; + inherits: false; +} +@property --tw-rotate-y { + syntax: "*"; + inherits: false; +} +@property --tw-rotate-z { + syntax: "*"; + inherits: false; +} +@property --tw-skew-x { + syntax: "*"; + inherits: false; +} +@property --tw-skew-y { + syntax: "*"; + inherits: false; } @property --tw-border-style { syntax: "*"; inherits: false; initial-value: solid; } +@property --tw-gradient-position { + syntax: "*"; + inherits: false; +} +@property --tw-gradient-from { + syntax: ""; + inherits: false; + initial-value: #0000; +} +@property --tw-gradient-via { + syntax: ""; + inherits: false; + initial-value: #0000; +} +@property --tw-gradient-to { + syntax: ""; + inherits: false; + initial-value: #0000; +} +@property --tw-gradient-stops { + syntax: "*"; + inherits: false; +} +@property --tw-gradient-via-stops { + syntax: "*"; + inherits: false; +} +@property --tw-gradient-from-position { + syntax: ""; + inherits: false; + initial-value: 0%; +} +@property --tw-gradient-via-position { + syntax: ""; + inherits: false; + initial-value: 50%; +} +@property --tw-gradient-to-position { + syntax: ""; + inherits: false; + initial-value: 100%; +} +@property --tw-font-weight { + syntax: "*"; + inherits: false; +} +@property --tw-shadow { + syntax: "*"; + inherits: false; + initial-value: 0 0 #0000; +} +@property --tw-shadow-color { + syntax: "*"; + inherits: false; +} +@property --tw-shadow-alpha { + syntax: ""; + inherits: false; + initial-value: 100%; +} +@property --tw-inset-shadow { + syntax: "*"; + inherits: false; + initial-value: 0 0 #0000; +} +@property --tw-inset-shadow-color { + syntax: "*"; + inherits: false; +} +@property --tw-inset-shadow-alpha { + syntax: ""; + inherits: false; + initial-value: 100%; +} +@property --tw-ring-color { + syntax: "*"; + inherits: false; +} +@property --tw-ring-shadow { + syntax: "*"; + inherits: false; + initial-value: 0 0 #0000; +} +@property --tw-inset-ring-color { + syntax: "*"; + inherits: false; +} +@property --tw-inset-ring-shadow { + syntax: "*"; + inherits: false; + initial-value: 0 0 #0000; +} +@property --tw-ring-inset { + syntax: "*"; + inherits: false; +} +@property --tw-ring-offset-width { + syntax: ""; + inherits: false; + initial-value: 0px; +} +@property --tw-ring-offset-color { + syntax: "*"; + inherits: false; + initial-value: #fff; +} +@property --tw-ring-offset-shadow { + syntax: "*"; + inherits: false; + initial-value: 0 0 #0000; +} @property --tw-outline-style { syntax: "*"; inherits: false; @@ -254,10 +1248,48 @@ syntax: "*"; inherits: false; } +@property --tw-duration { + syntax: "*"; + inherits: false; +} +@property --tw-content { + syntax: "*"; + initial-value: ""; + inherits: false; +} @layer properties { @supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))) { *, ::before, ::after, ::backdrop { + --tw-rotate-x: initial; + --tw-rotate-y: initial; + --tw-rotate-z: initial; + --tw-skew-x: initial; + --tw-skew-y: initial; --tw-border-style: solid; + --tw-gradient-position: initial; + --tw-gradient-from: #0000; + --tw-gradient-via: #0000; + --tw-gradient-to: #0000; + --tw-gradient-stops: initial; + --tw-gradient-via-stops: initial; + --tw-gradient-from-position: 0%; + --tw-gradient-via-position: 50%; + --tw-gradient-to-position: 100%; + --tw-font-weight: initial; + --tw-shadow: 0 0 #0000; + --tw-shadow-color: initial; + --tw-shadow-alpha: 100%; + --tw-inset-shadow: 0 0 #0000; + --tw-inset-shadow-color: initial; + --tw-inset-shadow-alpha: 100%; + --tw-ring-color: initial; + --tw-ring-shadow: 0 0 #0000; + --tw-inset-ring-color: initial; + --tw-inset-ring-shadow: 0 0 #0000; + --tw-ring-inset: initial; + --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; @@ -272,6 +1304,8 @@ --tw-drop-shadow-color: initial; --tw-drop-shadow-alpha: 100%; --tw-drop-shadow-size: initial; + --tw-duration: initial; + --tw-content: ""; } } }