diff options
| author | Peter Stone <thepeterstone@gmail.com> | 2026-01-20 20:32:22 -1000 |
|---|---|---|
| committer | Peter Stone <thepeterstone@gmail.com> | 2026-01-20 20:32:22 -1000 |
| commit | b412b2a7e6b475d77d215374eafbabc086ba1534 (patch) | |
| tree | 13e2210cb4fb62426af6b94b81b62a277352e838 /web/templates/index.html | |
| parent | 6cdfc55e5712075fef24a559138c054ef58e1ac1 (diff) | |
Improve mobile responsiveness
- Hide full header on mobile, show compact version
- Make Quick Add collapsible to save space
- Compact task cards: smaller padding, text, and gaps
- Remove checkbox decoration, tap card to complete
- Reduce side padding on mobile
- Smaller tab buttons on mobile
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
Diffstat (limited to 'web/templates/index.html')
| -rw-r--r-- | web/templates/index.html | 19 |
1 files changed, 16 insertions, 3 deletions
diff --git a/web/templates/index.html b/web/templates/index.html index c270b48..3c91e63 100644 --- a/web/templates/index.html +++ b/web/templates/index.html @@ -7,9 +7,9 @@ <link rel="stylesheet" href="/static/css/output.css"> </head> <body class="min-h-screen" hx-headers='{"X-CSRF-Token": "{{.CSRFToken}}"}'> - <div class="content-max-width py-8"> - <!-- Header --> - <header class="mb-8 flex flex-col sm:flex-row justify-between items-start sm:items-center gap-4"> + <div class="content-max-width py-4 sm:py-8"> + <!-- Header - Hidden on mobile --> + <header class="hidden sm:flex mb-8 flex-row justify-between items-center gap-4"> <h1 class="text-4xl font-bold text-gray-900">Personal Dashboard</h1> <div class="flex items-center gap-4"> <span class="text-sm text-gray-600"> @@ -29,6 +29,19 @@ </div> </header> + <!-- Mobile Header - Compact --> + <header class="flex sm:hidden mb-4 justify-between items-center"> + <button onclick="refreshData()" + class="text-primary-600 p-2 no-print"> + <span id="refresh-text-mobile">↻</span> + </button> + <span class="text-xs text-gray-500" id="last-updated-mobile">{{.LastUpdated.Format "3:04 PM"}}</span> + <form method="POST" action="/logout" class="no-print"> + <input type="hidden" name="csrf_token" value="{{.CSRFToken}}"> + <button type="submit" class="text-gray-500 text-sm p-2">Logout</button> + </form> + </header> + <!-- Tab Navigation --> <div class="mb-8 no-print"> <nav class="flex space-x-1 bg-white/30 backdrop-blur-md rounded-xl p-1"> |