diff --git a/htmgo-site/pages/base/root.go b/htmgo-site/pages/base/root.go index 92a90a8..c15900b 100644 --- a/htmgo-site/pages/base/root.go +++ b/htmgo-site/pages/base/root.go @@ -35,9 +35,21 @@ func RootPage(ctx *h.RequestContext, children ...h.Ren) *h.Element { `), ), h.Body( - h.Class("bg-stone-50 min-h-screen overflow-x-hidden"), - partials.NavBar(ctx, false), + h.Class("bg-stone-50 h-screen"), h.Fragment(children...), ), ) } + +func PageWithNav(ctx *h.RequestContext, children ...h.Ren) *h.Element { + return RootPage(ctx, + h.Fragment( + partials.NavBar(ctx, partials.NavBarProps{ + Expanded: false, + }), + h.Div( + children..., + ), + ), + ) +} diff --git a/htmgo-site/pages/docs.go b/htmgo-site/pages/docs.go index 6f55173..f85e689 100644 --- a/htmgo-site/pages/docs.go +++ b/htmgo-site/pages/docs.go @@ -15,37 +15,48 @@ func DocsPage(ctx *h.RequestContext) *h.Page { return h.NewPage(base.RootPage( ctx, h.Div( - h.Class("flex flex-col md:flex-row gap-6 justify-center overflow-x-hidden"), + h.Class("flex h-full"), h.Aside( - h.Class("md:h-screen md:sticky md:top-0 md:w-42"), // Applied sticky positioning here + h.Class("hidden md:block md:min-w-60 text-white overflow-y-auto"), partials.DocSidebar(pages), ), - h.Main( - h.Class("md:flex gap-4 justify-center mb-6"), - h.Div( - h.Class("flex flex-col"), + h.Div( + h.Class("flex flex-col flex-1 overflow-hidden"), + partials.NavBar(ctx, partials.NavBarProps{ + Expanded: false, + ShowPreRelease: false, + }), + h.Main( h.Div( - h.Class("flex flex-col justify-center items-center md:mt-6 "), - h.List(pages, func(page *dirwalk.Page, index int) *h.Element { - anchor := partials.CreateAnchor(page.Parts) - return h.Div( - h.Class("border-b border-b-slate-300 w-full pb-8 p-4 md:px-0 -mb-2"), - MarkdownContent(ctx, page.FilePath, anchor), - h.Div( - h.Class("ml-4 pl-1 mt-2 bg-rose-200"), - h.If(anchor == "core-concepts-partials", - h.GetPartial(partials.CurrentTimePartial, "load, every 1s"), - ), - ), - ) - }), + h.Class("w-full md:hidden bg-neutral-50 overflow-y-auto"), + partials.DocSidebar(pages), ), + h.Class("overflow-y-auto justify-center md:mx-auto overflow-x-hidden pb-6"), h.Div( - h.Class("flex justify-center items-center mt-6"), - h.A( - h.Text("Back to Top"), - h.Class("py-2 px-3 bg-slate-800 rounded text-white"), - h.Href("#"), + h.Class("flex flex-col"), + h.Div( + h.Class("flex flex-col justify-center items-center md:mt-6 "), + h.List(pages, func(page *dirwalk.Page, index int) *h.Element { + anchor := partials.CreateAnchor(page.Parts) + return h.Div( + h.Class("border-b border-b-slate-300 w-full pb-8 p-4 md:px-0 -mb-2"), + MarkdownContent(ctx, page.FilePath, anchor), + h.Div( + h.Class("ml-4 pl-1 mt-2 bg-rose-200"), + h.If(anchor == "core-concepts-partials", + h.GetPartial(partials.CurrentTimePartial, "load, every 1s"), + ), + ), + ) + }), + ), + h.Div( + h.Class("flex justify-center items-center mt-6"), + h.A( + h.Text("Back to Top"), + h.Class("py-2 px-3 bg-slate-800 rounded text-white"), + h.Href("#quick-start-introduction"), + ), ), ), ), diff --git a/htmgo-site/pages/examples.go b/htmgo-site/pages/examples.go index 0924f66..6922abc 100644 --- a/htmgo-site/pages/examples.go +++ b/htmgo-site/pages/examples.go @@ -50,7 +50,7 @@ var examples = []Example{ func ExamplesPage(ctx *h.RequestContext) *h.Page { return h.NewPage( - base.RootPage(ctx, h.Div( + base.PageWithNav(ctx, h.Div( h.Class("flex items-center justify-center"), h.Div( h.Class("w-full px-4 flex flex-col prose max-w-[95vw] md:max-w-3xl mt-6"), diff --git a/htmgo-site/pages/html-to-go.go b/htmgo-site/pages/html-to-go.go index 0a9231a..644d836 100644 --- a/htmgo-site/pages/html-to-go.go +++ b/htmgo-site/pages/html-to-go.go @@ -8,7 +8,7 @@ import ( func HtmlToGoPage(ctx *h.RequestContext) *h.Page { return h.NewPage( - base.RootPage(ctx, + base.PageWithNav(ctx, h.Div( h.Class("flex flex-col h-full items-center justify-center w-full pt-6"), h.H3( diff --git a/htmgo-site/pages/index.go b/htmgo-site/pages/index.go index 91cde87..8470795 100644 --- a/htmgo-site/pages/index.go +++ b/htmgo-site/pages/index.go @@ -7,7 +7,7 @@ import ( func IndexPage(ctx *h.RequestContext) *h.Page { return h.NewPage( - base.RootPage(ctx, h.Div( + base.PageWithNav(ctx, h.Div( h.Class("flex items-center justify-center"), h.Div( h.Class("w-full px-4 flex flex-col prose md:max-w-3xl mt-6 mx-auto"), diff --git a/htmgo-site/pages/markdown.go b/htmgo-site/pages/markdown.go index 7239048..6bdc933 100644 --- a/htmgo-site/pages/markdown.go +++ b/htmgo-site/pages/markdown.go @@ -22,7 +22,7 @@ func MarkdownContent(ctx *h.RequestContext, path string, id string) *h.Element { return h.Div( h.If(id != "", h.Id(id)), h.Div( - h.Class("w-full flex flex-col prose max-w-[95vw] md:max-w-3xl prose-code:text-black prose-p:my-1 prose:p-0 prose-li:m-0 prose-ul:m-0 prose-ol:m-0"), + h.Class("w-full flex flex-col prose max-w-md md:max-w-xl lg:max-w-3xl prose-code:text-black prose-p:my-1 prose:p-0 prose-li:m-0 prose-ul:m-0 prose-ol:m-0"), h.UnsafeRaw(renderer.RenderFile(path, embeddedMd)), ), ) diff --git a/htmgo-site/partials/navbar.go b/htmgo-site/partials/navbar.go index 5dce037..0bb2345 100644 --- a/htmgo-site/partials/navbar.go +++ b/htmgo-site/partials/navbar.go @@ -18,6 +18,11 @@ var navItems = []NavItem{ {Name: "Convert HTML", Url: "/html-to-go"}, } +type NavBarProps struct { + Expanded bool + ShowPreRelease bool +} + func ToggleNavbar(ctx *h.RequestContext) *h.Partial { return h.SwapManyPartial( ctx, @@ -69,15 +74,16 @@ func Star(ctx *h.RequestContext) *h.Element { ) } -func NavBar(ctx *h.RequestContext, expanded bool) *h.Element { - prelease := h.A(h.Class("bg-yellow-200 text-yellow-800 text-center p-2 flex items-center justify-center"), +func NavBar(ctx *h.RequestContext, props NavBarProps) *h.Element { + prelease := h.If(props.ShowPreRelease, h.A( + h.Class("bg-yellow-200 text-yellow-800 text-center p-2 flex items-center justify-center"), h.Href("https://github.com/maddalax/htmgo/issues"), h.Attribute("target", "_blank"), h.Text("htmgo is in alpha release. Please report any issues on GitHub."), - ) + )) desktopNav := h.Nav( - h.Class("hidden sm:block bg-neutral-100 border border-b-slate-300 p-4 md:p-3"), + h.Class("hidden sm:block bg-neutral-100 border border-b-slate-300 p-4 md:p-3 max-h-[100vh - 9rem] overflow-y-auto"), h.Div( h.Class("max-w-[95%] md:max-w-3xl px-4 mx-auto"), h.Div( @@ -110,7 +116,7 @@ func NavBar(ctx *h.RequestContext, expanded bool) *h.Element { return h.Div( h.Id("navbar"), prelease, - MobileNav(ctx, expanded), + MobileNav(ctx, props.Expanded), desktopNav, ) }