Make SuiviCPT an installable PWA

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>
This commit is contained in:
jeremy bayse
2026-08-03 11:03:37 +02:00
co-authored by Claude Sonnet 5
parent 6a776b0042
commit 5352f39887
15 changed files with 788 additions and 0 deletions
+1
View File
@@ -8,6 +8,7 @@
<title>{{ config('app.name', 'Laravel') }}</title>
@include('partials.theme-script')
@include('partials.pwa-meta')
<!-- Fonts -->
<link rel="preconnect" href="https://fonts.bunny.net">
+1
View File
@@ -8,6 +8,7 @@
<title>{{ config('app.name', 'Laravel') }}</title>
@include('partials.theme-script')
@include('partials.pwa-meta')
<!-- Fonts -->
<link rel="preconnect" href="https://fonts.bunny.net">
@@ -0,0 +1,18 @@
<link rel="manifest" href="/manifest.json">
<meta name="theme-color" content="#c67139">
{{-- iOS Safari ignores manifest.json entirely it needs its own tags to
treat the site as an installable, standalone app. --}}
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">
<meta name="apple-mobile-web-app-title" content="{{ config('app.name', 'SuiviCPT') }}">
<link rel="apple-touch-icon" href="/icons/apple-touch-icon.png">
<link rel="apple-touch-icon" sizes="152x152" href="/icons/apple-touch-icon-152.png">
<link rel="apple-touch-icon" sizes="167x167" href="/icons/apple-touch-icon-167.png">
<link rel="apple-touch-icon" sizes="180x180" href="/icons/apple-touch-icon.png">
<script>
if ('serviceWorker' in navigator) {
window.addEventListener('load', () => navigator.serviceWorker.register('/sw.js'));
}
</script>