Doc/adjust storybook

projects/ui-kit-schematics/README.fr.md

@@ -115,6 +115,36 @@ Non repris : les liens `parameters.design` vers notre fichier Figma — vous ne
 pouvez pas l'ouvrir, ils sont retirés à la copie. Remettez votre `node-id` si
 vous en avez un.
 
+### Assets (polices, images, favicon)
+
+La fondation pose l'arborescence d'assets maison sous `src/assets/`, et la déclare
+au builder pour qu'elle soit servie sous `/assets/`, le préfixe que `ui-image`
+construit (`assets/img/{marque}/{type}/…`) et que la story `ui-input-group` code en
+dur pour les drapeaux de son indicatif. Le `public/` d'`ng new` continue d'être
+servi à côté.
+
+```
+src/assets/
+├── favicon.png       ← placeholder, câblé dans votre index.html
+├── assets-map.json   ← l'index des images locales que lit ui-image (posé vide)
+├── fonts/{police,icon}/
+└── img/{common,brand1,brand2,brand3}/{jpg,png,svg}/
+```
+
+Deux fichiers sont fournis, tout le reste est un emplacement vide : les
+**drapeaux** (génériques, et sans eux la story d'indicatif téléphonique répond 404) et un **favicon** placeholder, sur lequel le `<link rel="icon">` de votre
+`index.html` est pointé, uniquement s'il porte encore le `favicon.ico` d'`ng
+new`, jamais par-dessus un href que vous avez choisi. L'ancien
+`public/favicon.ico` reste sur le disque, simplement plus référencé.
+
+**Aucun fichier de police n'est livré.** Les tokens ne font que _nommer_ les
+familles (`--fontfamily-base`), chacune terminée par une pile système : un projet
+sans police embarquée tombe donc sur le sans-serif de l'OS, pas sur le serif du
+navigateur. Déclarez les vôtres dans `src/styles/vendors/_fonts.scss`, créé avec
+le mixin `variable-font`, un exemple commenté, et déjà `@use` par `main.scss` ; il
+n'émet rien tant que vous n'avez rien décommenté. Même raisonnement pour les
+fixtures de démo de `ui-image` : c'est notre démo, pas votre fondation.
+
 ### Système de grille (Gridaflex)
 
 Question posée juste après le choix des composants : le projet utilise-t-il

projects/ui-kit-schematics/README.md

@@ -111,6 +111,30 @@ Not carried over: the `parameters.design` links to our Figma file — you cannot
 open it, so it is stripped at copy time. Put your own `node-id` back if you have
 one.
 
+### Assets (fonts, images, favicon)
+
+The foundation lays the house asset tree under `src/assets/`, and declares it to
+the builder so it is served under `/assets/`, the prefix `ui-image` resolves
+(`assets/img/{brand}/{type}/…`) and the one the `ui-input-group` story hardcodes
+for its dial-code flags. The `public/` folder `ng new` created keeps being served
+alongside it.
+
+```
+src/assets/
+├── favicon.png       ← placeholder, wired into your index.html
+├── assets-map.json   ← the local-image index ui-image reads (starts empty)
+├── fonts/{police,icon}/
+└── img/{common,brand1,brand2,brand3}/{jpg,png,svg}/
+```
+
+**No font file ships.** The tokens only _name_ families (`--fontfamily-base`),
+each ending in a system stack, so a project with no embedded font falls back to
+the OS sans-serif rather than the browser serif. Declare yours in
+`src/styles/vendors/_fonts.scss`, created with the `variable-font` mixin, a
+commented example, and already `@use`d by `main.scss`; it emits nothing until you
+uncomment something. Same reasoning for the `ui-image` demo fixtures: they are our
+demo, not your foundation.
+
 ### Grid system (Gridaflex)
 
 Asked, right after you pick your components: whether the project uses

projects/ui-kit-schematics/src/ng-add/files/main.scss

@@ -19,6 +19,10 @@
 // serif du navigateur. Gardez cette queue de pile quand vous surchargez.
 // -----------------------------------------------------------------------------
 
+// ✏️ Vos polices : `@font-face` + surcharge de `--fontfamily-*`. Vide par
+// défaut — voir le fichier et `src/assets/README.md`.
+@use "vendors/fonts";
+
 // 🔒 Tokens générés — régénérés par `npm run tokens:build`, jamais édités à la main.
 @use "ui-kit/generated/tokens";
 

projects/ui-kit-schematics/src/ng-add/files/variables.scss

@@ -12,11 +12,13 @@
 // -----------------------------------------------------------------------------
 
 /** Chemins des images */
-$path-img: "../assets/images/" !default;
-$path-jpg: "#{$path-img}jpg/" !default;
-$path-png: "#{$path-img}png/" !default;
-$path-svg: "#{$path-img}svg/" !default;
+$path-img: "../assets/img/" !default;
+$path-common: "#{$path-img}common/" !default;
+$path-jpg: "#{$path-common}jpg/" !default;
+$path-png: "#{$path-common}png/" !default;
+$path-svg: "#{$path-common}svg/" !default;
 
 /** Chemins des polices */
 $path-font: "../assets/fonts/" !default;
+$path-police: "#{$path-font}police/" !default;
 $path-icon: "#{$path-font}icon/" !default;