الدرس 4: RTL و PWA — واجهة تعمل باللغتين وتُثبَّت كتطبيق

تطبيق تقنية مالية إسرائيلي معروف: جميل — لكن الأرقام محاذاة لليسار، والأزرار تفيض على iOS، وخط إنجليزي على محتوى عبري. أربعة أخطاء في لقطة شاشة واحدة. جميعها يمكن تفاديها باستخدام CSS logical properties.

خاصية CSS logical تفهم اتجاه النص. بدلاً من 'أضف مسافة على اليسار'، تقول 'أضف مسافة عند البداية'. في RTL، 'البداية' هي اليمين. في LTR، 'البداية' هي اليسار.

CSS logical properties: خصائص CSS التي تشير إلى اتجاه النص ('start'، 'end') بدلاً من الاتجاه الفيزيائي ('left'، 'right'). تعمل بشكل صحيح في كل من RTL و LTR.
PWA (Progressive Web App): تطبيق ويب يمكن تثبيته على الشاشة الرئيسية لـ iOS/Android، ويعمل بدون اتصال، ويظهر بلا address bar مثل native app.
BiDi (Bidirectional text): نص يمزج بين الاتجاهات — عبري مع أرقام أجنبية، وأسماء علامات تجارية بالإنجليزية داخل جمل عبرية. يتعامل مع هذا HTML ‎`<bdi>`‎ و CSS ‎`unicode-bidi`‎.