back round 0 view raw

Add PWA support #10

merged

opened by

vielle.dev 2 months ago targeting main from vielle.dev/pdsls: pwa

The favicon is used when maskable icon is not supported.

https://web.dev/articles/maskable-icon

Has been tested in chromium on linux, chrome for android, and firefox for android.

options

unified split

Changed files

+23

index.html

public

manifest.json

pwa-maskable.png

index.html

···

       9
       9
        
           <meta property="og:url" content="https://pdsls.dev" />

     

       10
       10
        
           <meta property="og:description" content="Browse the public data on atproto" />

     

       11
       11
        
           <meta property="description" content="Browse the public data on atproto" />

     

       12
       12
       +
           <link rel="manifest" href="/manifest.json" />

     

       12
       13
        
           <title>PDSls</title>

     

       13
       14
        
           <link rel="preconnect" href="https://rsms.me/" />

     

       14
       15
        
           <link rel="stylesheet" href="https://rsms.me/inter/inter.css" />

+22

public/manifest.json

···

       1
       1
       +
       {

     

       2
       2
       +
         "name": "PDSls",

     

       3
       3
       +
         "description": "",

     

       4
       4
       +
         "id": "dev.pdsls",

     

       5
       5
       +
         "start_url": "/",

     

       6
       6
       +
         "display": "standalone",

     

       7
       7
       +
         "background_color": "#1f1f1f",

     

       8
       8
       +
         "theme_color": "#1f1f1f",

     

       9
       9
       +
         "icons": [

     

       10
       10
       +
           {

     

       11
       11
       +
             "src": "/favicon.png",

     

       12
       12
       +
             "type": "image/png",

     

       13
       13
       +
             "sizes": "512x512"

     

       14
       14
       +
           },

     

       15
       15
       +
           {

     

       16
       16
       +
             "src": "/pwa-maskable.png",

     

       17
       17
       +
             "type": "image/png",

     

       18
       18
       +
             "sizes": "512x512",

     

       19
       19
       +
             "purpose": "maskable"

     

       20
       20
       +
           }

     

       21
       21
       +
         ]

     

       22
       22
       +
       }

public/pwa-maskable.png

This is a binary file and will not be displayed.