Leçon 8 : composants RTL — construire pour les deux sens
L'application a l'air parfaite en anglais. Tu passes en hébreu, et soudain l'espacement est du mauvais côté, le texte s'aligne à gauche, et la flèche « retour » pointe dans le mauvais sens. Cette leçon t'apprend à construire des composants avec des `logical properties` — `ms-4` au lieu de `ml-4` — q
Une logical property, c'est comme dire « la main avec laquelle tu écris » au lieu de « la main droite » — c'est correct que tu sois droitier ou gaucher. `ms-4` signifie « margin du côté de départ », donc ça atterrit du bon côté, aussi bien en hébreu qu'en anglais.
- logical property
- Une propriété qui se réfère à « début » et « fin » selon le sens d'écriture (`ms`, `me`, `ps`, `text-start`) plutôt qu'à « gauche » et « droite » — donc elle s'inverse d'elle-même en RTL.
- physical property
- Une propriété qui attache une valeur à un côté fixe de l'écran (`ml`, `mr`, `text-left`). Elle ignore le sens d'écriture, donc elle reste du même côté même quand l'UI passe en RTL — ce qui casse la mise en page.
- dir attribute
- L'attribut `dir="rtl"` ou `dir="ltr"` (généralement sur `<html>`) qui définit le sens d'écriture. Les logical properties s'appuient dessus pour savoir dans quel sens pointe « début ».
- icon mirroring
- Inverser horizontalement les icônes directionnelles (flèche retour, chevron) en RTL pour qu'elles pointent correctement. Les icônes non directionnelles (un logo, un lecteur média) ne sont pas inversées.