هل تعرف مثالاً لموضوع لا يعمل مع RTL؟ إذا كان الأمر كذلك، فانشر رابطًا للموضوع هنا وسأختبر نظريتي وأشرح ما يحدث خطأ بعد اختباره.
تعديل: إليك شرح للمشكلة:
بالنسبة لملفات CSS الموجودة في قاعدة كود Discourse الرئيسية، يتم إنشاء CSS الخاص بـ RTL عن طريق “قلب” معظم قواعد CSS التي تعتمد على اتجاه تخطيط الموقع. على سبيل المثال، يتم قلب padding-left إلى padding-right. يتم ذلك باستخدام أداة RTLcss: GitHub - discourse/rtlcss: A wrapper around the rtlcss npm package to flip CSS direction in Ruby.
المشكلة هي أن سمات Discourse لا يتم قلب قواعد CSS الخاصة بها. هذا يعني أنه إذا كان للموضوع قواعد CSS تحدد اتجاهًا، فسيكون الاتجاه هو نفسه عند استخدام لغة RTL كما هو الحال عند استخدام لغة LTR. إليك مثال بسيط على ذلك:
عند استخدام السمة مع واجهة RTL، لا يتم قلب padding-left: 8px; إلى padding-right: 8px; هذا يسبب مشكلة بسيطة في المحاذاة. أنا متأكد من وجود أمثلة لمشاكل أكبر تحدث عند استخدام السمات مع لغة RTL.
وينطبق الشيء نفسه على أي CSS تضيفه إلى سمة Discourse افتراضية في محرر السمات. إليك مثال باستخدام الكود من هذا الموضوع: Can it be done with CSS? Grouping categories on category page - #4 by cosdesign.
هذه قاعدة من CSS تقوم بتعيين اتجاه:
body [data-category-id="2"]::before,body [data-category-id="4"]::before {
position: absolute;
top: -35px;
left: 0; // this needs to be changed
font-weight: bold;
font-size: 15px;
text-transform: uppercase;
color: var(--primary-medium);
}
مع لغة RTL، هذه هي المشكلة:
إذا كانت هذه القاعدة في ملف CSS أساسي لـ Discourse، فسيتم تحويل left: 0; تلقائيًا إلى right: 0; عند تحديد لغة RTL. نظرًا لأن CSS تتم إضافته إلى سمة، تحتاج إلى تعديله يدويًا إلى هذا:
body [data-category-id="2"]::before,body [data-category-id="4"]::before {
position: absolute;
top: -35px;
right: 0; // changed to the proper position for RTL layouts
font-weight: bold;
font-size: 15px;
text-transform: uppercase;
color: var(--primary-medium);
}
يضيف Discourse فئة rtl إلى علامة html عند استخدام تخطيط RTL. يمكن لمطوري السمات استخدام هذه الفئة لجعل سماتهم تعمل مع كل من تخطيطات LTR و RTL. هذا يعمل، وأعتقد أنه صحيح، ولكن ربما لا تحتاج عبارة left: auto إلى أن تكون هناك.
body [data-category-id="2"]::before,body [data-category-id="4"]::before {
position: absolute;
top: -35px;
left: 0;
font-weight: bold;
font-size: 15px;
text-transform: uppercase;
color: var(--primary-medium);
}
/* Fix positioning for rtl layouts */
.rtl body [data-category-id="2"]::before,.rtl body [data-category-id="4"]::before {
right: 0;
left: auto;
}
لست متأكدًا مما إذا كان يجب على المطورين اتباع هذا النهج مع سماتهم. إنه يستغرق وقتًا طويلاً ويمكن أن يؤدي إلى أخطاء ومشكلات في الصيانة. ربما يمكن لـ Discourse تجميع بعض السمات التي يمكن أن تفكر في توفير إصدار RTL. قد يكون من المفيد اختبار هذا النهج مع عدد قليل منها:
require "rtlcss"
Rtlcss.flip_css("theme_css")
كان من المفترض أن يكون هذا إجابة قصيرة 
إذا كان ما كتبته صحيحًا ولم يتم التعامل معه في موضوع آخر، فربما يجب نقله إلى موضوع جديد.