diff --git a/modules/pwa/i18n.ts b/modules/pwa/i18n.ts index a67297d1fc..7539c7e5ab 100644 --- a/modules/pwa/i18n.ts +++ b/modules/pwa/i18n.ts @@ -83,11 +83,23 @@ export async function createI18n(): Promise { sizes: '64x64', type: 'image/png', }, + { + src: 'monochrome-64x64.png', + sizes: '64x64', + type: 'image/png', + purpose: 'monochrome', + }, { src: 'pwa-192x192.png', sizes: '192x192', type: 'image/png', }, + { + src: 'monochrome-192x192.png', + sizes: '192x192', + type: 'image/png', + purpose: 'monochrome', + }, { src: 'pwa-512x512.png', sizes: '512x512', @@ -100,6 +112,12 @@ export async function createI18n(): Promise { type: 'image/png', purpose: 'maskable', }, + { + src: 'monochrome-512x512.png', + sizes: '512x512', + type: 'image/png', + purpose: 'monochrome', + }, ], share_target: { action: '/web-share-target', diff --git a/public-dev/apple-touch-icon.png b/public-dev/apple-touch-icon.png index 8e43d9a388..a334dc0e03 100644 Binary files a/public-dev/apple-touch-icon.png and b/public-dev/apple-touch-icon.png differ diff --git a/public-dev/maskable-icon.png b/public-dev/maskable-icon.png index 277ad08488..16ed3e2df0 100644 Binary files a/public-dev/maskable-icon.png and b/public-dev/maskable-icon.png differ diff --git a/public-dev/monochrome-192x192.png b/public-dev/monochrome-192x192.png new file mode 100644 index 0000000000..e7ba829294 Binary files /dev/null and b/public-dev/monochrome-192x192.png differ diff --git a/public-dev/monochrome-512x512.png b/public-dev/monochrome-512x512.png new file mode 100644 index 0000000000..403cfad528 Binary files /dev/null and b/public-dev/monochrome-512x512.png differ diff --git a/public-dev/monochrome-64x64.png b/public-dev/monochrome-64x64.png new file mode 100644 index 0000000000..94212c420e Binary files /dev/null and b/public-dev/monochrome-64x64.png differ diff --git a/public-dev/pwa-192x192.png b/public-dev/pwa-192x192.png index 3529681263..a26b75c593 100644 Binary files a/public-dev/pwa-192x192.png and b/public-dev/pwa-192x192.png differ diff --git a/public-dev/pwa-512x512.png b/public-dev/pwa-512x512.png index ed9560e390..2bc165e1d9 100644 Binary files a/public-dev/pwa-512x512.png and b/public-dev/pwa-512x512.png differ diff --git a/public-dev/pwa-64x64.png b/public-dev/pwa-64x64.png index c3c0f1e406..ab5bbdba4e 100644 Binary files a/public-dev/pwa-64x64.png and b/public-dev/pwa-64x64.png differ diff --git a/public-staging/apple-touch-icon.png b/public-staging/apple-touch-icon.png index 46a0fa76bc..0331210bc2 100644 Binary files a/public-staging/apple-touch-icon.png and b/public-staging/apple-touch-icon.png differ diff --git a/public-staging/maskable-icon.png b/public-staging/maskable-icon.png index 901e510053..1ea7c77b01 100644 Binary files a/public-staging/maskable-icon.png and b/public-staging/maskable-icon.png differ diff --git a/public-staging/monochrome-192x192.png b/public-staging/monochrome-192x192.png new file mode 100644 index 0000000000..e7ba829294 Binary files /dev/null and b/public-staging/monochrome-192x192.png differ diff --git a/public-staging/monochrome-512x512.png b/public-staging/monochrome-512x512.png new file mode 100644 index 0000000000..403cfad528 Binary files /dev/null and b/public-staging/monochrome-512x512.png differ diff --git a/public-staging/monochrome-64x64.png b/public-staging/monochrome-64x64.png new file mode 100644 index 0000000000..94212c420e Binary files /dev/null and b/public-staging/monochrome-64x64.png differ diff --git a/public-staging/pwa-192x192.png b/public-staging/pwa-192x192.png index d12180b741..6d06cee02d 100644 Binary files a/public-staging/pwa-192x192.png and b/public-staging/pwa-192x192.png differ diff --git a/public-staging/pwa-512x512.png b/public-staging/pwa-512x512.png index e08371c916..005c46ff5d 100644 Binary files a/public-staging/pwa-512x512.png and b/public-staging/pwa-512x512.png differ diff --git a/public-staging/pwa-64x64.png b/public-staging/pwa-64x64.png index caaf1c76ca..fac09d2086 100644 Binary files a/public-staging/pwa-64x64.png and b/public-staging/pwa-64x64.png differ diff --git a/public/apple-touch-icon.png b/public/apple-touch-icon.png index 93217ec0f4..a6413b881e 100644 Binary files a/public/apple-touch-icon.png and b/public/apple-touch-icon.png differ diff --git a/public/maskable-icon.png b/public/maskable-icon.png index 64ac7ac89a..11be75d492 100644 Binary files a/public/maskable-icon.png and b/public/maskable-icon.png differ diff --git a/public/monochrome-192x192.png b/public/monochrome-192x192.png new file mode 100644 index 0000000000..e7ba829294 Binary files /dev/null and b/public/monochrome-192x192.png differ diff --git a/public/monochrome-512x512.png b/public/monochrome-512x512.png new file mode 100644 index 0000000000..403cfad528 Binary files /dev/null and b/public/monochrome-512x512.png differ diff --git a/public/monochrome-64x64.png b/public/monochrome-64x64.png new file mode 100644 index 0000000000..94212c420e Binary files /dev/null and b/public/monochrome-64x64.png differ diff --git a/public/monochrome-logo.svg b/public/monochrome-logo.svg new file mode 100644 index 0000000000..f85e68e730 --- /dev/null +++ b/public/monochrome-logo.svg @@ -0,0 +1,42 @@ + + + + + + + + + + + + diff --git a/public/pwa-192x192.png b/public/pwa-192x192.png index 98ff658c90..a4fb2ebb87 100644 Binary files a/public/pwa-192x192.png and b/public/pwa-192x192.png differ diff --git a/public/pwa-512x512.png b/public/pwa-512x512.png index 9a2017281c..80b58bb0f9 100644 Binary files a/public/pwa-512x512.png and b/public/pwa-512x512.png differ diff --git a/public/pwa-64x64.png b/public/pwa-64x64.png index f3c91cef87..b2fda88c79 100644 Binary files a/public/pwa-64x64.png and b/public/pwa-64x64.png differ diff --git a/scripts/generate-pwa-icons.ts b/scripts/generate-pwa-icons.ts index 1072354680..4c8070528e 100644 --- a/scripts/generate-pwa-icons.ts +++ b/scripts/generate-pwa-icons.ts @@ -1,4 +1,4 @@ -import { rm, writeFile } from 'node:fs/promises' +import { copyFile, rm, writeFile } from 'node:fs/promises' import process from 'node:process' import { resolve } from 'pathe' import type { PngOptions, ResizeOptions } from 'sharp' @@ -189,6 +189,34 @@ async function generatePWAIcons(folders: string[], icons: Icons) { apple, ico, }))) + + const svgLogo = resolve(folders[0], 'monochrome-logo.svg') + + await generateTransparentIcons({ + png: { compressionLevel: 9, quality: 60 }, + iconName: (type, size) => { + switch (type) { + case 'transparent': + return `monochrome-${size}x${size}-temp.png` + case 'maskable': + return `maskable-icon-${size}x${size}.png` + case 'apple': + return `apple-touch-icon-${size}x${size}.png` + } + }, + transparent, + maskable, + apple, + ico, + }, svgLogo, folders[0]) + + // copy monochrome png files to public dev and staging folders + await Promise.all(folders.slice(1).map(async (folder) => { + await Promise.all(transparent.sizes.map(size => copyFile( + resolve(folders[0], `monochrome-${size}x${size}.png`), + resolve(folder, `monochrome-${size}x${size}.png`), + ))) + })) } console.log('Generating Elk PWA Icons...')