filipriec/Kurt_kalendar
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

mobile resolution

Browse Source
This commit is contained in:
Priec
2026-05-16 18:17:27 +02:00
parent 08884536d7
commit 8e99e53d8a
5 changed files with 165 additions and 21 deletions
Download Patch File Download Diff File Expand all files Collapse all files

65
ht_booking/assets/views/base.html
View File

@@ -53,25 +53,64 @@
.table tbody tr:not(:last-child) :where(th, td) {
border-bottom-color: hsl(var(--bc) / 0.18);
}
/* Mobile: pin navbar dropdowns to the viewport's right edge and cap their
width so they can never spill off-screen, whatever the trigger's spot. */
@media (max-width: 767px) {
.navbar .dropdown-content {
position: fixed;
top: 4rem;
right: 0.5rem;
left: auto;
margin-top: 0;
max-width: calc(100vw - 1rem);
}
}
</style>
{% block head %}{% endblock head %}
</head>
<body class="min-h-screen bg-base-200 font-sans text-base-content antialiased">
<div class="navbar bg-base-100 shadow-sm">
<div class="mx-auto flex w-full max-w-6xl flex-wrap items-center justify-between gap-2 px-4">
<a href="/" class="text-lg font-bold">{{ t(key="brand", lang=lang) }}</a>
<nav class="flex flex-wrap items-center gap-1">
<a href="/" class="btn btn-ghost btn-sm">{{ t(key="nav-calendar", lang=lang) }}</a>
{% if logged_in | default(value=false) %}
<a href="/admin" class="btn btn-ghost btn-sm">{{ t(key="admin-title", lang=lang) }}</a>
<a href="/admin/courts" class="btn btn-ghost btn-sm">{{ t(key="manage-courts", lang=lang) }}</a>
<form method="post" action="/admin/logout">
<button class="btn btn-ghost btn-sm">{{ t(key="logout", lang=lang) }}</button>
</form>
{% else %}
<a href="/admin/login" class="btn btn-ghost btn-sm">{{ t(key="nav-admin", lang=lang) }}</a>
{% endif %}
<div class="mx-auto flex w-full max-w-6xl items-center justify-between gap-2 px-4">
<a href="/" class="min-w-0 truncate text-lg font-bold">{{ t(key="brand", lang=lang) }}</a>
<nav class="flex items-center gap-1">
<!-- Page links — inline on desktop, tucked into a menu on mobile. -->
<div class="hidden items-center gap-1 md:flex">
<a href="/" class="btn btn-ghost btn-sm">{{ t(key="nav-calendar", lang=lang) }}</a>
{% if logged_in | default(value=false) %}
<a href="/admin" class="btn btn-ghost btn-sm">{{ t(key="admin-title", lang=lang) }}</a>
<a href="/admin/courts" class="btn btn-ghost btn-sm">{{ t(key="manage-courts", lang=lang) }}</a>
<form method="post" action="/admin/logout">
<button class="btn btn-ghost btn-sm">{{ t(key="logout", lang=lang) }}</button>
</form>
{% else %}
<a href="/admin/login" class="btn btn-ghost btn-sm">{{ t(key="nav-admin", lang=lang) }}</a>
{% endif %}
</div>
<div class="dropdown dropdown-end md:hidden">
<div tabindex="0" role="button" class="btn btn-ghost btn-sm btn-circle"
aria-label="{{ t(key='menu', lang=lang) }}">
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5"
stroke="currentColor" class="h-5 w-5">
<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="/" class="btn btn-ghost btn-sm justify-start">{{ t(key="nav-calendar", lang=lang) }}</a>
{% if logged_in | default(value=false) %}
<a href="/admin" class="btn btn-ghost btn-sm justify-start">{{ t(key="admin-title", lang=lang) }}</a>
<a href="/admin/courts" class="btn btn-ghost btn-sm justify-start">{{ t(key="manage-courts", lang=lang) }}</a>
<form method="post" action="/admin/logout">
<button class="btn btn-ghost btn-sm w-full justify-start">{{ t(key="logout", lang=lang) }}</button>
</form>
{% else %}
<a href="/admin/login" class="btn btn-ghost btn-sm justify-start">{{ t(key="nav-admin", lang=lang) }}</a>
{% endif %}
</div>
</div>
<div class="dropdown dropdown-end">
<div tabindex="0" role="button" class="btn btn-ghost btn-sm btn-circle"