jeremy bayseandClaude Sonnet 5
5352f39887
Adds what iOS/Android need to treat the site as an installable app from Safari's "Add to Home Screen": a manifest.json, apple-touch-icon set generated from the existing logo mark (scripts/generate-icons.mjs, sharp as a dev dependency), and the apple-mobile-web-app-* meta tags iOS Safari requires since it ignores manifest.json entirely. The service worker is deliberately minimal — this app shows live financial data, so navigations always hit the network first. It only caches enough to serve offline.html when there's no connection, not a full offline-first app shell. Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
51 lines
1.9 KiB
HTML
51 lines
1.9 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="fr">
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
<title>SuiviCPT — Hors ligne</title>
|
|
<style>
|
|
body {
|
|
margin: 0;
|
|
min-height: 100vh;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
background: #f5ead8;
|
|
color: #201e1d;
|
|
font-family: system-ui, -apple-system, sans-serif;
|
|
text-align: center;
|
|
padding: 24px;
|
|
box-sizing: border-box;
|
|
}
|
|
.card { max-width: 320px; }
|
|
.badge {
|
|
width: 64px; height: 64px; border-radius: 50%;
|
|
background: #c67139; margin: 0 auto 20px;
|
|
display: flex; align-items: center; justify-content: center;
|
|
}
|
|
h1 { font-size: 20px; margin: 0 0 8px; }
|
|
p { font-size: 14px; color: #645c50; margin: 0 0 20px; }
|
|
button {
|
|
border: none; border-radius: 999px; padding: 12px 24px;
|
|
background: #c67139; color: #fff8ee; font-size: 14px; font-weight: 700;
|
|
cursor: pointer;
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<div class="card">
|
|
<div class="badge">
|
|
<svg width="28" height="28" viewBox="0 0 316 316" fill="none" xmlns="http://www.w3.org/2000/svg">
|
|
<circle cx="158" cy="158" r="140" stroke="#fff8ee" stroke-width="16"/>
|
|
<path d="M90 196 L134 142 L172 174 L238 96" stroke="#fff8ee" stroke-width="18" stroke-linecap="round" stroke-linejoin="round"/>
|
|
<path d="M238 96 L238 138 M238 96 L196 96" stroke="#fff8ee" stroke-width="18" stroke-linecap="round" stroke-linejoin="round"/>
|
|
</svg>
|
|
</div>
|
|
<h1>Pas de connexion</h1>
|
|
<p>SuiviCPT a besoin d'internet pour afficher tes données à jour.</p>
|
|
<button onclick="location.reload()">Réessayer</button>
|
|
</div>
|
|
</body>
|
|
</html>
|