make the sidebar fixed

htmgo-site/pages/docs.go

@@ -15,14 +15,21 @@ func DocsPage(ctx *h.RequestContext) *h.Page {
 	return h.NewPage(base.RootPage(
 		ctx,
 		h.Div(
-			h.Class("flex flex-col md:flex-row gap-4 justify-center mb-12"),
+			h.Class("flex flex-col md:flex-row gap-6 justify-center"),
+			h.Aside(
+				h.Class("md:h-screen md:sticky md:top-0 md:w-42"), // Applied sticky positioning here
 				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 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 mb-8 p-4 md:px-0 -mb-2"),
+								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"),
@@ -34,7 +41,14 @@ func DocsPage(ctx *h.RequestContext) *h.Page {
 						}),
 					),
 					h.Div(
-				h.Class("min-h-12"),
+						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("#"),
+						),
+					),
+				),
 			),
 		),
 	))

htmgo-site/partials/sidebar.go

@@ -72,7 +72,7 @@ func DocSidebar(pages []*dirwalk.Page) *h.Element {
 								return h.A(
 									h.Href("#"+anchor),
 									h.Text(partsToName(page.Parts)),
-									h.ClassX("text-slate-900", map[string]bool{}),
+									h.Class("text-slate-900 hover:text-rose-400"),
 								)
 							}),
 						),