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>
23 lines
1.1 KiB
XML
23 lines
1.1 KiB
XML
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" width="512" height="512">
|
|
<!--
|
|
Icon PWA / apple-touch-icon — gem rubis sur fond crème.
|
|
Reprend exactement <Gem/> du SPA. Padding ~15% sur chaque bord pour
|
|
rester safe en maskable Android (le spec demande ≥80% de safe area
|
|
au centre) tout en remplissant assez le canvas pour iOS qui ne masque
|
|
pas.
|
|
-->
|
|
<rect width="512" height="512" fill="#FAF7F2"/>
|
|
<g transform="translate(76 76) scale(3.6)">
|
|
<!-- Facette haut-gauche (lumière) -->
|
|
<polygon points="50,6 6,50 50,50" fill="#9F1239" fill-opacity="1"/>
|
|
<!-- Facette haut-droite -->
|
|
<polygon points="50,6 94,50 50,50" fill="#9F1239" fill-opacity="0.8"/>
|
|
<!-- Facette bas-gauche -->
|
|
<polygon points="6,50 50,50 50,94" fill="#9F1239" fill-opacity="0.65"/>
|
|
<!-- Facette bas-droite (ombre) -->
|
|
<polygon points="50,50 94,50 50,94" fill="#9F1239" fill-opacity="0.48"/>
|
|
<!-- Contour propre -->
|
|
<polygon points="50,6 94,50 50,94 6,50" fill="none" stroke="#9F1239" stroke-width="1.6" stroke-linejoin="round"/>
|
|
</g>
|
|
</svg>
|