L'app est désormais installable sur écran d'accueil (Android via Chrome,
iOS via Safari → Partager → Sur l'écran d'accueil). Identité visuelle
strictement alignée sur le SPA :
- background_color : crème (#FAF7F2)
- theme_color : rubis primaire (#9F1239)
- icon : gem 4-facettes sur canvas crème, padding 15% pour
safe-area maskable Android tout en remplissant
suffisamment iOS qui ne masque pas
3 formats générés depuis le SVG via @resvg/resvg-js :
- icon-192.png + icon-512.png (manifest, splashscreen Android)
- apple-touch-icon.png 180×180 (iOS home screen)
Plus la SVG vectorielle servie en favicon.
Le script `pnpm --filter @rubis/web run icons` re-génère tout depuis
`public/icon.svg` — utile si on retouche le design.
Drop le favicon.svg de 1.1 MB hérité du landing (vestige), remplacé par
notre gem propre à 1.1 KB.
Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
37 lines
1.1 KiB
JavaScript
37 lines
1.1 KiB
JavaScript
/**
|
||
* Génère les PNGs d'icône PWA depuis `public/icon.svg`.
|
||
*
|
||
* Sort :
|
||
* - public/icon-192.png (Android mostly, manifest)
|
||
* - public/icon-512.png (Android, splashscreen)
|
||
* - public/apple-touch-icon.png (iOS, 180×180 — recommandation Apple)
|
||
*
|
||
* À relancer si on touche au design de la gem :
|
||
* pnpm --filter @rubis/web run icons
|
||
*/
|
||
|
||
import { readFile, writeFile } from 'node:fs/promises'
|
||
import { fileURLToPath } from 'node:url'
|
||
import { dirname, join } from 'node:path'
|
||
import { Resvg } from '@resvg/resvg-js'
|
||
|
||
const __dirname = dirname(fileURLToPath(import.meta.url))
|
||
const ROOT = join(__dirname, '..')
|
||
const SRC = join(ROOT, 'public/icon.svg')
|
||
|
||
async function render(size, out) {
|
||
const svg = await readFile(SRC, 'utf-8')
|
||
const resvg = new Resvg(svg, {
|
||
fitTo: { mode: 'width', value: size },
|
||
background: '#FAF7F2',
|
||
})
|
||
const buf = resvg.render().asPng()
|
||
const dest = join(ROOT, 'public', out)
|
||
await writeFile(dest, buf)
|
||
console.log(`✓ ${out} (${size}×${size}, ${buf.byteLength.toLocaleString()} B)`)
|
||
}
|
||
|
||
await render(192, 'icon-192.png')
|
||
await render(512, 'icon-512.png')
|
||
await render(180, 'apple-touch-icon.png')
|