⚡AgentSkills
🌐 Localization & i18n · String Engineering

Support RTL layouts properly

Logical properties, mirrored iconography decisions, and bidi text handling done right.

intermediate~35 minLocalization Engineersi18n DevelopersLocalization Managers

Steps

  1. 1Convert directional CSS to logical properties (margin-inline-start etc.)
  2. 2Decide per-icon mirroring: directionals mirror, brand/symbols don't
  3. 3Handle mixed-direction text with unicode-bidi isolation, not manual flips
  4. 4Test carousels/drawers/progress flows in RTL — they invert subtly
  5. 5Numbers/phone formats stay LTR within RTL paragraphs deliberately
  6. 6Screenshot-snapshot both directions in CI for every component

Common Pitfalls

  • ▲position:absolute left/right hardcodes exploding in Arabic
  • ▲Mirrored brand logos looking like counterfeits

Commands

Install with skills CLI
$ npx skills add aniruddhaadak80/skills --skill string-engineering-rtl-layout-support
Install globally
$ npx skills add aniruddhaadak80/skills --skill string-engineering-rtl-layout-support -g

Tags

#rtl#css#arabic#hebrew#localization-i18n#string-engineering

Related skills

Externalize strings without breaking the appfoundation

Systematic extraction, key naming, and context comments making translation safe.

🌐 Localization & i18n·~30m
Open →