blob: 2cd4c5999ce790c46b93ed2b368ad2189ab58c00 (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
|
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Personal Dashboard</title>
<link rel="icon" type="image/svg+xml" href="/static/favicon.svg">
<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-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">
Last updated: <span id="last-updated">{{.LastUpdated.Format "3:04 PM"}}</span>
</span>
<button onclick="refreshData()"
class="bg-primary-600 hover:bg-primary-700 text-white px-4 py-2 rounded-lg transition-colors font-medium no-print">
<span id="refresh-text">Refresh</span>
</button>
<form method="POST" action="/logout" class="no-print">
<input type="hidden" name="csrf_token" value="{{.CSRFToken}}">
<button type="submit"
class="text-gray-600 hover:text-gray-900 px-3 py-2 rounded-lg transition-colors font-medium">
Logout
</button>
</form>
</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">
<button
class="tab-button {{if eq .ActiveTab "tasks"}}tab-button-active{{end}}"
hx-get="/tabs/tasks"
hx-target="#tab-content"
hx-push-url="?tab=tasks"
onclick="setActiveTab(this)">
✓ Tasks
</button>
<button
class="tab-button {{if eq .ActiveTab "planning"}}tab-button-active{{end}}"
hx-get="/tabs/planning"
hx-target="#tab-content"
hx-push-url="?tab=planning"
onclick="setActiveTab(this)">
📋 Planning
</button>
<button
class="tab-button {{if eq .ActiveTab "meals"}}tab-button-active{{end}}"
hx-get="/tabs/meals"
hx-target="#tab-content"
hx-push-url="?tab=meals"
onclick="setActiveTab(this)">
🍽️ Meals
</button>
</nav>
</div>
<!-- Tab Content -->
<div id="tab-content"
hx-get="/tabs/{{.ActiveTab}}"
hx-trigger="load"
hx-swap="innerHTML">
<div class="text-center py-8">
<div class="inline-block animate-pulse text-gray-600">Loading...</div>
</div>
</div>
</div>
<!-- Bug Report Button -->
<button onclick="document.getElementById('bug-modal').classList.remove('hidden')"
class="fixed bottom-4 right-4 bg-red-500 hover:bg-red-600 text-white p-3 rounded-full shadow-lg no-print"
title="Report a bug">
🐛
</button>
<!-- Bug Report Modal -->
<div id="bug-modal" class="hidden fixed inset-0 bg-black/50 flex items-center justify-center p-4 z-50">
<div class="bg-white rounded-lg shadow-xl max-w-md w-full max-h-[80vh] overflow-hidden">
<div class="p-4 border-b border-gray-200 flex justify-between items-center">
<h2 class="font-semibold text-gray-900">Report Bug</h2>
<button onclick="document.getElementById('bug-modal').classList.add('hidden')"
class="text-gray-400 hover:text-gray-600">✕</button>
</div>
<div class="p-4">
<form hx-post="/bugs"
hx-target="#bug-list"
hx-swap="innerHTML"
hx-on::after-request="if(event.detail.successful) this.reset()">
<textarea name="description"
placeholder="Describe the bug..."
class="w-full border border-gray-300 rounded-lg px-3 py-2 text-sm mb-3 h-24"
required></textarea>
<button type="submit"
class="w-full bg-red-500 hover:bg-red-600 text-white px-4 py-2 rounded-lg text-sm font-medium">
Submit Bug Report
</button>
</form>
<div class="mt-4 border-t border-gray-200 pt-4">
<h3 class="text-sm font-medium text-gray-700 mb-2">Recent Reports</h3>
<div id="bug-list"
class="max-h-48 overflow-y-auto"
hx-get="/bugs"
hx-trigger="load">
<p class="text-gray-400 text-sm">Loading...</p>
</div>
</div>
</div>
</div>
</div>
<script src="/static/js/htmx.min.js"></script>
<script src="/static/js/app.js"></script>
</body>
</html>
|
