H0llyW00dzZ/templui
H0llyW00dzZ/templui
1
0
Fork 0
mirror of https://github.com/axzilla/templui.git synced 2025-02-21 00:32:58 +00:00
Code

change: remove children from button and use icon props instead

Browse Source
This commit is contained in:
“axzilla” 2024-10-10 21:34:43 +02:00
parent 6684f6bb45
commit be5b3ef490
8 changed files with 302 additions and 294 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

110
assets/css/output.css
View File

@ -674,6 +674,10 @@ body {
left: 0px;
}
.left-full {
left: 100%;
}
.right-0 {
right: 0px;
}
@ -719,10 +723,6 @@ body {
margin-right: auto;
}
.-mr-1 {
margin-right: -0.25rem;
}
.mb-1 {
margin-bottom: 0.25rem;
}
@ -759,8 +759,8 @@ body {
margin-left: 0.25rem;
}
.ml-2 {
margin-left: 0.5rem;
.ml-auto {
margin-left: auto;
}
.mr-2 {
@ -839,10 +839,6 @@ body {
height: 1.25rem;
}
.h-6 {
height: 1.5rem;
}
.h-7 {
height: 1.75rem;
}
@ -899,18 +895,10 @@ body {
width: 75%;
}
.w-5 {
width: 1.25rem;
}
.w-56 {
width: 14rem;
}
.w-6 {
width: 1.5rem;
}
.w-64 {
width: 16rem;
}
@ -1027,6 +1015,10 @@ body {
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-not-allowed {
cursor: not-allowed;
}
.cursor-pointer {
cursor: pointer;
}
@ -1231,11 +1223,6 @@ body {
border-color: hsl(var(--foreground) / var(--tw-border-opacity));
}
.border-gray-300 {
--tw-border-opacity: 1;
border-color: rgb(209 213 219 / var(--tw-border-opacity));
}
.border-input {
--tw-border-opacity: 1;
border-color: hsl(var(--input) / var(--tw-border-opacity));
@ -1325,10 +1312,6 @@ body {
--tw-gradient-to: #fff var(--tw-gradient-to-position);
}
.fill-current {
fill: currentColor;
}
.object-contain {
-o-object-fit: contain;
object-fit: contain;
@ -1590,6 +1573,16 @@ body {
color: hsl(var(--muted-foreground) / var(--tw-text-opacity));
}
.text-neutral-400 {
--tw-text-opacity: 1;
color: rgb(163 163 163 / var(--tw-text-opacity));
}
.text-neutral-700 {
--tw-text-opacity: 1;
color: rgb(64 64 64 / var(--tw-text-opacity));
}
.text-popover-foreground {
--tw-text-opacity: 1;
color: hsl(var(--popover-foreground) / var(--tw-text-opacity));
@ -1805,11 +1798,6 @@ body {
background-color: rgb(243 244 246 / var(--tw-bg-opacity));
}
.hover\:bg-gray-50:hover {
--tw-bg-opacity: 1;
background-color: rgb(249 250 251 / var(--tw-bg-opacity));
}
.hover\:bg-gray-600:hover {
--tw-bg-opacity: 1;
background-color: rgb(75 85 99 / var(--tw-bg-opacity));
@ -1820,6 +1808,11 @@ body {
background-color: hsl(var(--muted) / var(--tw-bg-opacity));
}
.hover\:bg-neutral-100:hover {
--tw-bg-opacity: 1;
background-color: rgb(245 245 245 / var(--tw-bg-opacity));
}
.hover\:bg-primary\/90:hover {
background-color: hsl(var(--primary) / 0.9);
}
@ -1848,16 +1841,16 @@ body {
color: rgb(107 114 128 / var(--tw-text-opacity));
}
.hover\:text-gray-900:hover {
--tw-text-opacity: 1;
color: rgb(17 24 39 / var(--tw-text-opacity));
}
.hover\:text-green-700:hover {
--tw-text-opacity: 1;
color: rgb(21 128 61 / var(--tw-text-opacity));
}
.hover\:text-neutral-900:hover {
--tw-text-opacity: 1;
color: rgb(23 23 23 / var(--tw-text-opacity));
}
.hover\:text-primary\/80:hover {
color: hsl(var(--primary) / 0.8);
}
@ -1890,10 +1883,6 @@ body {
--tw-ring-color: rgb(99 102 241 / var(--tw-ring-opacity));
}
.focus\:ring-offset-2:focus {
--tw-ring-offset-width: 2px;
}
.focus-visible\:outline-none:focus-visible {
outline: 2px solid transparent;
outline-offset: 2px;
@ -1926,6 +1915,10 @@ body {
opacity: 0.5;
}
.group:hover .group-hover\:block {
display: block;
}
.group:hover .group-hover\:translate-x-0 {
--tw-translate-x: 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));
@ -1948,14 +1941,9 @@ body {
opacity: 0.7;
}
.dark\:border-gray-600:is(.dark *) {
--tw-border-opacity: 1;
border-color: rgb(75 85 99 / var(--tw-border-opacity));
}
.dark\:bg-gray-800:is(.dark *) {
.dark\:bg-neutral-800:is(.dark *) {
--tw-bg-opacity: 1;
background-color: rgb(31 41 55 / var(--tw-bg-opacity));
background-color: rgb(38 38 38 / var(--tw-bg-opacity));
}
.dark\:from-gray-900:is(.dark *) {
@ -1983,14 +1971,24 @@ body {
color: rgb(156 163 175 / var(--tw-text-opacity));
}
.dark\:text-neutral-200:is(.dark *) {
--tw-text-opacity: 1;
color: rgb(229 229 229 / var(--tw-text-opacity));
}
.dark\:text-neutral-500:is(.dark *) {
--tw-text-opacity: 1;
color: rgb(115 115 115 / var(--tw-text-opacity));
}
.dark\:text-white:is(.dark *) {
--tw-text-opacity: 1;
color: rgb(255 255 255 / var(--tw-text-opacity));
}
.dark\:ring-gray-700:is(.dark *) {
.dark\:ring-neutral-700:is(.dark *) {
--tw-ring-opacity: 1;
--tw-ring-color: rgb(55 65 81 / var(--tw-ring-opacity));
--tw-ring-color: rgb(64 64 64 / var(--tw-ring-opacity));
}
.dark\:file\:text-foreground:is(.dark *)::file-selector-button {
@ -2003,14 +2001,14 @@ body {
background-color: rgb(55 65 81 / var(--tw-bg-opacity));
}
.dark\:hover\:text-white:hover:is(.dark *) {
--tw-text-opacity: 1;
color: rgb(255 255 255 / var(--tw-text-opacity));
.dark\:hover\:bg-neutral-800:hover:is(.dark *) {
--tw-bg-opacity: 1;
background-color: rgb(38 38 38 / var(--tw-bg-opacity));
}
.dark\:focus\:ring-indigo-400:focus:is(.dark *) {
--tw-ring-opacity: 1;
--tw-ring-color: rgb(129 140 248 / var(--tw-ring-opacity));
.dark\:hover\:text-neutral-50:hover:is(.dark *) {
--tw-text-opacity: 1;
color: rgb(250 250 250 / var(--tw-text-opacity));
}
@media (min-width: 640px) {

20
internals/ui/showcase/button.templ
View File

@ -22,9 +22,7 @@ templ ButtonShowcase() {
@components.Button(components.ButtonProps{Text: "Default"})
@components.Button(components.ButtonProps{Text: "Small", Size: components.Sm})
@components.Button(components.ButtonProps{Text: "Large", Size: components.Lg})
@components.Button(components.ButtonProps{Size: components.ButtonIcon}) {
@components.Icon(components.IconProps{Name: "rocket", Size: "16"})
}
@components.Button(components.ButtonProps{Size: components.ButtonIcon, IconLeft: components.Icon(components.IconProps{Name: "rocket", Size: "16"})})
</div>
</div>
<div class="mb-8">
@ -43,14 +41,14 @@ templ ButtonShowcase() {
<div class="mb-8">
<h2 class="font-semibold mb-2">With Icon</h2>
<div class="flex flex-wrap gap-2">
@components.Button(components.ButtonProps{Class: "flex gap-2"}) {
@components.Icon(components.IconProps{Name: "rocket", Size: "16"})
Icon Left
}
@components.Button(components.ButtonProps{Class: "flex gap-2"}) {
Icon Right
@components.Icon(components.IconProps{Name: "rocket", Size: "16"})
}
@components.Button(components.ButtonProps{
Text: "Icon Left",
IconLeft: components.Icon(components.IconProps{Name: "rocket", Size: "16"}),
})
@components.Button(components.ButtonProps{
Text: "Icon Left",
IconRight: components.Icon(components.IconProps{Name: "rocket", Size: "16"}),
})
</div>
</div>
</div>

53
pkg/components/button.templ
View File

@ -63,6 +63,14 @@ type ButtonProps struct {
// Attributes allows passing additional HTML attributes to the button or anchor element.
// Default: nil
Attributes templ.Attributes
// IconLeft specifies an icon component to be displayed on the left side of the button text.
// Default: nil
IconLeft templ.Component
// IconRight specifies an icon component to be displayed on the right side of the button text.
// Default: nil
IconRight templ.Component
}
// getVariantClasses returns the CSS classes for the given button variant.
@ -102,16 +110,18 @@ func getSizeClasses(size ButtonSize) string {
//
// Usage:
//
// @components.Button(components.ButtonProps{
// Text: "Click me",
// Variant: components.Primary,
// Size: components.Md,
// FullWidth: false,
// Attributes: templ.Attributes{
// "aria-label": "Click this button",
// "data-testid": "main-button",
// },
// })
// @components.Button(components.ButtonProps{
// Text: "Click me",
// Variant: components.Primary,
// Size: components.Md,
// FullWidth: false,
// IconLeft: components.Icon(components.IconProps{Name: "user"}),
// IconRight: components.Icon(components.IconProps{Name: "arrow-right"}),
// Attributes: templ.Attributes{
// "aria-label": "Click this button",
// "data-testid": "main-button",
// },
// })
//
// Props:
// - Class: Additional CSS classes to apply to the button. Default: "" (empty string)
@ -124,6 +134,8 @@ func getSizeClasses(size ButtonSize) string {
// - Disabled: Can be either a bool or a string. If bool (Go), it directly controls the disabled state. If string, it's treated as a JavaScript expression for dynamic disabling. Default: nil
// - Type: The type of the button. Default: "button"
// - Attributes: Additional HTML attributes to apply to the button or anchor element. Default: nil
// - IconLeft: An icon component to be displayed on the left side of the button text. Default: nil
// - IconRight: An icon component to be displayed on the right side of the button text. Default: nil
templ Button(props ButtonProps) {
if props.Href != "" {
<a
@ -147,21 +159,21 @@ templ Button(props ButtonProps) {
}
{ props.Attributes... }
>
{ props.Text }
{ children... }
@renderButtonContent(props)
</a>
} else {
<button
class={
"inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium ring-offset-background transition-colors",
"focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2",
"focus-visible:outline-none focus-visible:ring-2 focus-ring-ring focus-visible:ring-offset-2",
"disabled:pointer-events-none disabled:opacity-50",
getVariantClasses(props.Variant),
getSizeClasses(props.Size),
templ.KV("w-full", props.FullWidth),
props.Class,
}
if props.Type == "" {
if props.Type != "" {
type={ props.Type }
}
if props.Disabled != nil {
@ -174,8 +186,21 @@ templ Button(props ButtonProps) {
}
{ props.Attributes... }
>
{ props.Text }
{ children... }
@renderButtonContent(props)
</button>
}
}
// renderButtonContent renders the content of the button, including icons and text
templ renderButtonContent(props ButtonProps) {
<span class="flex gap-2 items-center">
if props.IconLeft != nil {
@props.IconLeft
}
{ props.Text }
if props.IconRight != nil {
@props.IconRight
}
</span>
}

123
pkg/components/button_templ.go
View File

@ -71,6 +71,14 @@ type ButtonProps struct {
// Attributes allows passing additional HTML attributes to the button or anchor element.
// Default: nil
Attributes templ.Attributes
// IconLeft specifies an icon component to be displayed on the left side of the button text.
// Default: nil
IconLeft templ.Component
// IconRight specifies an icon component to be displayed on the right side of the button text.
// Default: nil
IconRight templ.Component
}
// getVariantClasses returns the CSS classes for the given button variant.
@ -115,6 +123,8 @@ func getSizeClasses(size ButtonSize) string {
// Variant: components.Primary,
// Size: components.Md,
// FullWidth: false,
// IconLeft: components.Icon(components.IconProps{Name: "user"}),
// IconRight: components.Icon(components.IconProps{Name: "arrow-right"}),
// Attributes: templ.Attributes{
// "aria-label": "Click this button",
// "data-testid": "main-button",
@ -132,6 +142,8 @@ func getSizeClasses(size ButtonSize) string {
// - Disabled: Can be either a bool or a string. If bool (Go), it directly controls the disabled state. If string, it's treated as a JavaScript expression for dynamic disabling. Default: nil
// - Type: The type of the button. Default: "button"
// - Attributes: Additional HTML attributes to apply to the button or anchor element. Default: nil
// - IconLeft: An icon component to be displayed on the left side of the button text. Default: nil
// - IconRight: An icon component to be displayed on the right side of the button text. Default: nil
func Button(props ButtonProps) 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
@ -182,7 +194,7 @@ func Button(props ButtonProps) templ.Component {
var templ_7745c5c3_Var4 string
templ_7745c5c3_Var4, templ_7745c5c3_Err = templ.JoinStringErrs(props.Target)
if templ_7745c5c3_Err != nil {
return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/components/button.templ`, Line: 131, Col: 24}
return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/components/button.templ`, Line: 143, Col: 24}
}
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var4))
if templ_7745c5c3_Err != nil {
@ -220,7 +232,7 @@ func Button(props ButtonProps) templ.Component {
var templ_7745c5c3_Var6 string
templ_7745c5c3_Var6, templ_7745c5c3_Err = templ.JoinStringErrs(disabledStr)
if templ_7745c5c3_Err != nil {
return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/components/button.templ`, Line: 145, Col: 33}
return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/components/button.templ`, Line: 157, Col: 33}
}
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var6))
if templ_7745c5c3_Err != nil {
@ -240,16 +252,11 @@ func Button(props ButtonProps) templ.Component {
if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err
}
var templ_7745c5c3_Var7 string
templ_7745c5c3_Var7, templ_7745c5c3_Err = templ.JoinStringErrs(props.Text)
if templ_7745c5c3_Err != nil {
return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/components/button.templ`, Line: 150, Col: 15}
}
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var7))
templ_7745c5c3_Err = templ_7745c5c3_Var1.Render(ctx, templ_7745c5c3_Buffer)
if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err
}
templ_7745c5c3_Err = templ_7745c5c3_Var1.Render(ctx, templ_7745c5c3_Buffer)
templ_7745c5c3_Err = renderButtonContent(props).Render(ctx, templ_7745c5c3_Buffer)
if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err
}
@ -258,16 +265,16 @@ func Button(props ButtonProps) templ.Component {
return templ_7745c5c3_Err
}
} else {
var templ_7745c5c3_Var8 = []any{
var templ_7745c5c3_Var7 = []any{
"inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium ring-offset-background transition-colors",
"focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2",
"focus-visible:outline-none focus-visible:ring-2 focus-ring-ring focus-visible:ring-offset-2",
"disabled:pointer-events-none disabled:opacity-50",
getVariantClasses(props.Variant),
getSizeClasses(props.Size),
templ.KV("w-full", props.FullWidth),
props.Class,
}
templ_7745c5c3_Err = templ.RenderCSSItems(ctx, templ_7745c5c3_Buffer, templ_7745c5c3_Var8...)
templ_7745c5c3_Err = templ.RenderCSSItems(ctx, templ_7745c5c3_Buffer, templ_7745c5c3_Var7...)
if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err
}
@ -275,12 +282,12 @@ func Button(props ButtonProps) templ.Component {
if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err
}
var templ_7745c5c3_Var9 string
templ_7745c5c3_Var9, templ_7745c5c3_Err = templ.JoinStringErrs(templ.CSSClasses(templ_7745c5c3_Var8).String())
var templ_7745c5c3_Var8 string
templ_7745c5c3_Var8, templ_7745c5c3_Err = templ.JoinStringErrs(templ.CSSClasses(templ_7745c5c3_Var7).String())
if templ_7745c5c3_Err != nil {
return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/components/button.templ`, Line: 1, Col: 0}
}
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var9))
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var8))
if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err
}
@ -288,17 +295,17 @@ func Button(props ButtonProps) templ.Component {
if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err
}
if props.Type == "" {
if props.Type != "" {
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(" type=\"")
if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err
}
var templ_7745c5c3_Var10 string
templ_7745c5c3_Var10, templ_7745c5c3_Err = templ.JoinStringErrs(props.Type)
var templ_7745c5c3_Var9 string
templ_7745c5c3_Var9, templ_7745c5c3_Err = templ.JoinStringErrs(props.Type)
if templ_7745c5c3_Err != nil {
return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/components/button.templ`, Line: 165, Col: 21}
return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/components/button.templ`, Line: 177, Col: 21}
}
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var10))
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var9))
if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err
}
@ -321,12 +328,12 @@ func Button(props ButtonProps) templ.Component {
if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err
}
var templ_7745c5c3_Var11 string
templ_7745c5c3_Var11, templ_7745c5c3_Err = templ.JoinStringErrs(disabledStr)
var templ_7745c5c3_Var10 string
templ_7745c5c3_Var10, templ_7745c5c3_Err = templ.JoinStringErrs(disabledStr)
if templ_7745c5c3_Err != nil {
return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/components/button.templ`, Line: 172, Col: 28}
return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/components/button.templ`, Line: 184, Col: 28}
}
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var11))
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var10))
if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err
}
@ -344,16 +351,11 @@ func Button(props ButtonProps) templ.Component {
if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err
}
var templ_7745c5c3_Var12 string
templ_7745c5c3_Var12, templ_7745c5c3_Err = templ.JoinStringErrs(props.Text)
if templ_7745c5c3_Err != nil {
return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/components/button.templ`, Line: 177, Col: 15}
}
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var12))
templ_7745c5c3_Err = templ_7745c5c3_Var1.Render(ctx, templ_7745c5c3_Buffer)
if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err
}
templ_7745c5c3_Err = templ_7745c5c3_Var1.Render(ctx, templ_7745c5c3_Buffer)
templ_7745c5c3_Err = renderButtonContent(props).Render(ctx, templ_7745c5c3_Buffer)
if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err
}
@ -366,4 +368,63 @@ func Button(props ButtonProps) templ.Component {
})
}
// renderButtonContent renders the content of the button, including icons and text
func renderButtonContent(props ButtonProps) 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_Var11 := templ.GetChildren(ctx)
if templ_7745c5c3_Var11 == nil {
templ_7745c5c3_Var11 = templ.NopComponent
}
ctx = templ.ClearChildren(ctx)
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("<span class=\"flex gap-2 items-center\">")
if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err
}
if props.IconLeft != nil {
templ_7745c5c3_Err = props.IconLeft.Render(ctx, templ_7745c5c3_Buffer)
if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err
}
}
var templ_7745c5c3_Var12 string
templ_7745c5c3_Var12, templ_7745c5c3_Err = templ.JoinStringErrs(props.Text)
if templ_7745c5c3_Err != nil {
return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/components/button.templ`, Line: 201, Col: 14}
}
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var12))
if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err
}
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(" ")
if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err
}
if props.IconRight != nil {
templ_7745c5c3_Err = props.IconRight.Render(ctx, templ_7745c5c3_Buffer)
if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err
}
}
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("</span>")
if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err
}
return templ_7745c5c3_Err
})
}
var _ = templruntime.GeneratedTemplate

