Nikurasu/elk
1
0
Fork 0
forked from Mirrors/elk
Code Pull requests Releases 2 Packages 1 Activity

docs: update pwa icons

Browse source
This commit is contained in:
userquin 2023-05-26 12:08:04 +02:00
parent 6c8cd72e52
commit e5352af1a6
1 changed files with 6 additions and 2 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

8
docs/content/80.pwa.md
View file

@ -105,6 +105,10 @@ You can check web manifest generation on [modules/pwa/i18n.ts](https://github.co
### PWA Icons ### PWA Icons
::alert{type="info"}
**WIP:** We are working to generate PWA icons using a Node script.
::
Elk icons have been generated using [PWA Builder Image Generator](https://www.pwabuilder.com/imageGenerator), we generate the icons twice per environment: transparent and maskable icons. Elk icons have been generated using [PWA Builder Image Generator](https://www.pwabuilder.com/imageGenerator), we generate the icons twice per environment: transparent and maskable icons.
To generate transparent icons: To generate transparent icons:
@ -130,11 +134,11 @@ Once generated, we use the following icons:
- `android/android-launchericon-512x512.png` for `maskable-icon.png` - `android/android-launchericon-512x512.png` for `maskable-icon.png`
::alert{type="info"} ::alert{type="info"}
**Note 1:** to generate `favicon.ico` we use [RealFaviconGenerator](https://realfavicongenerator.net/), we upload `logo.svg` from `public` folders: `public`, ` public-dev` and `public-staging`. **Note 1:** `apple-touch-icon` icons have been generated with external tools.
:: ::
::alert{type="info"} ::alert{type="info"}
**Note 2:** Safari don't use `apple-touch-icon` and so we don't need to generate it anymore: we use [RealFaviconGenerator](https://realfavicongenerator.net/) to generate it, using white background color and 10px of padding. **Note 2:** to generate `favicon.ico` icons, we use [RealFaviconGenerator](https://realfavicongenerator.net/) providing `logo.svg` from `public` folders: `public`, ` public-dev` and `public-staging`.
:: ::
### PWA UI Components ### PWA UI Components