some simple UI to make it work
This commit is contained in:
@@ -35,6 +35,9 @@
|
||||
<script src="https://unpkg.com/htmx.org@1.9.12"></script>
|
||||
<style>
|
||||
.btn { --animation-btn: 0; --btn-focus-scale: 1; }
|
||||
@media (min-width: 768px) {
|
||||
.nav-menu { flex-direction: row; }
|
||||
}
|
||||
#nav-backdrop { display: none; }
|
||||
@media (max-width: 767px) {
|
||||
#nav-backdrop {
|
||||
@@ -59,15 +62,17 @@
|
||||
<header class="navbar bg-base-100 shadow-sm">
|
||||
<nav class="mx-auto flex w-full max-w-6xl items-center justify-between gap-2 px-4">
|
||||
<a href="/admin/dashboard" class="min-w-0 truncate text-lg font-bold">Admin</a>
|
||||
<div class="hidden items-center gap-1 md:flex">
|
||||
<a href="/admin/dashboard" class="btn btn-ghost btn-sm">Dashboard</a>
|
||||
<a href="/admin/blog/articles" class="btn btn-ghost btn-sm">Blog</a>
|
||||
<a href="/admin/about" class="btn btn-ghost btn-sm">About</a>
|
||||
<a href="/" class="btn btn-ghost btn-sm">View site</a>
|
||||
<form method="post" action="/admin/logout">
|
||||
<button type="submit" class="btn btn-ghost btn-sm">Logout</button>
|
||||
</form>
|
||||
</div>
|
||||
<ul class="nav-menu menu menu-sm hidden items-center gap-1 md:flex">
|
||||
<li><a href="/admin/dashboard">Dashboard</a></li>
|
||||
<li><a href="/admin/blog/articles">Blog</a></li>
|
||||
<li><a href="/admin/about">About</a></li>
|
||||
<li><a href="/">View site</a></li>
|
||||
<li>
|
||||
<form method="post" action="/admin/logout">
|
||||
<button type="submit" class="w-full">Logout</button>
|
||||
</form>
|
||||
</li>
|
||||
</ul>
|
||||
<div class="flex items-center gap-1">
|
||||
<div class="dropdown dropdown-end md:hidden">
|
||||
<div tabindex="0" role="button" class="btn btn-ghost btn-sm btn-circle" aria-label="Menu">
|
||||
@@ -76,16 +81,18 @@
|
||||
<path stroke-linecap="round" stroke-linejoin="round" d="M3.75 6.75h16.5M3.75 12h16.5m-16.5 5.25h16.5" />
|
||||
</svg>
|
||||
</div>
|
||||
<div tabindex="0"
|
||||
class="dropdown-content z-50 mt-3 flex w-52 flex-col gap-1 rounded-box border border-base-300 bg-base-100 p-2 shadow-lg">
|
||||
<a href="/admin/dashboard" class="btn btn-ghost btn-sm justify-start">Dashboard</a>
|
||||
<a href="/admin/blog/articles" class="btn btn-ghost btn-sm justify-start">Blog</a>
|
||||
<a href="/admin/about" class="btn btn-ghost btn-sm justify-start">About</a>
|
||||
<a href="/" class="btn btn-ghost btn-sm justify-start">View site</a>
|
||||
<form method="post" action="/admin/logout">
|
||||
<button type="submit" class="btn btn-ghost btn-sm w-full justify-start">Logout</button>
|
||||
</form>
|
||||
</div>
|
||||
<ul tabindex="0"
|
||||
class="menu dropdown-content z-50 mt-3 w-52 rounded-box border border-base-300 bg-base-100 p-2 shadow-lg">
|
||||
<li><a href="/admin/dashboard">Dashboard</a></li>
|
||||
<li><a href="/admin/blog/articles">Blog</a></li>
|
||||
<li><a href="/admin/about">About</a></li>
|
||||
<li><a href="/">View site</a></li>
|
||||
<li>
|
||||
<form method="post" action="/admin/logout">
|
||||
<button type="submit" class="w-full">Logout</button>
|
||||
</form>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="dropdown dropdown-end">
|
||||
<div tabindex="0" role="button" class="btn btn-ghost btn-sm btn-circle" aria-label="Settings" title="Settings">
|
||||
|
||||
Reference in New Issue
Block a user