HTML document, ASCII text
1
<!DOCTYPE html>
2
<html lang="en-GB">
3
<head>
4
<title>{% block title %}{% endblock %}</title>
5
<meta charset="utf-8">
6
<meta name="viewport" content="width=device-width, initial-scale=1">
7
<link rel="stylesheet" href="/static/style.css">
8
<script src="https://cdn.jsdelivr.net/npm/iconify-icon@2.1.0/dist/iconify-icon.min.js"></script>
9
</head>
10
<style>
11
@media (prefers-reduced-motion: no-preference) {
12
@view-transition {
13
navigation: auto;
14
}
15
}
16
</style>
17
<body>
18
<dialog id="hamburger" class="sheet-left">
19
<nav>
20
<ul>
21
<li><a href="/">Home</a></li>
22
<li><a href="/object/">Object list</a></li>
23
<li><a href="/query-pictures">Query</a></li>
24
<li><a href="/info/">Help</a></li>
25
{% if session.username %}
26
<li><a href="/upload">Upload</a></li>
27
<li><a href="/create-gallery">New gallery</a>
28
{% endif %}
29
</ul>
30
<ul>
31
{% if session.username %}
32
<li><a href="/profile/{{ session.username }}">Profile: {{ session.username }}</a></li>
33
<li><a href="/logout">Log out</a></li>
34
{% else %}
35
<li><a href="/accounts">Accounts</a></li>
36
{% endif %}
37
</ul>
38
</nav>
39
</dialog>
40
<header>
41
<nav class="navbar" id="mobile-navbar">
42
<ul>
43
{% if back_url %}
44
<li id="back-button">
45
<a class="button button-flat button-neutral" href="{{ back_url | safe }}">
46
<iconify-icon icon="ic:baseline-arrow-back">Back</iconify-icon>
47
</a>
48
</li>
49
{% else %}
50
<li id="hamburger-button">
51
<button class="button-flat button-neutral" onclick="document.getElementById('hamburger').showModal()">
52
<iconify-icon icon="ic:baseline-menu">Menu</iconify-icon>
53
</button>
54
</li>
55
{% endif %}
56
<li id="mobile-navbar-title">
57
{% block nav_title %}{% endblock %}
58
</li>
59
</ul>
60
</nav>
61
<nav class="navbar" id="desktop-navbar">
62
<ul>
63
{% if back_url %}
64
<li id="back-button-desktop">
65
<a class="button button-flat button-neutral" href="{{ back_url | safe }}">
66
<iconify-icon icon="ic:baseline-arrow-back">Back</iconify-icon>
67
</a>
68
</li>
69
{% endif %}
70
<li id="desktop-navbar-title">{{ self.nav_title() }}</li> {# copy the block #}
71
</ul>
72
<ul>
73
<li><a href="/">Home</a></li>
74
<li><a href="/object/">Object list</a></li>
75
<li><a href="/query-pictures">Query</a></li>
76
<li><a href="/info/">Help</a></li>
77
{% if session.username %}
78
<li><a href="/upload">Upload</a></li>
79
<li><a href="/create-gallery">New gallery</a>
80
{% endif %}
81
{% if session.username %}
82
<li><a href="/profile/{{ session.username }}">Profile: {{ session.username }}</a></li>
83
<li><a href="/logout">Log out</a></li>
84
{% else %}
85
<li><a href="/accounts">Accounts</a></li>
86
{% endif %}
87
</ul>
88
</nav>
89
</header>
90
<div id="mobile-navbar-spacer"></div>
91
<main>
92
{% block content %}{% endblock %}
93
</main>
94
{% with messages = get_flashed_messages(with_categories=true) %}
95
<ol class="toast-container">
96
{% for category, message in messages %}
97
<li
98
style="
99
{% if category %}
100
background-color:
101
{% if category == 'error' %}var(--color-error)
102
{% elif category == 'alert' %}var(--color-alert)
103
{% elif category == 'info' %}var(--color-info)
104
{% elif category == 'success' %}var(--color-success)
105
{% endif %};
106
color:
107
{% if category == 'error' %}var(--color-error-text)
108
{% elif category == 'alert' %}var(--color-alert-text)
109
{% elif category == 'info' %}var(--color-info-text)
110
{% elif category == 'success' %}var(--color-success-text)
111
{% endif %};
112
{% endif %}"
113
>
114
{% if category | split | first == "task" %}
115
{{ message }}
116
{% else %}
117
{{ message }}
118
{% endif %}
119
<x-buttonbox>
120
<button class="button-flat" onclick="removeToast()" style="color: inherit !important;">Close</button>
121
</x-buttonbox>
122
</li>
123
{% endfor %}
124
</ol>
125
{% endwith %}
126
<script src="/static/efficient-ui/dialogs.js"></script>
127
<script src="/static/efficient-ui/toasts.js"></script>
128
<script src="/static/ripples.js"></script>
129
</body>
130
</html>
131