Swap Bulma for DaisyUI (Tailwind) (#111)
This commit is contained in:
Mike Stefanello
GitHub
parent
fc5db0e95a
commit
c1e9baabe6
53 changed files with 1124 additions and 632 deletions
|
|
@ -6,6 +6,7 @@ import (
|
|||
"github.com/mikestefanello/pagoda/pkg/ui"
|
||||
"github.com/mikestefanello/pagoda/pkg/ui/cache"
|
||||
. "github.com/mikestefanello/pagoda/pkg/ui/components"
|
||||
"github.com/mikestefanello/pagoda/pkg/ui/icons"
|
||||
. "maragu.dev/gomponents"
|
||||
. "maragu.dev/gomponents/html"
|
||||
)
|
||||
|
|
@ -14,118 +15,97 @@ func Primary(r *ui.Request, content Node) Node {
|
|||
return Doctype(
|
||||
HTML(
|
||||
Lang("en"),
|
||||
Data("theme", "light"),
|
||||
Data("theme", "dark"),
|
||||
Head(
|
||||
Metatags(r),
|
||||
CSS(),
|
||||
JS(r),
|
||||
JS(),
|
||||
),
|
||||
Body(
|
||||
headerNavBar(r),
|
||||
Div(
|
||||
Class("container mt-5"),
|
||||
Class("drawer lg:drawer-open"),
|
||||
Input(
|
||||
ID("sidebar"),
|
||||
Type("checkbox"),
|
||||
Class("drawer-toggle"),
|
||||
),
|
||||
Div(
|
||||
Class("columns"),
|
||||
Div(
|
||||
Class("column is-2"),
|
||||
sidebarMenu(r),
|
||||
),
|
||||
Div(
|
||||
Class("column is-10"),
|
||||
Div(
|
||||
Class("box"),
|
||||
If(len(r.Title) > 0, H1(Class("title"), Text(r.Title))),
|
||||
FlashMessages(r),
|
||||
content,
|
||||
),
|
||||
Class("drawer-content flex flex-col p-7 prose-base"),
|
||||
If(len(r.Title) > 0, H1(Text(r.Title))),
|
||||
FlashMessages(r),
|
||||
content,
|
||||
Label(
|
||||
For("sidebar"),
|
||||
Class("btn btn-primary drawer-button lg:hidden"),
|
||||
Text("Open drawer"),
|
||||
),
|
||||
),
|
||||
sidebarMenu(r),
|
||||
),
|
||||
searchModal(r),
|
||||
HtmxListeners(r),
|
||||
),
|
||||
),
|
||||
)
|
||||
}
|
||||
|
||||
func headerNavBar(r *ui.Request) Node {
|
||||
return cache.SetIfNotExists("layout.headerNavBar", func() Node {
|
||||
return Nav(
|
||||
Class("navbar is-dark"),
|
||||
Div(
|
||||
Class("container"),
|
||||
Div(
|
||||
Class("navbar-brand"),
|
||||
HxBoost(),
|
||||
A(
|
||||
Href(r.Path(routenames.Home)),
|
||||
Class("navbar-item"),
|
||||
Text("Pagoda"),
|
||||
),
|
||||
),
|
||||
Div(
|
||||
ID("navbarMenu"),
|
||||
Class("navbar-menu"),
|
||||
Div(
|
||||
Class("navbar-end"),
|
||||
search(r),
|
||||
),
|
||||
func search() Node {
|
||||
return cache.SetIfNotExists("layout.search", func() Node {
|
||||
return Div(
|
||||
Class("ml-2"),
|
||||
Attr("x-data", ""),
|
||||
Label(
|
||||
Class("input"),
|
||||
icons.MagnifyingGlass(),
|
||||
Input(
|
||||
Type("search"),
|
||||
Class("grow"),
|
||||
Placeholder("Search"),
|
||||
Attr("@click", "search_modal.showModal();"),
|
||||
),
|
||||
),
|
||||
|
||||
)
|
||||
})
|
||||
}
|
||||
|
||||
func search(r *ui.Request) Node {
|
||||
return cache.SetIfNotExists("layout.search", func() Node {
|
||||
return Div(
|
||||
Class("search mr-2 mt-1"),
|
||||
Attr("x-data", "{modal:false}"),
|
||||
Input(
|
||||
Class("input"),
|
||||
Type("search"),
|
||||
Placeholder("Search..."),
|
||||
Attr("@click", "modal = true; $nextTick(() => $refs.input.focus());"),
|
||||
),
|
||||
func searchModal(r *ui.Request) Node {
|
||||
return cache.SetIfNotExists("layout.searchModal", func() Node {
|
||||
return Dialog(
|
||||
ID("search_modal"),
|
||||
Class("modal"),
|
||||
Div(
|
||||
Class("modal"),
|
||||
Attr(":class", "modal ? 'is-active' : ''"),
|
||||
Attr("x-show", "modal == true"),
|
||||
Div(
|
||||
Class("modal-background"),
|
||||
),
|
||||
Div(
|
||||
Class("modal-content"),
|
||||
Attr("@click.outside", "modal = false;"),
|
||||
Div(
|
||||
Class("box"),
|
||||
H2(
|
||||
Class("subtitle"),
|
||||
Text("Search"),
|
||||
),
|
||||
P(
|
||||
Class("control"),
|
||||
Input(
|
||||
Attr("hx-get", r.Path(routenames.Search)),
|
||||
Attr("hx-trigger", "keyup changed delay:500ms"),
|
||||
Attr("hx-target", "#results"),
|
||||
Name("query"),
|
||||
Class("input"),
|
||||
Type("search"),
|
||||
Placeholder("Search..."),
|
||||
Attr("x-ref", "input"),
|
||||
),
|
||||
),
|
||||
Div(
|
||||
Class("block"),
|
||||
),
|
||||
Div(
|
||||
ID("results"),
|
||||
),
|
||||
Class("modal-box"),
|
||||
Form(
|
||||
Method("dialog"),
|
||||
Button(
|
||||
Class("btn btn-sm btn-circle btn-ghost absolute right-2 top-2"),
|
||||
Text("✕"),
|
||||
),
|
||||
),
|
||||
H3(
|
||||
Class("text-lg font-bold mb-2"),
|
||||
Text("Search"),
|
||||
),
|
||||
Input(
|
||||
Attr("hx-get", r.Path(routenames.Search)),
|
||||
Attr("hx-trigger", "keyup changed delay:500ms"),
|
||||
Attr("hx-target", "#results"),
|
||||
Name("query"),
|
||||
Class("input w-full"),
|
||||
Type("search"),
|
||||
Placeholder("Search..."),
|
||||
),
|
||||
Ul(
|
||||
ID("results"),
|
||||
Class("list"),
|
||||
),
|
||||
),
|
||||
Form(
|
||||
Method("dialog"),
|
||||
Class("modal-backdrop"),
|
||||
Button(
|
||||
Class("modal-close is-large"),
|
||||
Aria("label", "close"),
|
||||
Text("close"),
|
||||
),
|
||||
),
|
||||
)
|
||||
|
|
@ -133,66 +113,67 @@ func search(r *ui.Request) Node {
|
|||
}
|
||||
|
||||
func sidebarMenu(r *ui.Request) Node {
|
||||
header := func(text string) Node {
|
||||
return Li(
|
||||
Class("menu-title mt-3 uppercase"),
|
||||
Span(Text(text)),
|
||||
)
|
||||
}
|
||||
|
||||
adminSubMenu := func() Node {
|
||||
entityTypeNames := admin.GetEntityTypeNames()
|
||||
entityTypeLinks := make(Group, len(entityTypeNames))
|
||||
for _, n := range entityTypeNames {
|
||||
entityTypeLinks = append(entityTypeLinks, MenuLink(r, n, routenames.AdminEntityList(n)))
|
||||
entityTypeLinks = append(entityTypeLinks, MenuLink(r, icons.PencilSquare(), n, routenames.AdminEntityList(n)))
|
||||
}
|
||||
|
||||
return Group{
|
||||
P(
|
||||
Class("menu-label"),
|
||||
Text("Entities"),
|
||||
),
|
||||
Ul(
|
||||
Class("menu-list"),
|
||||
entityTypeLinks,
|
||||
),
|
||||
P(
|
||||
Class("menu-label"),
|
||||
Text("Monitoring"),
|
||||
),
|
||||
Ul(
|
||||
Class("menu-list"),
|
||||
Li(
|
||||
A(
|
||||
Href(r.Path(routenames.AdminTasks)),
|
||||
Text("Tasks"),
|
||||
Target("_blank"),
|
||||
),
|
||||
header("Entities"),
|
||||
entityTypeLinks,
|
||||
header("Monitoring"),
|
||||
Li(
|
||||
A(
|
||||
icons.CircleStack(),
|
||||
Href(r.Path(routenames.AdminTasks)),
|
||||
Text("Tasks"),
|
||||
Target("_blank"),
|
||||
),
|
||||
),
|
||||
}
|
||||
}
|
||||
|
||||
return Aside(
|
||||
Class("menu"),
|
||||
HxBoost(),
|
||||
P(
|
||||
Class("menu-label"),
|
||||
Text("General"),
|
||||
return Div(
|
||||
Class("drawer-side"),
|
||||
Label(
|
||||
For("sidebar"),
|
||||
Aria("label", "close sidebar"),
|
||||
Class("drawer-overlay"),
|
||||
),
|
||||
Ul(
|
||||
Class("menu-list"),
|
||||
MenuLink(r, "Dashboard", routenames.Home),
|
||||
MenuLink(r, "About", routenames.About),
|
||||
MenuLink(r, "Contact", routenames.Contact),
|
||||
MenuLink(r, "Cache", routenames.Cache),
|
||||
MenuLink(r, "Task", routenames.Task),
|
||||
MenuLink(r, "Files", routenames.Files),
|
||||
Div(
|
||||
Class("menu bg-base-200 text-base-content min-h-full w-80 p-4"),
|
||||
Div(
|
||||
Class("w-2/3 mx-auto mt-3 mb-10"),
|
||||
Img(
|
||||
Src(ui.StaticFile("logo.png")),
|
||||
),
|
||||
),
|
||||
search(),
|
||||
Ul(
|
||||
HxBoost(),
|
||||
header("General"),
|
||||
MenuLink(r, icons.Home(), "Dashboard", routenames.Home),
|
||||
MenuLink(r, icons.Info(), "About", routenames.About),
|
||||
MenuLink(r, icons.Mail(), "Contact", routenames.Contact),
|
||||
MenuLink(r, icons.Archive(), "Cache", routenames.Cache),
|
||||
MenuLink(r, icons.CircleStack(), "Task", routenames.Task),
|
||||
MenuLink(r, icons.Document(), "Files", routenames.Files),
|
||||
header("Account"),
|
||||
If(r.IsAuth, MenuLink(r, icons.Exit(), "Logout", routenames.Logout)),
|
||||
If(!r.IsAuth, MenuLink(r, icons.Enter(), "Login", routenames.Login)),
|
||||
If(!r.IsAuth, MenuLink(r, icons.UserPlus(), "Register", routenames.Register)),
|
||||
If(!r.IsAuth, MenuLink(r, icons.QuestionCircle(), "Forgot password", routenames.ForgotPasswordSubmit)),
|
||||
Iff(r.IsAdmin, adminSubMenu),
|
||||
),
|
||||
),
|
||||
P(
|
||||
Class("menu-label"),
|
||||
Text("Account"),
|
||||
),
|
||||
Ul(
|
||||
Class("menu-list"),
|
||||
If(r.IsAuth, MenuLink(r, "Logout", routenames.Logout)),
|
||||
If(!r.IsAuth, MenuLink(r, "Login", routenames.Login)),
|
||||
If(!r.IsAuth, MenuLink(r, "Register", routenames.Register)),
|
||||
If(!r.IsAuth, MenuLink(r, "Forgot password", routenames.ForgotPasswordSubmit)),
|
||||
),
|
||||
Iff(r.IsAdmin, adminSubMenu),
|
||||
)
|
||||
}
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue