sonr/internal/nebula/layout/layout.templ

67 lines
1.4 KiB
Plaintext
Raw Normal View History

package layout
type (
Alignment templ.Attributes
ScreenWidth templ.Attributes
)
var (
AlignCenter = Alignment{
"class": "flex items-center justify-center",
}
AlignEnd = Alignment{
"class": "flex items-end justify-center",
}
MaxWidthSmall = ScreenWidth{
"class": "max-w-screen-sm",
}
MaxWidthMedium = ScreenWidth{
"class": "max-w-screen-md",
}
MaxWidthFull = ScreenWidth{
"class": "w-full",
}
)
// Layout is a component that renders the general layout of the application
templ View(title string) {
<!DOCTYPE html>
<html lang="en">
@Head(title, "0.0.11")
<body class="flex items-center justify-center h-full lg:p-24 md:16 p-4 no-scrollbar">
<main class="flex-row items-center justify-center mx-auto w-fit max-w-screen-lg gap-y-3">
{ children... }
</main>
</body>
</html>
}
templ Body(align Alignment, screenWidth ScreenWidth) {
<style>
.sl-toast-stack {
top: auto;
bottom: 0;
left: auto;
right: 0;
}
.no-scrollbar::-webkit-scrollbar {
display: none;
}
</style>
<body class="flex items-center justify-center h-full lg:p-24 md:16 p-4 no-scrollbar">
<main class="flex-row items-center justify-center mx-auto w-fit max-w-screen-sm gap-y-3">
{ children... }
</main>
</body>
}
func Clsx(attrs ...templ.Attributes) templ.Attributes {
merged := templ.Attributes{}
for _, attr := range attrs {
for k, v := range attr {
merged[k] = v
}
}
return merged
}