You had to reload the tab by hand to pick up a new build, and when the service worker did reload it was an abrupt white flash. Now the build stamps version.json with the commit and the running app (which already knows its own __GIT_COMMIT__) polls it whenever the tab regains focus. When a newer build is live it cross-fades a themed curtain (the theme's own --bg + accent spinner) and reloads, then holds that curtain over the fresh load until the app mounts and fades it out - so it reads as an in-place refresh, no flash, no manual reload. If you're mid-message it waits until the composer is empty (or the tab is hidden) before reloading, and a loop guard stops it re-reloading for a commit it already tried. sw.js serves version.json network-only so the probe always sees the live id; index.html restores the themed bg pre-paint so dark themes don't flash light. Existing open tabs need one manual reload to pick up this machinery; after that it's automatic.
26 lines
1.7 KiB
HTML
26 lines
1.7 KiB
HTML
<!doctype html>
|
|
<html lang="fr">
|
|
<head>
|
|
<meta charset="UTF-8" />
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0, viewport-fit=cover, interactive-widget=resizes-content" />
|
|
<!-- Apply the saved theme before first paint so there's no flash of the light
|
|
default on load/reload. Full theme logic runs later in src/ui/theme.ts. -->
|
|
<script>try{var t=localStorage.getItem('tchatou-theme');if(t)document.documentElement.dataset.theme=t;if(sessionStorage.getItem('orbit:just-updated')==='1'){var b=sessionStorage.getItem('orbit:update-bg');if(b)document.documentElement.style.background=b}}catch(e){}</script>
|
|
<meta name="theme-color" content="#ffffff" />
|
|
<link rel="manifest" href="/app/manifest.webmanifest" />
|
|
<link rel="icon" href="/app/orbit-icon.svg" type="image/svg+xml" />
|
|
<link rel="apple-touch-icon" href="/app/apple-touch-icon.png" />
|
|
<meta name="apple-mobile-web-app-capable" content="yes" />
|
|
<meta name="apple-mobile-web-app-title" content="Tchatou" />
|
|
<!-- Pre-JS placeholder only; the real title is set at runtime from
|
|
config.branding.name in src/App.tsx. -->
|
|
<title>Tchatou</title>
|
|
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
|
<link href="https://fonts.googleapis.com/css2?family=Fraunces:ital,opsz,wght@0,9..144,400;0,9..144,500;0,9..144,600;0,9..144,700;1,9..144,500;1,9..144,600;1,9..144,700&family=Geist:wght@300;400;500;600;700;800&family=Geist+Mono:wght@400;500;600&family=Hanken+Grotesk:wght@400;500;600;700;800&display=swap" rel="stylesheet" />
|
|
</head>
|
|
<body>
|
|
<div id="root"></div>
|
|
<script type="module" src="/src/main.tsx"></script>
|
|
</body>
|
|
</html>
|