الدرس 8: مكوّنات RTL — البناء للاتجاهين معًا
يبدو التطبيق مثاليًا بالإنجليزية. تنتقل إلى العبرية، وفجأة تصبح المسافات في الجهة الخاطئة، ويُحاذى النص إلى اليسار، ويشير سهم 'الرجوع' إلى الاتجاه الخاطئ. يعلّمك هذا الدرس بناء مكوّنات باستخدام `logical properties` — `ms-4` بدلًا من `ml-4` — تنقلب من تلقاء نفسها تحت `dir="rtl"`، بحيث يعمل ال
المُعامل المنطقي أشبه بقول 'اليد التي تكتب بها' بدلًا من 'اليد اليمنى' — فهو صحيح سواء كنت أعسر أو أيمن. تعني `ms-4` 'هامش في جهة البداية'، لذا يستقر في الجهة الصحيحة بالعبرية والإنجليزية معًا.
- مُعامل منطقي
- مُعامل يشير إلى 'البداية' و'النهاية' وفق اتجاه الكتابة (`ms`، `me`، `ps`، `text-start`) بدلًا من 'اليسار' و'اليمين' — لذا ينقلب من تلقاء نفسه في RTL.
- مُعامل فيزيائي
- مُعامل يربط قيمة بجهة ثابتة من الشاشة (`ml`، `mr`، `text-left`). إنه غير مدرك للاتجاه، لذا يبقى في الجهة نفسها حتى عندما تنقلب الواجهة إلى RTL — فيكسر التخطيط.
- خاصية dir
- الخاصية `dir="rtl"` أو `dir="ltr"` (عادةً على `<html>`) التي تحدّد اتجاه الكتابة. تعتمد المُعاملات المنطقية عليها لتعرف إلى أي جهة تشير 'البداية'.
- عكس الأيقونات
- قلب الأيقونات الاتجاهية أفقيًا (سهم الرجوع، chevron) في RTL كي تشير بشكل صحيح. أما الأيقونات غير الاتجاهية (شعار، مشغّل وسائط) فلا تُعكس.