fix(PWA): full screen Android

Borghese-Gladiator · Jun 19, 2024 · b0e4aac · b0e4aac
1 parent 26de679
commit b0e4aac
Show file tree

Hide file tree

Showing 2 changed files with 21 additions and 2 deletions.
diff --git a/app/public/manifest.json b/app/public/manifest.json
@@ -0,0 +1,15 @@
+{
+  "name": "Home Cooking PWA",
+  "short_name": "HC_PWA",
+  "display": "standalone",
+  "start_url": "/?standalone=true",
+  "background_color": "#FFFFFF",
+  "theme_color": "#000000",
+  "icons": [
+    {
+      "src": "/path/to/icon.png",
+      "sizes": "512x512",
+      "type": "image/png"
+    }
+  ]
+}
diff --git a/app/src/pages/index.tsx b/app/src/pages/index.tsx
@@ -52,8 +52,12 @@ export default function Home() {
       <Head>
         <title>Home Cooking PWA</title>
         <meta name="description" content="" />
-        <meta name="viewport" content="width=device-width, initial-scale=1" />
-        <link rel="icon" href="/favicon.ico" />
+        <meta name="viewport" content="width=device-width; initial-scale=1; viewport-fit=cover"></meta>
+        <meta name="mobile-web-app-capable" content="yes">
+        <meta name="apple-mobile-web-app-capable" content="yes">
+
+        <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent"></meta>
+        <link rel="icon" href="/images/favicon.ico" />
       </Head>
       <main>
         <Box sx={{ display: 'flex', alignItems: 'center', borderBottom: 1, borderColor: 'divider' }}>