Merge pull request #3 from lukasbicus/implement-PWA

Implement PWA
lukasbicus · Oct 21, 2024 · 6a21814 · 6a21814
2 parents 2542b75 + be8a304
commit 6a21814
Show file tree

Hide file tree

Showing 12 changed files with 109 additions and 6 deletions.
diff --git a/app/favicon.ico b/app/favicon.ico
diff --git a/app/layout.tsx b/app/layout.tsx
@@ -25,6 +25,22 @@ export default function RootLayout({
 }>) {
   return (
     <html lang="en">
+      <head>
+        <link
+          rel="icon"
+          type="image/png"
+          href="/favicon-48x48.png"
+          sizes="48x48"
+        />
+        <link rel="icon" type="image/svg+xml" href="/favicon.svg" />
+        <link rel="shortcut icon" href="/favicon.ico" />
+        <link
+          rel="apple-touch-icon"
+          sizes="180x180"
+          href="/apple-touch-icon.png"
+        />
+        <link rel="manifest" href="/site.webmanifest" />
+      </head>
       <body
         className={`${geistSans.variable} ${geistMono.variable} antialiased bg-zinc-50`}
       >

diff --git a/app/manifest.ts b/app/manifest.ts
@@ -0,0 +1,27 @@
+import type { MetadataRoute } from 'next';
+
+export default function manifest(): MetadataRoute.Manifest {
+  return {
+    name: 'The loyalty app application',
+    short_name: 'Tilda',
+    description: 'A loyalty card app',
+    start_url: '/',
+    display: 'standalone',
+    theme_color: '#db924b',
+    background_color: '#db924b',
+    icons: [
+      {
+        src: '/web-app-manifest-192x192.png',
+        sizes: '192x192',
+        type: 'image/png',
+        purpose: 'maskable',
+      },
+      {
+        src: '/web-app-manifest-512x512.png',
+        sizes: '512x512',
+        type: 'image/png',
+        purpose: 'maskable',
+      },
+    ],
+  };
+}
diff --git a/plan.md b/plan.md
@@ -1,13 +1,14 @@
 https://app.uizard.io/prototypes/VOVVrBm1VBTdBwnrLrGB/player/preview
 
 Features:
+
 1. must have are with bold
 2. nice to have are with italics
-3. optional are with normal font 
- 
+3. optional are with normal font
+
 - [ ] **Welcome page**
   - [ ] **add navigation to my cards page**
-  - [ ] _add navigation to about page_
+  - [ ] **add navigation to about page**
 - [ ] Utils
   - [ ] add theme switching
   - [ ] **implement PWA**
@@ -21,7 +22,7 @@ Features:
   - [ ] e2e tests
 - [ ] **Add cards page**
   - [ ] **display list of predefined companies**
-  - [ ] display grid of predefined companies  + switch to grid
+  - [ ] display grid of predefined companies + switch to grid
   - [ ] _implement search in predefined companies_
   - [ ] **implement add card button + navigation to scan code page**
   - [ ] _implement click on predefined company + navigation to create card page_
@@ -42,7 +43,7 @@ Features:
   - [ ] **implement navigation to card detail**
 - [ ] **Card detail page**
   - [ ] **display page with bar / qr code**
-  - [ ] implement switch note visibility 
+  - [ ] implement switch note visibility
   - [ ] _implement delete card dialog + remove card from local storage_
   - [ ] _implement navigation to edit card page_
   - [ ] implement increment of display count
@@ -64,4 +65,4 @@ Features:
 - [ ] Import data page
 - [ ] _About page_
 - [ ] **About author page**
-- [ ] Help page
+- [ ] Help page
diff --git a/public/apple-touch-icon.png b/public/apple-touch-icon.png
diff --git a/public/favicon-48x48.png b/public/favicon-48x48.png
diff --git a/public/favicon.ico b/public/favicon.ico
diff --git a/public/favicon.svg b/public/favicon.svg
diff --git a/public/logo.svg b/public/logo.svg
diff --git a/public/site.webmanifest b/public/site.webmanifest
@@ -0,0 +1,21 @@
+{
+  "name": "The loalty app application",
+  "short_name": "Tilda",
+  "icons": [
+    {
+      "src": "/web-app-manifest-192x192.png",
+      "sizes": "192x192",
+      "type": "image/png",
+      "purpose": "maskable"
+    },
+    {
+      "src": "/web-app-manifest-512x512.png",
+      "sizes": "512x512",
+      "type": "image/png",
+      "purpose": "maskable"
+    }
+  ],
+  "theme_color": "#db924b",
+  "background_color": "#db924b",
+  "display": "standalone"
+}
diff --git a/public/web-app-manifest-192x192.png b/public/web-app-manifest-192x192.png
diff --git a/public/web-app-manifest-512x512.png b/public/web-app-manifest-512x512.png