arnefandCopilot
9f8bfba420
- Layout nav wraps gracefully on narrow screens instead of overflowing (username truncates, links/logout reflow). - Dashboard resource cards and share rows wrap instead of clipping when names/usernames are long. - Contacts list hides secondary columns (organization/email below md, phone below sm) so the name and actions stay usable on phones. - Calendar month/week grids get a horizontally scrollable wrapper with a sane minimum width and smaller cell padding on mobile so the 7-day grid stays legible instead of being squeezed unreadably thin. Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
38 lines
1.5 KiB
Templ
38 lines
1.5 KiB
Templ
package templates
|
|
|
|
templ Layout(title string, username string) {
|
|
<!DOCTYPE html>
|
|
<html lang="en" class="h-full bg-gray-50">
|
|
<head>
|
|
<meta charset="UTF-8"/>
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
|
|
<title>{ title } · nidus</title>
|
|
<link rel="stylesheet" href="/web/static/app.css"/>
|
|
<script src="/web/static/htmx.min.js" defer></script>
|
|
</head>
|
|
<body class="h-full text-gray-900">
|
|
<nav class="bg-white border-b border-gray-200">
|
|
<div class="max-w-4xl mx-auto px-3 sm:px-4 py-3 flex flex-wrap items-center justify-between gap-x-4 gap-y-2">
|
|
<div class="flex items-center gap-3 sm:gap-6 flex-wrap">
|
|
<a href="/web/" class="font-semibold text-lg tracking-tight">nidus</a>
|
|
if username != "" {
|
|
<a href="/web/files/" class="text-sm text-gray-600 hover:text-indigo-600">Files</a>
|
|
<a href="/web/contacts" class="text-sm text-gray-600 hover:text-indigo-600">Contacts</a>
|
|
<a href="/web/calendar" class="text-sm text-gray-600 hover:text-indigo-600">Calendar</a>
|
|
}
|
|
</div>
|
|
if username != "" {
|
|
<div class="flex items-center gap-3 sm:gap-4 text-sm text-gray-600">
|
|
<a href="/web/account" class="hover:text-indigo-600 truncate max-w-[8rem]">{ username }</a>
|
|
<a href="/web/logout" class="text-red-600 hover:underline shrink-0">Logout</a>
|
|
</div>
|
|
}
|
|
</div>
|
|
</nav>
|
|
<main class="max-w-4xl mx-auto px-3 sm:px-4 py-6 sm:py-8">
|
|
{ children... }
|
|
</main>
|
|
</body>
|
|
</html>
|
|
}
|