From 9fbbd0130f2b6570a6b979349d1f31ab370f8b53 Mon Sep 17 00:00:00 2001
From: Dorian <dorian@Dorians-MacBook-Air.local>
Date: Fri, 15 May 2026 15:00:10 -0500
Subject: [PATCH] Improve mobile PWA safe areas and push retry

---
 public/manifest.webmanifest   |  1 +
 public/sw.js                  |  2 +-
 src/App.vue                   |  7 ++++++-
 src/services/notifications.js | 17 ++++++++++++++---
 src/style.css                 |  8 ++++++++
 5 files changed, 30 insertions(+), 5 deletions(-)

diff --git a/public/manifest.webmanifest b/public/manifest.webmanifest
index 405cfde..c3bae07 100644
--- a/public/manifest.webmanifest
+++ b/public/manifest.webmanifest
@@ -6,6 +6,7 @@
   "scope": "/",
   "id": "/",
   "display": "standalone",
+  "display_override": ["fullscreen", "standalone"],
   "orientation": "portrait",
   "background_color": "#000000",
   "theme_color": "#000000",
diff --git a/public/sw.js b/public/sw.js
index a2bc3a5..2a964c1 100644
--- a/public/sw.js
+++ b/public/sw.js
@@ -1,4 +1,4 @@
-const CACHE_NAME = 'l484-pwa-v6'
+const CACHE_NAME = 'l484-pwa-v7'
 const APP_SHELL = [
   '/',
   '/manifest.webmanifest',
diff --git a/src/App.vue b/src/App.vue
index 848e1ec..d1df5bb 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -399,6 +399,7 @@ const heroBackgroundEntries = computed(() =>
     .map((background, index) => ({ background, index }))
     .filter(({ index }) => loadedHeroBackgroundIndexes.value.has(index)),
 )
+const currentHeroBackground = computed(() => heroBackgrounds[activeBackground.value] || heroBackgrounds[0] || '')
 
 const sanitizeText = (value, maxLength) =>
   String(value ?? '')
@@ -2139,6 +2140,10 @@ onMounted(async () => {
   }
 })
 
+watch(currentHeroBackground, (background) => {
+  document.documentElement.style.setProperty('--safe-area-bg-image', background ? `url(${background})` : '#000')
+}, { immediate: true })
+
 onBeforeUnmount(() => {
   window.clearInterval(backgroundTimer)
   window.clearTimeout(adminToastTimer)
@@ -2336,7 +2341,7 @@ watch(mobileMenuOpen, (open) => {
     <section
       v-if="isHomeRoute"
       class="hero-fold relative isolate min-h-screen overflow-hidden"
-      :style="{ '--safe-area-bg-image': `url(${heroBackgrounds[activeBackground] || heroBackgrounds[0] || ''})` }"
+      :style="{ '--safe-area-bg-image': `url(${currentHeroBackground})` }"
     >
       <div class="hero-bg-layer">
         <img
diff --git a/src/services/notifications.js b/src/services/notifications.js
index cba40df..c43963c 100644
--- a/src/services/notifications.js
+++ b/src/services/notifications.js
@@ -63,19 +63,30 @@ const saveSubscription = async (subscription) => {
   return data
 }
 
-const subscribeWithRetry = async (registration, applicationServerKey) => {
+const subscribeWithKey = async (registration, applicationServerKey) => {
   try {
     return await registration.pushManager.subscribe({ userVisibleOnly: true, applicationServerKey })
+  } catch (error) {
+    if (applicationServerKey instanceof Uint8Array) {
+      return registration.pushManager.subscribe({ userVisibleOnly: true, applicationServerKey: applicationServerKey.buffer })
+    }
+    throw error
+  }
+}
+
+const subscribeWithRetry = async (registration, applicationServerKey) => {
+  try {
+    return await subscribeWithKey(registration, applicationServerKey)
   } catch (error) {
     await registration.update().catch(() => {})
     await new Promise((resolve) => window.setTimeout(resolve, 750))
     const activeRegistration = await navigator.serviceWorker.ready
     try {
-      return await activeRegistration.pushManager.subscribe({ userVisibleOnly: true, applicationServerKey })
+      return await subscribeWithKey(activeRegistration, applicationServerKey)
     } catch (retryError) {
       try {
         const repairedRegistration = await repairServiceWorkerRegistration()
-        return await repairedRegistration.pushManager.subscribe({ userVisibleOnly: true, applicationServerKey })
+        return await subscribeWithKey(repairedRegistration, applicationServerKey)
       } catch (repairError) {
         throw new Error(await explainSubscribeError(repairError || retryError || error))
       }
diff --git a/src/style.css b/src/style.css
index 92d121d..5556c5a 100644
--- a/src/style.css
+++ b/src/style.css
@@ -54,6 +54,10 @@ body::before {
   pointer-events: none;
 }
 
+.intro-header > div {
+  padding-top: calc(1.25rem + env(safe-area-inset-top));
+}
+
 body.menu-open {
   overflow: hidden;
 }
@@ -257,6 +261,10 @@ body.menu-open {
 }
 
 @media (max-width: 900px) {
+  .intro-header > div {
+    padding-top: calc(1.25rem + env(safe-area-inset-top));
+  }
+
   .hero-fold::before {
     display: block;
   }