simplified tailwind classes and removed collapsing sidebar make it static

This commit is contained in:
Robin Olsen
2026-02-17 22:26:25 +01:00
parent 1e5bfcc0ba
commit 61e5109f9a
4 changed files with 18 additions and 70 deletions

View File

@@ -19,25 +19,6 @@ templ Layout(props LayoutProps) {
{ children... }
</main>
</div>
<script>
function toggleSidebar() {
const sidebar = document.getElementById("sidebar");
if (!sidebar) return;
const labels = sidebar.querySelectorAll(".sidebar-label");
const links = sidebar.querySelectorAll(".sidebar-link, .sidebar-toggle");
sidebar.classList.toggle("w-56");
sidebar.classList.toggle("w-16");
labels.forEach(label => {
label.classList.toggle("hidden");
});
links.forEach(link => {
link.classList.toggle("justify-start");
link.classList.toggle("justify-center");
link.classList.toggle("gap-3");
link.classList.toggle("gap-0");
});
}
</script>
</body>
</html>
}

View File

@@ -87,7 +87,7 @@ func Layout(props LayoutProps) templ.Component {
if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err
}
templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 7, "</main></div><script>\n\t\t\tfunction toggleSidebar() {\n\tconst sidebar = document.getElementById(\"sidebar\");\n\tif (!sidebar) return;\n\tconst labels = sidebar.querySelectorAll(\".sidebar-label\");\n\tconst links = sidebar.querySelectorAll(\".sidebar-link, .sidebar-toggle\");\n\t\tsidebar.classList.toggle(\"w-56\");\n\tsidebar.classList.toggle(\"w-16\");\n\tlabels.forEach(label => {\n\t\tlabel.classList.toggle(\"hidden\");\n\t});\n\tlinks.forEach(link => {\n\t\tlink.classList.toggle(\"justify-start\");\n\t\tlink.classList.toggle(\"justify-center\");\n\t\tlink.classList.toggle(\"gap-3\");\n\t\tlink.classList.toggle(\"gap-0\");\n\t});\n}\n\t\t\t</script></body></html>")
templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 7, "</main></div></body></html>")
if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err
}
@@ -137,7 +137,7 @@ func Head(props HeadProps) templ.Component {
var templ_7745c5c3_Var5 templ.SafeURL
templ_7745c5c3_Var5, templ_7745c5c3_Err = templ.JoinURLErrs(link.Href)
if templ_7745c5c3_Err != nil {
return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/web/components/layout.templ`, Line: 60, Col: 24}
return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/web/components/layout.templ`, Line: 41, Col: 24}
}
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var5))
if templ_7745c5c3_Err != nil {
@@ -150,7 +150,7 @@ func Head(props HeadProps) templ.Component {
var templ_7745c5c3_Var6 string
templ_7745c5c3_Var6, templ_7745c5c3_Err = templ.JoinStringErrs(link.Rel)
if templ_7745c5c3_Err != nil {
return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/web/components/layout.templ`, Line: 60, Col: 41}
return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/web/components/layout.templ`, Line: 41, Col: 41}
}
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var6))
if templ_7745c5c3_Err != nil {
@@ -163,7 +163,7 @@ func Head(props HeadProps) templ.Component {
var templ_7745c5c3_Var7 string
templ_7745c5c3_Var7, templ_7745c5c3_Err = templ.JoinStringErrs(link.As)
if templ_7745c5c3_Err != nil {
return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/web/components/layout.templ`, Line: 60, Col: 56}
return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/web/components/layout.templ`, Line: 41, Col: 56}
}
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var7))
if templ_7745c5c3_Err != nil {
@@ -182,7 +182,7 @@ func Head(props HeadProps) templ.Component {
var templ_7745c5c3_Var8 string
templ_7745c5c3_Var8, templ_7745c5c3_Err = templ.JoinStringErrs(script.Src)
if templ_7745c5c3_Err != nil {
return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/web/components/layout.templ`, Line: 63, Col: 26}
return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/web/components/layout.templ`, Line: 44, Col: 26}
}
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var8))
if templ_7745c5c3_Err != nil {
@@ -195,7 +195,7 @@ func Head(props HeadProps) templ.Component {
var templ_7745c5c3_Var9 string
templ_7745c5c3_Var9, templ_7745c5c3_Err = templ.JoinStringErrs(script.Defer)
if templ_7745c5c3_Err != nil {
return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/web/components/layout.templ`, Line: 63, Col: 49}
return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/web/components/layout.templ`, Line: 44, Col: 49}
}
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var9))
if templ_7745c5c3_Err != nil {
@@ -254,7 +254,7 @@ func Header(props HeaderProps) templ.Component {
var templ_7745c5c3_Var11 string
templ_7745c5c3_Var11, templ_7745c5c3_Err = templ.JoinStringErrs(props.Title)
if templ_7745c5c3_Err != nil {
return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/web/components/layout.templ`, Line: 86, Col: 49}
return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/web/components/layout.templ`, Line: 67, Col: 49}
}
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var11))
if templ_7745c5c3_Err != nil {

View File

@@ -3,35 +3,23 @@ package components
templ Sidebar(routes []NavRoutes) {
<aside
id="sidebar"
class="w-56 shrink-0 flex flex-col min-h-0 bg-base-100 border-r border-base-300 shadow-sm transition-all duration-300"
class="flex flex-col bg-base-100 border-r border-base-300 transition-all duration-300"
>
<nav class="flex-1 overflow-y-auto py-3 px-2">
<ul class="menu menu-vertical w-full p-0 gap-0.5">
<nav class="flex-1 overflow-y-auto p-2">
<ul class="menu menu-vertical p-0">
for _, r := range routes {
<li>
<a
href={ r.Path }
class="sidebar-link rounded-lg py-2.5 px-3 text-base-content font-medium no-underline hover:bg-base-200 active:bg-base-200 transition-colors duration-150 flex items-center gap-3 min-w-0"
class="sidebar-link rounded-lg py-2.5 px-3 text-base-content items-center"
>
if r.Icon != nil {
<span class="sidebar-icon shrink-0 flex items-center justify-center [&>svg]:w-5 [&>svg]:h-5">@r.Icon</span>
<span class="sidebar-icon flex items-center justify-center">@r.Icon</span>
}
<span class="sidebar-label truncate">{ r.Name }</span>
</a>
</li>
}
</ul>
</nav>
<div class="border-t border-base-300 p-2 shrink-0">
<button
type="button"
class="sidebar-toggle btn btn-ghost btn-sm w-full justify-start text-base-content/80 hover:text-base-content hover:bg-base-200 rounded-lg flex items-center gap-3"
onclick="toggleSidebar()"
aria-label="Collapse sidebar"
>
<span class="sidebar-icon shrink-0">@IconCollapse()</span>
<span class="sidebar-label">Collapse</span>
</button>
</div>
</aside>
}

View File

@@ -29,7 +29,7 @@ func Sidebar(routes []NavRoutes) templ.Component {
templ_7745c5c3_Var1 = templ.NopComponent
}
ctx = templ.ClearChildren(ctx)
templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 1, "<aside id=\"sidebar\" class=\"w-56 shrink-0 flex flex-col min-h-0 bg-base-100 border-r border-base-300 shadow-sm transition-all duration-300\"><nav class=\"flex-1 overflow-y-auto py-3 px-2\"><ul class=\"menu menu-vertical w-full p-0 gap-0.5\">")
templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 1, "<aside id=\"sidebar\" class=\"flex flex-col bg-base-100 border-r border-base-300 transition-all duration-300\"><nav class=\"flex-1 overflow-y-auto p-2\"><ul class=\"menu menu-vertical p-0\">")
if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err
}
@@ -47,12 +47,12 @@ func Sidebar(routes []NavRoutes) templ.Component {
if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err
}
templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 3, "\" class=\"sidebar-link rounded-lg py-2.5 px-3 text-base-content font-medium no-underline hover:bg-base-200 active:bg-base-200 transition-colors duration-150 flex items-center gap-3 min-w-0\">")
templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 3, "\" class=\"sidebar-link rounded-lg py-2.5 px-3 text-base-content items-center\">")
if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err
}
if r.Icon != nil {
templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 4, "<span class=\"sidebar-icon shrink-0 flex items-center justify-center [&>svg]:w-5 [&>svg]:h-5\">")
templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 4, "<span class=\"sidebar-icon flex items-center justify-center\">")
if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err
}
@@ -60,38 +60,17 @@ func Sidebar(routes []NavRoutes) templ.Component {
if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err
}
templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 5, "</span> ")
templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 5, "</span>")
if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err
}
}
templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 6, "<span class=\"sidebar-label truncate\">")
if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err
}
var templ_7745c5c3_Var3 string
templ_7745c5c3_Var3, templ_7745c5c3_Err = templ.JoinStringErrs(r.Name)
if templ_7745c5c3_Err != nil {
return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/web/components/sidebar.templ`, Line: 19, Col: 52}
}
_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var3))
if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err
}
templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 7, "</span></a></li>")
templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 6, "</a></li>")
if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err
}
}
templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 8, "</ul></nav><div class=\"border-t border-base-300 p-2 shrink-0\"><button type=\"button\" class=\"sidebar-toggle btn btn-ghost btn-sm w-full justify-start text-base-content/80 hover:text-base-content hover:bg-base-200 rounded-lg flex items-center gap-3\" onclick=\"toggleSidebar()\" aria-label=\"Collapse sidebar\"><span class=\"sidebar-icon shrink-0\">")
if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err
}
templ_7745c5c3_Err = IconCollapse().Render(ctx, templ_7745c5c3_Buffer)
if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err
}
templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 9, "</span> <span class=\"sidebar-label\">Collapse</span></button></div></aside>")
templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 7, "</ul></nav></aside>")
if templ_7745c5c3_Err != nil {
return templ_7745c5c3_Err
}