chore: add generate pwa icons script (#2130)

This commit is contained in:
Joaquín Sánchez 2023-05-29 16:52:27 +02:00 committed by GitHub
parent 0767df3f78
commit d601a117c0
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
28 changed files with 449 additions and 9 deletions

View file

@ -103,6 +103,16 @@ Elk will generate 2 web manifests per locale, one for light theme and one for da
You can check web manifest generation on [modules/pwa/i18n.ts](https://github.com/elk-zone/elk/blob/main/modules/pwa/i18n.ts) module.
### PWA Icons
Elk's favicon and PWA icons are generated from [Elk's SVG Logo](https://github.com/elk-zone/elk/blob/main/public/logo.svg) via [custom script](https://github.com/elk-zone/elk/blob/main/scripts/generate-pwa-icons.ts), using [sharp](https://github.com/lovell/sharp/) and [sharp-io](https://github.com/ssnangua/sharp-ico) libraries:
- favicon.ico: transparent 64x64 32-bits icon
- pwa-64x64.png: transparent 64x64 8-bits icon (optimized from 32-bitss color)
- pwa-192x192.png: transparent 192x192 8-bits icon (optimized from 32-bits color)
- pwa-512x512.png: transparent 512x512 8-bits icon (optimized from 32-bit color)
- maskable-icon.png: white background 512x512 8-bits icon (optimized from 32-bits color)
- apple-touch-icon.png: white background 180x180 8-bits icon (optimized from 32-bits color)
### PWA UI Components
Elk will provide a set of UI components to allow you to customize the PWA installation prompt on browsers with [beforeinstallprompt](https://web.dev/customize-install/) support.