-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathnav.html
More file actions
60 lines (60 loc) · 4.14 KB
/
Copy pathnav.html
File metadata and controls
60 lines (60 loc) · 4.14 KB
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
{{define "nav"}}
<header id="top-bar">
<div id="top-bar-left">
<a href="/" style="display:flex;align-items:center;gap:8px;text-decoration:none;color:inherit">
<svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5"><path d="M20.84 4.61a5.5 5.5 0 0 0-7.78 0L12 5.67l-1.06-1.06a5.5 5.5 0 0 0-7.78 7.78l1.06 1.06L12 21.23l7.78-7.78 1.06-1.06a5.5 5.5 0 0 0 0-7.78z"></path></svg>
<span>{{T .Lang "app_title"}}</span>
</a>
</div>
<button id="top-menu-toggle" type="button" aria-label="Menu" aria-expanded="false" aria-controls="top-bar-right" onclick="toggleTopMenu()">
<svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5"><line x1="4" y1="7" x2="20" y2="7"/><line x1="4" y1="12" x2="20" y2="12"/><line x1="4" y1="17" x2="20" y2="17"/></svg>
</button>
<div id="top-bar-right">
<a href="/metrics" class="top-btn{{if eq .ActiveNav "metrics"}} active{{end}}">
<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5"><circle cx="11" cy="11" r="8"/><line x1="21" y1="21" x2="16.65" y2="16.65"/></svg>
<span>{{T .Lang "all_metrics"}}</span>
</a>
<a href="/settings" class="top-btn ui-tooltip{{if eq .ActiveNav "settings"}} active{{end}}"
data-tooltip="{{T .Lang "nav_settings"}}"
aria-label="{{T .Lang "nav_settings"}}">
<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5"><line x1="4" y1="6" x2="20" y2="6"/><line x1="4" y1="12" x2="20" y2="12"/><line x1="4" y1="18" x2="20" y2="18"/><circle cx="8" cy="6" r="2" fill="currentColor" stroke="none"/><circle cx="16" cy="12" r="2" fill="currentColor" stroke="none"/><circle cx="10" cy="18" r="2" fill="currentColor" stroke="none"/></svg>
<span>{{T .Lang "nav_settings"}}</span>
</a>
{{if .IsAdmin}}
<a href="/admin" class="top-btn ui-tooltip{{if eq .ActiveNav "admin"}} active{{end}}"
data-tooltip="{{T .Lang "admin_title"}}"
aria-label="{{T .Lang "admin_title"}}">
<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5"><circle cx="12" cy="12" r="3"/><path d="M19.4 15a1.65 1.65 0 0 0 .33 1.82l.06.06a2 2 0 0 1-2.83 2.83l-.06-.06a1.65 1.65 0 0 0-1.82-.33 1.65 1.65 0 0 0-1 1.51V21a2 2 0 0 1-4 0v-.09A1.65 1.65 0 0 0 9 19.4a1.65 1.65 0 0 0-1.82.33l-.06.06a2 2 0 0 1-2.83-2.83l.06-.06A1.65 1.65 0 0 0 4.68 15a1.65 1.65 0 0 0-1.51-1H3a2 2 0 0 1 0-4h.09A1.65 1.65 0 0 0 4.6 9a1.65 1.65 0 0 0-.33-1.82l-.06-.06a2 2 0 0 1 2.83-2.83l.06.06A1.65 1.65 0 0 0 9 4.68a1.65 1.65 0 0 0 1-1.51V3a2 2 0 0 1 4 0v.09a1.65 1.65 0 0 0 1 1.51 1.65 1.65 0 0 0 1.82-.33l.06-.06a2 2 0 0 1 2.83 2.83l-.06.06A1.65 1.65 0 0 0 19.4 9a1.65 1.65 0 0 0 1.51 1H21a2 2 0 0 1 0 4h-.09a1.65 1.65 0 0 0-1.51 1z"/></svg>
<span class="top-admin-label">{{T .Lang "admin_title"}}</span>
</a>
{{end}}
{{range LangOptions .Lang}}
<a href="?lang={{.Code}}" class="top-btn lang-toggle{{if .Active}} active{{end}}" onclick="document.cookie='lang={{.Code}};path=/;max-age=31536000'">{{.Label}}</a>
{{end}}
<form method="POST" action="/logout" style="display:inline">
<button type="submit" class="top-btn ui-tooltip ui-tooltip--right"
data-tooltip="{{T .Lang "nav_logout"}}"
aria-label="{{T .Lang "nav_logout"}}">
<span>{{T .Lang "nav_logout"}}</span>
</button>
</form>
</div>
<script>
function toggleTopMenu() {
var nav = document.getElementById('top-bar-right');
var btn = document.getElementById('top-menu-toggle');
if (!nav || !btn) return;
var open = nav.classList.toggle('open');
btn.setAttribute('aria-expanded', open ? 'true' : 'false');
}
document.addEventListener('click', function(e) {
var nav = document.getElementById('top-bar-right');
var btn = document.getElementById('top-menu-toggle');
if (!nav || !btn || !nav.classList.contains('open')) return;
if (nav.contains(e.target) || btn.contains(e.target)) return;
nav.classList.remove('open');
btn.setAttribute('aria-expanded', 'false');
});
</script>
</header>
{{end}}