(Right to Left (The Mirror World
Apr 1, 2019Tryggvi Gylfason
Summary
This post details the technical challenges and solutions for implementing Right-to-Left (RTL) language support, specifically for Arabic, in the Spotify desktop client and web player. It covers mirroring UI layouts using the `dir` attribute and CSS (Flexbox, Grid, PostCSS-RTL), handling exceptions for elements like media playback controls, addressing punctuation and truncation issues with mixed LTR/RTL text using the Unicode Bidirectional Algorithm and `dir='auto'`, and considerations for Arabic fonts including letter spacing, font size, vertical cut-off, and capitalization. It also highlights the need for locale-aware separators for list items.