-
Notifications
You must be signed in to change notification settings - Fork 2
/
base.html
116 lines (104 loc) · 3.55 KB
/
base.html
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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
{% assets 'css' %}
<link rel="stylesheet" href="{{ ASSET_URL }}" />
{% endassets %} {% assets 'js' %}
<script type="text/javascript" src="{{ ASSET_URL }}"></script>
{% endassets %}
<title>
{% block title %} {% endblock %} FindMeOn (HTMX, Flask, Turso)
</title>
<style>
header {
display: flex;
background: white;
border-bottom: 10px solid var(--qwik-dark-purple);
}
header .logo a {
display: inline-block;
padding: 10px 10px 7px 20px;
}
header ul {
margin: 0;
padding: 3px 10px 0 0;
list-style: none;
flex: 1;
text-align: right;
}
header li {
display: inline-block;
margin: 0;
padding: 0;
}
header li a {
display: inline-block;
padding: 15px 10px;
text-decoration: none;
}
header li a:hover {
text-decoration: underline;
}
</style>
</head>
<body>
<div class="flex flex-col h-[100vh]">
<main class="flex-grow">
<header class="flex justify-between">
<div class="logo">
<a
class="text-2xl font-bold"
href="/"
title="FindMeOn"
rel="noopener"
>
FindMeOn
</a>
</div>
<ul>
<li>
<a
class="flex"
href="https://github.com/turso-extended/app-find-me-on-python-htmx"
target="_blank"
rel="noopener"
title="View on GitHub"
>
<svg
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 24 24"
class="w-6 h-6"
>
<path fill="none" d="M0 0h24v24H0z" />
<title>GitHub</title>
<path
d="M12 2C6.475 2 2 6.475 2 12a9.994 9.994 0 0 0 6.838 9.488c.5.087.687-.213.687-.476 0-.237-.013-1.024-.013-1.862-2.512.463-3.162-.612-3.362-1.175-.113-.288-.6-1.175-1.025-1.413-.35-.187-.85-.65-.013-.662.788-.013 1.35.725 1.538 1.025.9 1.512 2.338 1.087 2.912.825.088-.65.35-1.087.638-1.337-2.225-.25-4.55-1.113-4.55-4.938 0-1.088.387-1.987 1.025-2.688-.1-.25-.45-1.275.1-2.65 0 0 .837-.262 2.75 1.026a9.28 9.28 0 0 1 2.5-.338c.85 0 1.7.112 2.5.337 1.912-1.3 2.75-1.024 2.75-1.024.55 1.375.2 2.4.1 2.65.637.7 1.025 1.587 1.025 2.687 0 3.838-2.337 4.688-4.562 4.938.362.312.675.912.675 1.85 0 1.337-.013 2.412-.013 2.75 0 .262.188.574.688.474A10.016 10.016 0 0 0 22 12c0-5.525-4.475-10-10-10z"
/>
</svg>
</a>
</li>
</ul>
</header>
<div class="text-center p-2 text-3xl">
{% block heading %} {% endblock %}
</div>
<div class="status" id="response"></div>
<section>{% block content %} {% endblock content %}</section>
</main>
<footer
class="flex-shrink-0 flex justify-center text-gray-600 max-h-48 p-4"
>
<p>
Built with
<a href="https://htmx.org" target="_blank"> HTMX </a>,
<a href="https://palletsprojects.com/p/flask/" target="_blank">
Flask</a
>, & <a href="https://turso.tech" target="_blank"> Turso</a>.
</p>
</footer>
</div>
</body>
</html>