Aus der statischen Seite wird ein Go-Binary mit eingebetteter Oberfläche. Grund: Apps über .env zu pflegen wurde unübersichtlich, und kosmetische Einstellungen sollen auf jedem Gerät gleich sein. - Anmeldung über den eigenen OIDC-Anbieter (PocketID), mit PKCE. Ohne Anmeldung gibt es nichts zu sehen – auch keine App-Liste. - Sitzung als signiertes Cookie ohne Gegenstück im Server; Schreibzugriffe zusätzlich über ein lesbares CSRF-Cookie abgesichert - Apps werden in der Oberfläche angelegt und bearbeitet, nicht mehr in der .env. Der Server prüft jeden Eintrag und meldet zurück, was er behält. - Einstellungen liegen je Nutzer im Server; localStorage ist nur noch der Vorschuss, damit die Röhre beim Laden nicht in der falschen Farbe blitzt - die Leiste holt die App-Liste aus /api/apps – freigegeben sind allein die Ursprünge, die selbst als App eingetragen sind - Tests fahren einen echten OIDC-Anbieter hoch und gehen den Anmeldeweg einmal ganz durch Ohne HONEYOS_OIDC_ISSUER läuft alles offen – für die Entwicklung, mit deutlicher Warnung beim Start. Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
42 lines
1.5 KiB
HTML
42 lines
1.5 KiB
HTML
<!doctype html>
|
|
<html lang="de">
|
|
<head>
|
|
<meta charset="utf-8" />
|
|
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
|
<title>HoneyBar — Vorschau in einer fremden App</title>
|
|
<style>
|
|
/* Bewusst NICHT im HoneyOS-Stil: hier wird geprüft, dass die Leiste
|
|
eine ganz andere App nicht anfasst und von ihr nicht angefasst wird. */
|
|
body {
|
|
margin: 0;
|
|
background: #0d1117;
|
|
color: #e6edf3;
|
|
font: 15px/1.6 system-ui, sans-serif;
|
|
}
|
|
header.fake {
|
|
padding: 14px 20px;
|
|
background: #161b22;
|
|
border-bottom: 1px solid #30363d;
|
|
font-weight: 600;
|
|
}
|
|
main { padding: 24px 20px; max-width: 620px; }
|
|
code { background: #161b22; padding: 2px 5px; border-radius: 4px; font-size: 13px; }
|
|
/* So rechnet eine App mit Vollhöhe die Leiste heraus: */
|
|
.full { height: calc(100vh - var(--honeybar-h, 0px)); }
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<header class="fake">Irgendeine App (dunkles Theme, eigene Schrift)</header>
|
|
<main>
|
|
<p>Die Leiste oben kommt aus <code>honeybar.js</code> und gehört nicht zu dieser Seite.</p>
|
|
<p>
|
|
Sie liegt in einem Shadow DOM: nichts von hier färbt auf sie ab, nichts von ihr auf
|
|
diese Seite. <code>data-app="inknote"</code> markiert, wo man gerade ist.
|
|
</p>
|
|
<p>Eine App, die mit <code>100vh</code> rechnet, nimmt <code>--honeybar-h</code> ab.</p>
|
|
</main>
|
|
|
|
<script src="./honeybar.js" data-app="inknote" data-home="/"></script>
|
|
</body>
|
|
</html>
|