dzming.li
A vibe coded tangled fork which supports pijul.
1{{define "base"}}
2<!DOCTYPE html>
3<html>
4<head>
5 <title>KnotMirror Admin</title>
6 <script src="https://cdn.jsdelivr.net/npm/htmx.org@2.0.8/dist/htmx.min.js" integrity="sha384-/TgkGk7p307TH7EXJDuUlgG3Ce1UVolAOFopFekQkkXihi5u/6OCvVKyz1W+idaz" crossorigin="anonymous"></script>
7 <style>
8 nav { margin-bottom: 20px; border-bottom: 1px solid #ccc; padding: 10px 0; }
9 nav a { margin-right: 15px; }
10 table { width: 100%; border-collapse: collapse; }
11 th, td { text-align: left; padding: 8px; border: 1px solid #ddd; }
12 .pagination { margin-top: 20px; }
13 .filters { background: #f4f4f4; padding: 15px; margin-bottom: 20px; }
14 #notifications {
15 position: fixed;
16 bottom: 8px;
17 right: 8px;
18 z-index: 1000;
19 pointer-events: none;
20 }
21 .notif {
22 pointer-events: auto;
23 background: #333;
24 color: #fff;
25 padding: 2px 4px;
26 margin: 4px 0;
27 opacity: 0.95;
28 }
29 .notif.warn { background: #ed6c02 }
30 .notif.error { background: #d32f2f }
31 </style>
32</head>
33<body>
34 <nav>
35 <a href="/repos">Repositories</a>
36 <a href="/hosts">Knot Hosts</a>
37 </nav>
38 <main id="main">
39 {{template "content" .}}
40 </main>
41 <div id="notifications"></div>
42 <script>
43 document.body.addEventListener("htmx:oobBeforeSwap", (evt) => {
44 evt.detail.fragment.querySelectorAll(".notif").forEach((el) => {
45 console.debug("set timeout to notif element", el)
46 setTimeout(() => {
47 console.debug("clearing notif element", el);
48 el.remove();
49 }, 10 * 1000);
50 });
51 });
52 </script>
53</body>
54</html>
55{{end}}