forked from Mirrors/elk
chore: dev and staging apple touch icons 0.45 padding
This commit is contained in:
parent
c411850750
commit
47a14fa0bb
3 changed files with 12 additions and 6 deletions
|
@ -109,7 +109,7 @@ You can check web manifest generation on [modules/pwa/i18n.ts](https://github.co
|
|||
**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 3 times per environment: transparent, apple touch and maskable icons.
|
||||
|
||||
To generate transparent icons:
|
||||
- upload `logo.svg` from `public` folders: `public`, ` public-dev` and `public-staging`
|
||||
|
@ -123,6 +123,16 @@ Once generated, we use the following icons:
|
|||
- `android/android-launchericon-192x192.png` for `pwa-192x192.png`
|
||||
- `android/android-launchericon-512x512.png` for `pwa-512x512.png`
|
||||
|
||||
To generate apple touch icons:
|
||||
- upload `logo.svg` from `public` folders: `public`, ` public-dev` and `public-staging`
|
||||
- configure `0,45` as padding
|
||||
- check `Custom` in background color and set `#ffffff` as color
|
||||
- check only `iOS` in platforms
|
||||
- click on `Generate` button
|
||||
|
||||
Once generated, we use the following icons:
|
||||
- `ios/180.png` for `apple-touch-icon.png`
|
||||
|
||||
To generate maskable icons:
|
||||
- upload `logo.svg` from `public` folders: `public`, ` public-dev` and `public-staging`
|
||||
- configure `0,6` as padding
|
||||
|
@ -134,11 +144,7 @@ Once generated, we use the following icons:
|
|||
- `android/android-launchericon-512x512.png` for `maskable-icon.png`
|
||||
|
||||
::alert{type="info"}
|
||||
**Note 1:** `apple-touch-icon` icons have been generated with external tools.
|
||||
::
|
||||
|
||||
::alert{type="info"}
|
||||
**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`.
|
||||
**Note:** to generate `favicon.ico` icons, we use [RealFaviconGenerator](https://realfavicongenerator.net/) providing `logo.svg` from `public` folders: `public`, ` public-dev` and `public-staging` (transparent 64x64 32 bit).
|
||||
::
|
||||
|
||||
### PWA UI Components
|
||||
|
|
Binary file not shown.
Before Width: | Height: | Size: 2 KiB After Width: | Height: | Size: 2.3 KiB |
Binary file not shown.
Before Width: | Height: | Size: 2.3 KiB After Width: | Height: | Size: 2.2 KiB |
Loading…
Reference in a new issue