88
pkg/components/navbar_templ.go
View File

@ -43,47 +43,11 @@ func Navbar() templ.Component {
if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err
}
templ_7745c5c3_Var2 := templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
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_Err = templ_7745c5c3_Buffer.WriteString("<svg class=\"fill-current h-6 w-6\" xmlns=\"http://www.w3.org/2000/svg\" x=\"0px\" y=\"0px\" width=\"100\" height=\"100\" viewBox=\"0 0 30 30\" fill=\"currentColor\"><path d=\"M15,3C8.373,3,3,8.373,3,15c0,5.623,3.872,10.328,9.092,11.63C12.036,26.468,12,26.28,12,26.047v-2.051 c-0.487,0-1.303,0-1.508,0c-0.821,0-1.551-0.353-1.905-1.009c-0.393-0.729-0.461-1.844-1.435-2.526 c-0.289-0.227-0.069-0.486,0.264-0.451c0.615,0.174,1.125,0.596,1.605,1.222c0.478,0.627,0.703,0.769,1.596,0.769 c0.433,0,1.081-0.025,1.691-0.121c0.328-0.833,0.895-1.6,1.588-1.962c-3.996-0.411-5.903-2.399-5.903-5.098 c0-1.162,0.495-2.286,1.336-3.233C9.053,10.647,8.706,8.73,9.435,8c1.798,0,2.885,1.166,3.146,1.481C13.477,9.174,14.461,9,15.495,9 c1.036,0,2.024,0.174,2.922,0.483C18.675,9.17,19.763,8,21.565,8c0.732,0.731,0.381,2.656,0.102,3.594 c0.836,0.945,1.328,2.066,1.328,3.226c0,2.697-1.904,4.684-5.894,5.097C18.199,20.49,19,22.1,19,23.313v2.734 c0,0.104-0.023,0.179-0.035,0.268C23.641,24.676,27,20.236,27,15C27,8.373,21.627,3,15,3z\"></path></svg>")
if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err
}
return templ_7745c5c3_Err
})
templ_7745c5c3_Err = Button(ButtonProps{Size: "icon", Variant: "ghost", Href: "https://github.com/axzilla/goilerplate", Target: "_blank"}).Render(templ.WithChildren(ctx, templ_7745c5c3_Var2), templ_7745c5c3_Buffer)
templ_7745c5c3_Err = Button(ButtonProps{Size: ButtonIcon, IconLeft: Icon(IconProps{Name: "github"}), Variant: "ghost", Href: "https://github.com/axzilla/goilerplate", Target: "_blank"}).Render(ctx, templ_7745c5c3_Buffer)
if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err
}
templ_7745c5c3_Var3 := templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
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_Err = templ_7745c5c3_Buffer.WriteString("<svg class=\"fill-current h-5 w-5\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 512 512\"><path d=\"M389.2 48h70.6L305.6 224.2 487 464H345L233.7 318.6 106.5 464H35.8L200.7 275.5 26.8 48H172.4L272.9 180.9 389.2 48zM364.4 421.8h39.1L151.1 88h-42L364.4 421.8z\"></path></svg>")
if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err
}
return templ_7745c5c3_Err
})
templ_7745c5c3_Err = Button(ButtonProps{Size: "icon", Variant: "ghost", Href: "https://x.com/_axzilla", Target: "_blank"}).Render(templ.WithChildren(ctx, templ_7745c5c3_Var3), templ_7745c5c3_Buffer)
templ_7745c5c3_Err = Button(ButtonProps{Size: ButtonIcon, IconLeft: Icon(IconProps{Name: "twitter"}), Variant: "ghost", Href: "https://x.com/_axzilla", Target: "_blank"}).Render(ctx, templ_7745c5c3_Buffer)
if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err
}
@ -115,12 +79,12 @@ func NavbarMobileMenu() templ.Component {
}()
}
ctx = templ.InitializeContext(ctx)
templ_7745c5c3_Var4 := templ.GetChildren(ctx)
if templ_7745c5c3_Var4 == nil {
templ_7745c5c3_Var4 = templ.NopComponent
templ_7745c5c3_Var2 := templ.GetChildren(ctx)
if templ_7745c5c3_Var2 == nil {
templ_7745c5c3_Var2 = templ.NopComponent
}
ctx = templ.ClearChildren(ctx)
templ_7745c5c3_Var5 := templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
templ_7745c5c3_Var3 := templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
if !templ_7745c5c3_IsBuffer {
@ -132,7 +96,7 @@ func NavbarMobileMenu() templ.Component {
}()
}
ctx = templ.InitializeContext(ctx)
templ_7745c5c3_Var6 := templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
templ_7745c5c3_Var4 := templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
if !templ_7745c5c3_IsBuffer {
@ -149,12 +113,12 @@ func NavbarMobileMenu() templ.Component {
if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err
}
var templ_7745c5c3_Var7 string
templ_7745c5c3_Var7, templ_7745c5c3_Err = templ.JoinStringErrs(section.Title)
var templ_7745c5c3_Var5 string
templ_7745c5c3_Var5, templ_7745c5c3_Err = templ.JoinStringErrs(section.Title)
if templ_7745c5c3_Err != nil {
return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/components/navbar.templ`, Line: 41, Col: 69}
return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/components/navbar.templ`, Line: 33, Col: 69}
}
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var7))
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var5))
if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err
}
@ -167,9 +131,9 @@ func NavbarMobileMenu() templ.Component {
if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err
}
var templ_7745c5c3_Var8 = []any{"text-sm flex items-center px-4 py-2 rounded-md text-gray-700 dark:text-gray-200",
var templ_7745c5c3_Var6 = []any{"text-sm flex items-center px-4 py-2 rounded-md text-gray-700 dark:text-gray-200",
"hover:bg-gray-100 dark:hover:bg-gray-700"}
templ_7745c5c3_Err = templ.RenderCSSItems(ctx, templ_7745c5c3_Buffer, templ_7745c5c3_Var8...)
templ_7745c5c3_Err = templ.RenderCSSItems(ctx, templ_7745c5c3_Buffer, templ_7745c5c3_Var6...)
if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err
}
@ -177,8 +141,8 @@ func NavbarMobileMenu() templ.Component {
if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err
}
var templ_7745c5c3_Var9 templ.SafeURL = templ.SafeURL(link.Href)
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(string(templ_7745c5c3_Var9)))
var templ_7745c5c3_Var7 templ.SafeURL = templ.SafeURL(link.Href)
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(string(templ_7745c5c3_Var7)))
if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err
}
@ -186,12 +150,12 @@ func NavbarMobileMenu() templ.Component {
if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err
}
var templ_7745c5c3_Var10 string
templ_7745c5c3_Var10, templ_7745c5c3_Err = templ.JoinStringErrs(templ.CSSClasses(templ_7745c5c3_Var8).String())
var templ_7745c5c3_Var8 string
templ_7745c5c3_Var8, templ_7745c5c3_Err = templ.JoinStringErrs(templ.CSSClasses(templ_7745c5c3_Var6).String())
if templ_7745c5c3_Err != nil {
return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/components/navbar.templ`, Line: 1, Col: 0}
}
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var10))
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var8))
if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err
}
@ -199,12 +163,12 @@ func NavbarMobileMenu() templ.Component {
if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err
}
var templ_7745c5c3_Var11 string
templ_7745c5c3_Var11, templ_7745c5c3_Err = templ.JoinStringErrs(link.Text)
var templ_7745c5c3_Var9 string
templ_7745c5c3_Var9, templ_7745c5c3_Err = templ.JoinStringErrs(link.Text)
if templ_7745c5c3_Err != nil {
return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/components/navbar.templ`, Line: 50, Col: 26}
return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/components/navbar.templ`, Line: 42, Col: 26}
}
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var11))
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var9))
if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err
}
@ -220,7 +184,7 @@ func NavbarMobileMenu() templ.Component {
}
return templ_7745c5c3_Err
})
templ_7745c5c3_Err = Sheet(SheetProps{Side: Left}).Render(templ.WithChildren(ctx, templ_7745c5c3_Var6), templ_7745c5c3_Buffer)
templ_7745c5c3_Err = Sheet(SheetProps{Side: Left}).Render(templ.WithChildren(ctx, templ_7745c5c3_Var4), templ_7745c5c3_Buffer)
if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err
}
@ -228,7 +192,7 @@ func NavbarMobileMenu() templ.Component {
if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err
}
templ_7745c5c3_Var12 := templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
templ_7745c5c3_Var10 := templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
if !templ_7745c5c3_IsBuffer {
@ -254,13 +218,13 @@ func NavbarMobileMenu() templ.Component {
}
return templ_7745c5c3_Err
})
templ_7745c5c3_Err = SheetTrigger(string(Left), Left).Render(templ.WithChildren(ctx, templ_7745c5c3_Var12), templ_7745c5c3_Buffer)
templ_7745c5c3_Err = SheetTrigger(string(Left), Left).Render(templ.WithChildren(ctx, templ_7745c5c3_Var10), templ_7745c5c3_Buffer)
if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err
}
return templ_7745c5c3_Err
})
templ_7745c5c3_Err = SheetRoot().Render(templ.WithChildren(ctx, templ_7745c5c3_Var5), templ_7745c5c3_Buffer)
templ_7745c5c3_Err = SheetRoot().Render(templ.WithChildren(ctx, templ_7745c5c3_Var3), templ_7745c5c3_Buffer)
if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err
}

27
pkg/components/themeswitcher.templ
View File

@ -2,17 +2,22 @@ package components
templ ThemeSwitcher() {
@Button(ButtonProps{
Size: "icon",
Variant: "ghost",
Attributes: templ.Attributes{"@click": "toggleTheme()"},
}) {
<div x-show="theme === 'dark'">
@LightIcon()
</div>
<div x-show="theme === 'light'">
@DarkIcon()
</div>
}
Size: ButtonIcon,
Variant: Ghost,
IconLeft: templ.Component(DynamicThemeIcon()),
Attributes: templ.Attributes{
"@click": "toggleTheme()",
},
})
}
templ DynamicThemeIcon() {
<span x-show="theme === 'dark'" class="block">
@LightIcon()
</span>
<span x-show="theme === 'light'" class="block">
@DarkIcon()
</span>
}
templ DarkIcon() {

90
pkg/components/themeswitcher_templ.go
View File

@ -29,45 +29,59 @@ func ThemeSwitcher() templ.Component {
templ_7745c5c3_Var1 = templ.NopComponent
}
ctx = templ.ClearChildren(ctx)
templ_7745c5c3_Var2 := templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
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_Err = templ_7745c5c3_Buffer.WriteString("<div x-show=\"theme === &#39;dark&#39;\">")
if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err
}
templ_7745c5c3_Err = LightIcon().Render(ctx, templ_7745c5c3_Buffer)
if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err
}
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("</div><div x-show=\"theme === &#39;light&#39;\">")
if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err
}
templ_7745c5c3_Err = DarkIcon().Render(ctx, templ_7745c5c3_Buffer)
if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err
}
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("</div>")
if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err
}
return templ_7745c5c3_Err
})
templ_7745c5c3_Err = Button(ButtonProps{
Size: "icon",
Variant: "ghost",
Attributes: templ.Attributes{"@click": "toggleTheme()"},
}).Render(templ.WithChildren(ctx, templ_7745c5c3_Var2), templ_7745c5c3_Buffer)
Size: ButtonIcon,
Variant: Ghost,
IconLeft: templ.Component(DynamicThemeIcon()),
Attributes: templ.Attributes{
"@click": "toggleTheme()",
},
}).Render(ctx, templ_7745c5c3_Buffer)
if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err
}
return templ_7745c5c3_Err
})
}
func DynamicThemeIcon() 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_Var2 := templ.GetChildren(ctx)
if templ_7745c5c3_Var2 == nil {
templ_7745c5c3_Var2 = templ.NopComponent
}
ctx = templ.ClearChildren(ctx)
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("<span x-show=\"theme === &#39;dark&#39;\" class=\"block\">")
if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err
}
templ_7745c5c3_Err = LightIcon().Render(ctx, templ_7745c5c3_Buffer)
if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err
}
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("</span> <span x-show=\"theme === &#39;light&#39;\" class=\"block\">")
if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err
}
templ_7745c5c3_Err = DarkIcon().Render(ctx, templ_7745c5c3_Buffer)
if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err
}
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString("</span>")
if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err
}

85
pkg/styles/goilerplate.css
View File

@ -666,6 +666,10 @@ body {
left: 0px;
}
.left-full {
left: 100%;
}
.right-0 {
right: 0px;
}
@ -695,10 +699,6 @@ body {
margin-right: auto;
}
.-mr-1 {
margin-right: -0.25rem;
}
.mb-1 {
margin-bottom: 0.25rem;
}
@ -719,8 +719,8 @@ body {
margin-left: 0.25rem;
}
.ml-2 {
margin-left: 0.5rem;
.ml-auto {
margin-left: auto;
}
.mr-2 {
@ -795,10 +795,6 @@ body {
height: 1.25rem;
}
.h-6 {
height: 1.5rem;
}
.h-7 {
height: 1.75rem;
}
@ -839,18 +835,10 @@ body {
width: 75%;
}
.w-5 {
width: 1.25rem;
}
.w-56 {
width: 14rem;
}
.w-6 {
width: 1.5rem;
}
.w-64 {
width: 16rem;
}
@ -933,6 +921,10 @@ body {
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-not-allowed {
cursor: not-allowed;
}
.cursor-pointer {
cursor: pointer;
}
@ -1097,11 +1089,6 @@ body {
border-color: hsl(var(--foreground) / var(--tw-border-opacity));
}
.border-gray-300 {
--tw-border-opacity: 1;
border-color: rgb(209 213 219 / var(--tw-border-opacity));
}
.border-input {
--tw-border-opacity: 1;
border-color: hsl(var(--input) / var(--tw-border-opacity));
@ -1163,19 +1150,10 @@ body {
background-color: hsl(var(--secondary) / var(--tw-bg-opacity));
}
.bg-white {
--tw-bg-opacity: 1;
background-color: rgb(255 255 255 / var(--tw-bg-opacity));
}
.bg-opacity-50 {
--tw-bg-opacity: 0.5;
}
.fill-current {
fill: currentColor;
}
.object-cover {
-o-object-fit: cover;
object-fit: cover;
@ -1584,11 +1562,6 @@ body {
background-color: rgb(243 244 246 / var(--tw-bg-opacity));
}
.hover\:bg-gray-50:hover {
--tw-bg-opacity: 1;
background-color: rgb(249 250 251 / var(--tw-bg-opacity));
}
.hover\:bg-muted:hover {
--tw-bg-opacity: 1;
background-color: hsl(var(--muted) / var(--tw-bg-opacity));
@ -1617,11 +1590,6 @@ body {
color: rgb(107 114 128 / var(--tw-text-opacity));
}
.hover\:text-gray-900:hover {
--tw-text-opacity: 1;
color: rgb(17 24 39 / var(--tw-text-opacity));
}
.hover\:text-primary\/80:hover {
color: hsl(var(--primary) / 0.8);
}
@ -1654,10 +1622,6 @@ body {
--tw-ring-color: rgb(99 102 241 / var(--tw-ring-opacity));
}
.focus\:ring-offset-2:focus {
--tw-ring-offset-width: 2px;
}
.focus-visible\:outline-none:focus-visible {
outline: 2px solid transparent;
outline-offset: 2px;
@ -1690,6 +1654,10 @@ body {
opacity: 0.5;
}
.group:hover .group-hover\:block {
display: block;
}
.group:hover .group-hover\:translate-x-0 {
--tw-translate-x: 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));
@ -1704,26 +1672,11 @@ body {
opacity: 1;
}
.dark\:border-gray-600:is(.dark *) {
--tw-border-opacity: 1;
border-color: rgb(75 85 99 / var(--tw-border-opacity));
}
.dark\:bg-gray-800:is(.dark *) {
--tw-bg-opacity: 1;
background-color: rgb(31 41 55 / var(--tw-bg-opacity));
}
.dark\:text-gray-200:is(.dark *) {
--tw-text-opacity: 1;
color: rgb(229 231 235 / var(--tw-text-opacity));
}
.dark\:ring-gray-700:is(.dark *) {
--tw-ring-opacity: 1;
--tw-ring-color: rgb(55 65 81 / var(--tw-ring-opacity));
}
.dark\:file\:text-foreground:is(.dark *)::file-selector-button {
--tw-text-opacity: 1;
color: hsl(var(--foreground) / var(--tw-text-opacity));
@ -1734,16 +1687,6 @@ body {
background-color: rgb(55 65 81 / var(--tw-bg-opacity));
}
.dark\:hover\:text-white:hover:is(.dark *) {
--tw-text-opacity: 1;
color: rgb(255 255 255 / var(--tw-text-opacity));
}
.dark\:focus\:ring-indigo-400:focus:is(.dark *) {
--tw-ring-opacity: 1;
--tw-ring-color: rgb(129 140 248 / var(--tw-ring-opacity));
}
@media (min-width: 640px) {
.sm\:my-8 {
margin-top: 2rem;