mirror of
https://github.com/ditatompel/xmr-remote-nodes.git
synced 2024-11-17 09:27:37 +00:00
49 lines
2.8 KiB
Text
49 lines
2.8 KiB
Text
package views
|
|
|
|
templ navbar(pageIdentifier string) {
|
|
<header class="fixed top-4 inset-x-0 flex flex-wrap md:justify-start md:flex-nowrap z-50 w-full before:absolute before:inset-0 before:max-w-7xl before:mx-2 before:lg:mx-auto before:rounded-[26px] before:bg-neutral-800/70 before:backdrop-blur-md">
|
|
<nav class="relative max-w-7xl w-full py-2.5 px-5 md:flex md:items-center md:justify-between md:py-0 mx-2 lg:mx-auto">
|
|
<div class="flex items-center justify-between">
|
|
<div class="flex-none inline-block">
|
|
<a class="text-xl font-semibold text-white focus:outline-none" href="/" aria-label="XMR Nodes">XMR Nodes</a>
|
|
<div id="hx-indicator-main" class="htmx-indicator animate-spin ml-2 inline-block size-4 border-[3px] border-current border-t-transparent text-blue-500 rounded-full" role="status" aria-label="loading indicator">
|
|
<span class="sr-only">Loading...</span>
|
|
</div>
|
|
</div>
|
|
<div class="md:hidden">
|
|
<button type="button" class="hs-collapse-toggle size-8 flex justify-center items-center text-sm font-semibold rounded-full bg-neutral-800 text-white disabled:opacity-50 disabled:pointer-events-none" id="hs-navbar-floating-dark-collapse" aria-expanded="false" aria-controls="hs-navbar-floating-dark" aria-label="Toggle navigation" data-hs-collapse="#main-navbar">
|
|
<svg class="hs-collapse-open:hidden shrink-0 size-4" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><line x1="3" x2="21" y1="6" y2="6"></line><line x1="3" x2="21" y1="12" y2="12"></line><line x1="3" x2="21" y1="18" y2="18"></line></svg>
|
|
<svg class="hs-collapse-open:block hidden shrink-0 size-4" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M18 6 6 18"></path><path d="m6 6 12 12"></path></svg>
|
|
</button>
|
|
</div>
|
|
</div>
|
|
<!-- Collapse -->
|
|
<div id="main-navbar" class="hs-collapse hidden overflow-hidden transition-all duration-300 basis-full grow md:block" aria-labelledby="main-navbar-collapse">
|
|
<div class="flex flex-col md:flex-row md:items-center md:justify-end gap-2 md:gap-3 mt-3 md:mt-0 py-2 md:py-0 md:ps-7">
|
|
<a
|
|
href="/"
|
|
if pageIdentifier == "/" {
|
|
class="active"
|
|
aria-current="page"
|
|
}
|
|
>Home</a>
|
|
<a
|
|
href="/remote-nodes"
|
|
if pageIdentifier == "/remote-nodes" {
|
|
class="active"
|
|
aria-current="page"
|
|
}
|
|
>Remote Nodes</a>
|
|
<a
|
|
href="/add-node"
|
|
if pageIdentifier == "/add-node" {
|
|
class="active"
|
|
aria-current="page"
|
|
}
|
|
>Add Node</a>
|
|
</div>
|
|
</div>
|
|
<!-- End Collapse -->
|
|
</nav>
|
|
</header>
|
|
}
|