default.html
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><span id="hamburger-site-name">{{ site_name }}</span></li>
22
<li><a href="/">
23
<iconify-icon icon="ic:baseline-home"></iconify-icon>Home
24
</a></li>
25
<li><a href="/object/">
26
<iconify-icon icon="mdi:flower-tulip"></iconify-icon>Object list
27
</a></li>
28
<li><a href="/query-pictures">
29
<iconify-icon icon="mdi:search"></iconify-icon>Query
30
</a></li>
31
<li><a href="/info/">
32
<iconify-icon icon="mdi:information"></iconify-icon>Help
33
</a></li>
34
{% if session.username %}
35
<li><a href="/upload">
36
<iconify-icon icon="mdi:upload"></iconify-icon>Upload
37
</a></li>
38
<li><a href="/create-gallery">
39
<iconify-icon icon="ic:baseline-photo-album"></iconify-icon>New gallery
40
</a></li>
41
{% endif %}
42
</ul>
43
<ul>
44
{% if session.username %}
45
<li><a href="/profile/{{ session.username }}">
46
<iconify-icon icon="ic:baseline-account-circle"></iconify-icon>Profile: {{ session.username }}
47
</a></li>
48
<li><a href="/logout">
49
<iconify-icon icon="mdi:logout"></iconify-icon>Log out
50
</a></li>
51
{% else %}
52
<li><a href="/accounts">
53
<iconify-icon icon="mdi:login"></iconify-icon>Accounts
54
</a></li>
55
{% endif %}
56
</ul>
57
</nav>
58
</dialog>
59
<header>
60
<nav class="navbar" id="mobile-navbar">
61
<ul>
62
{% if back_url %}
63
<li id="back-button">
64
<a class="button button-flat button-neutral" href="{{ back_url | safe }}">
65
<iconify-icon icon="ic:baseline-arrow-back">Back</iconify-icon>
66
</a>
67
</li>
68
{% else %}
69
<li id="hamburger-button">
70
<button class="button-flat button-neutral" onclick="document.getElementById('hamburger').showModal()">
71
<iconify-icon icon="ic:baseline-menu">Menu</iconify-icon>
72
</button>
73
</li>
74
{% endif %}
75
<li id="mobile-navbar-title">
76
{% block nav_title %}{% endblock %}
77
</li>
78
</ul>
79
</nav>
80
<nav class="navbar" id="desktop-navbar">
81
<ul>
82
{% if back_url %}
83
<li id="back-button-desktop">
84
<a class="button button-flat button-neutral" href="{{ back_url | safe }}">
85
<iconify-icon icon="ic:baseline-arrow-back">Back</iconify-icon>
86
</a>
87
</li>
88
{% endif %}
89
<li id="desktop-navbar-title">{{ self.nav_title() }}</li> {# copy the block #}
90
</ul>
91
<ul>
92
<li><a href="/">Home</a></li>
93
<li><a href="/object/">Object list</a></li>
94
<li><a href="/query-pictures">Query</a></li>
95
<li><a href="/info/">Help</a></li>
96
{% if session.username %}
97
<li><a href="/upload">Upload</a></li>
98
<li><a href="/create-gallery">New gallery</a>
99
{% endif %}
100
{% if session.username %}
101
<li><a href="/profile/{{ session.username }}">Profile: {{ session.username }}</a></li>
102
<li><a href="/logout">Log out</a></li>
103
{% else %}
104
<li><a href="/accounts">Accounts</a></li>
105
{% endif %}
106
</ul>
107
</nav>
108
</header>
109
<div id="mobile-navbar-spacer"></div>
110
<main>
111
{% block content %}{% endblock %}
112
</main>
113
{% with messages = get_flashed_messages(with_categories=true) %}
114
<ol class="toast-container">
115
{% for category, message in messages %}
116
<li
117
style="
118
{% if category %}
119
background-color:
120
{% if category == 'error' %}var(--color-error)
121
{% elif category == 'alert' %}var(--color-alert)
122
{% elif category == 'info' %}var(--color-info)
123
{% elif category == 'success' %}var(--color-success)
124
{% endif %};
125
color:
126
{% if category == 'error' %}var(--color-error-text)
127
{% elif category == 'alert' %}var(--color-alert-text)
128
{% elif category == 'info' %}var(--color-info-text)
129
{% elif category == 'success' %}var(--color-success-text)
130
{% endif %};
131
{% endif %}"
132
>
133
{% if category | split | first == "task" %}
134
{{ message }}
135
{% else %}
136
{{ message }}
137
{% endif %}
138
<x-buttonbox>
139
<button class="button-flat" onclick="removeToast()" style="color: inherit !important;">Close</button>
140
</x-buttonbox>
141
</li>
142
{% endfor %}
143
</ol>
144
{% endwith %}
145
<script src="/static/efficient-ui/dialogs.js"></script>
146
<script src="/static/efficient-ui/toasts.js"></script>
147
<script src="/static/ripples.js"></script>
148
</body>
149
</html>
150