Extract the top bar and account menu into shell_topbar.html and the member rail into shell_rail_member.html, backed by a single server.Shell value. Move session controls into the account menu, add the mirrored Operator panel/Member dashboard surface switch, and turn the rail into an offcanvas drawer below lg with shell.js closing it on navigation. Update docs, specs, and tests. Unify application shell across both surfaces Extract the top bar and member rail into shared partials and introduce server.Shell as the single data value for page chrome. Move session controls into an account menu, make the rail an offcanvas drawer below lg, and add the mirrored surface switch.
25 lines
1.7 KiB
HTML
25 lines
1.7 KiB
HTML
{{/* Application shell: the member rail. Pipeline: server.Shell. Task
|
|
destinations only, then the surface switch ("Operator panel", operators
|
|
only) as the one separated non-section entry (chrome-conventions "The
|
|
surface switch is a visible, mirrored rail entry"). The same element is
|
|
the static 15rem rail at lg and up and a Bootstrap offcanvas drawer
|
|
below, opened from the top bar's toggler; shell.js closes the drawer
|
|
when an entry is chosen. Session controls never render here; they live
|
|
in the top bar's account menu. */}}
|
|
<aside id="app-rail" class="app-sidebar offcanvas-lg offcanvas-start bg-light border-end flex-shrink-0" tabindex="-1" aria-labelledby="app-rail-label">
|
|
<div class="offcanvas-header">
|
|
<span class="offcanvas-title" id="app-rail-label">{{ deploymentName }}</span>
|
|
<button type="button" class="btn-close" data-bs-dismiss="offcanvas" data-bs-target="#app-rail" aria-label="Close navigation"></button>
|
|
</div>
|
|
<div class="offcanvas-body p-0">
|
|
<ul class="nav flex-column p-3">
|
|
<li class="nav-item"><a class="nav-link{{ if eq .Active "dashboard" }} active{{ end }}" {{ if eq .Active "dashboard" }}aria-current="page" {{ end }}href="/">Dashboard</a></li>
|
|
<li class="nav-item"><a class="nav-link{{ if eq .Active "products" }} active{{ end }}" {{ if eq .Active "products" }}aria-current="page" {{ end }}href="/products">Products</a></li>
|
|
<li class="nav-item"><a class="nav-link{{ if eq .Active "billing" }} active{{ end }}" {{ if eq .Active "billing" }}aria-current="page" {{ end }}href="/billing">Billing</a></li>
|
|
{{ if .IsOperator }}
|
|
<li class="nav-item app-rail-switch"><a class="nav-link" href="/operator">Operator panel</a></li>
|
|
{{ end }}
|
|
</ul>
|
|
</div>
|
|
</aside>
|