feat(pwa): make Mila app installable with PWA manifest, service worker and high-res icons

2026-10-11 20:57:50 +02:00
parent 1ccab5e522
commit 694d0c5072
7 changed files with 254 additions and 22 deletions
@@ -0,0 +1,15 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512">
+  <defs>
+    <linearGradient id="bg" x1="0%" y1="0%" x2="100%" y2="100%">
+      <stop offset="0%" stop-color="#7c3aed"/>
+      <stop offset="55%" stop-color="#db2777"/>
+      <stop offset="100%" stop-color="#f59e0b"/>
+    </linearGradient>
+    <filter id="shadow" x="-20%" y="-20%" width="140%" height="140%">
+      <feDropShadow dx="0" dy="16" stdDeviation="20" flood-color="#000000" flood-opacity="0.5"/>
+    </filter>
+  </defs>
+  <rect width="512" height="512" rx="112" fill="url(#bg)"/>
+  <rect x="30" y="30" width="452" height="452" rx="96" fill="#090a0f" fill-opacity="0.88" stroke="rgba(255,255,255,0.15)" stroke-width="8" filter="url(#shadow)"/>
+  <text x="256" y="335" font-size="260" text-anchor="middle" font-family="-apple-system, BlinkMacSystemFont, Segoe UI Emoji, Apple Color Emoji, sans-serif">🧸</text>
+</svg>
@@ -0,0 +1,35 @@
+{
+  "name": "Mila — Schlaf & Entwicklung",
+  "short_name": "Mila",
+  "description": "Schlaf-, Trink- und Windeltagebuch für Mila Graf",
+  "start_url": "/family/mila.html",
+  "scope": "/",
+  "display": "standalone",
+  "orientation": "portrait-primary",
+  "background_color": "#090A0F",
+  "theme_color": "#090A0F",
+  "icons": [
+    {
+      "src": "/family/mila-icon-192.png",
+      "sizes": "192x192",
+      "type": "image/png",
+      "purpose": "any maskable"
+    },
+    {
+      "src": "/family/mila-icon-512.png",
+      "sizes": "512x512",
+      "type": "image/png",
+      "purpose": "any maskable"
+    },
+    {
+      "src": "/family/mila-apple-touch-icon.png",
+      "sizes": "180x180",
+      "type": "image/png"
+    },
+    {
+      "src": "/family/mila-icon.svg",
+      "sizes": "any",
+      "type": "image/svg+xml"
+    }
+  ]
+}
@@ -0,0 +1,26 @@
+// Minimal service worker for Mila PWA installability & offline resilience
+const CACHE_NAME = 'mila-v1';
+
+self.addEventListener('install', (event) => {
+  self.skipWaiting();
+});
+
+self.addEventListener('activate', (event) => {
+  event.waitUntil(
+    caches.keys().then((keys) =>
+      Promise.all(
+        keys.map((key) => {
+          if (key !== CACHE_NAME) return caches.delete(key);
+        })
+      )
+    ).then(() => self.clients.claim())
+  );
+});
+
+self.addEventListener('fetch', (event) => {
+  if (event.request.method !== 'GET') return;
+  // Network-first strategy: Always fetch live real-time updates from MinIO
+  event.respondWith(
+    fetch(event.request).catch(() => caches.match(event.request))
+  );
+});