Files
HamHam/public/offline.html

71 lines
1.9 KiB
HTML

<!doctype html>
<html lang="de">
<meta charset="utf-8" /><meta name="viewport" content="width=device-width,initial-scale=1" /><meta
name="theme-color"
content="#365747"
/><title>HamHam · Offline</title
><style>
body {
background: #faf8f4;
color: #253b32;
font: 16px/1.7 system-ui;
margin: 0;
padding: 50px 25px;
}
main {
max-width: 600px;
margin: auto;
}
h1 {
font: 44px Georgia;
}
a {
color: #365747;
}
li {
margin: 12px 0;
}
button {
background: #365747;
color: white;
border: 0;
padding: 14px 22px;
border-radius: 9px;
font: inherit;
}
</style>
<main>
<p>HAMHAM · DEIN KOCHBUCH</p>
<h1>Ein Moment ohne Netz.</h1>
<p>
Diese Seite ist noch nicht auf deinem Gerät gespeichert. Bereits online geöffnete Rezept- und
Kochseiten findest du hier. Für neue Rezepte und die Verwaltung brauchst du eine Verbindung.
</p>
<ul id="recipes"></ul>
<button onclick="location.reload()">Verbindung erneut prüfen</button>
</main>
<script>
caches
.open('hamham-public-v1')
.then((c) => c.keys())
.then((keys) => {
const list = document.querySelector('#recipes');
keys
.filter((r) => new URL(r.url).pathname.startsWith('/rezepte/'))
.forEach((r) => {
let li = document.createElement('li'),
a = document.createElement('a'),
url = new URL(r.url);
a.href = r.url;
let cook = url.pathname.endsWith('/kochen');
a.textContent =
(cook ? 'Kochvorgang fortsetzen' : 'Gespeichertes Rezept öffnen') +
' · ' +
url.pathname.split('/')[2].slice(0, 8);
li.append(a);
list.append(li);
});
});
</script>
</html>