Merge pull request #107 from mykhailodanilenko/feature/add-pwa-support

Add PWA support

OwnTube.tv/app/+html.tsx

@@ -8,6 +8,8 @@ export default function Root({ children }: PropsWithChildren) {
         <meta charSet="utf-8" />
         <meta httpEquiv="X-UA-Compatible" content="IE=edge" />
         <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no" />
+        {/* Link the PWA manifest file. */}
+        <link rel="manifest" href="manifest.json" />
         <style id="expo-reset">{"html, body { height: 100%; } #root { display: flex; height: 100%; flex: 1; }"}</style>
         <script src="https://vjs.zencdn.net/8.10.0/video.min.js"></script>
       </head>

OwnTube.tv/public/manifest.json

@@ -0,0 +1,42 @@
+{
+  "short_name": "OwnTube.tv",
+  "name": "OwnTube.tv",
+  "description": "A web client for OwnTube.tv",
+  "icons": [
+    {
+      "src": "favicon.ico",
+      "sizes": "48x48",
+      "type": "image/x-icon"
+    },
+    {
+      "src": "logo192.png",
+      "type": "image/png",
+      "sizes": "192x192"
+    },
+    {
+      "src": "logo512.png",
+      "type": "image/png",
+      "sizes": "512x512"
+    }
+  ],
+  "start_url": ".",
+  "display": "standalone",
+  "theme_color": "#000000",
+  "background_color": "#ffffff",
+  "screenshots": [
+    {
+      "src": "screenshot_wide.png",
+      "sizes": "1440x676",
+      "type": "image/png",
+      "form_factor": "wide",
+      "label": "OwnTube.tv"
+    },
+    {
+      "src": "screenshot_narrow.jpeg",
+      "sizes": "660x1280",
+      "type": "image/jpeg",
+      "form_factor": "narrow",
+      "label": "OwnTube.tv"
+    }
+  ]
+}