Recently Abdelhadi Jaffar has translated the Alpine.js documentation to Arabic, and it was added among the other translations on the Alpine.js GitHub repository, all of which are Markdown files so they are nicely rendered and can be read directly on GitHub.

Arabic is written right to left, but GitHub's layout is LTR. This made the Arabic documentation hard to read on GitHub. Fortunately, we can add HTML to Markdown files. I opened a PR (which has been merged) to sprinkle a bit of HTML to change the layout to RTL.

How?

Wrap the whole thing in div[dir="rtl"]:

1<div dir="rtl">
2# العنوان
3 
4ها نحن ذا ، على دروب كنزنا. نسير معاً و أمالنا تسير قبلنا. من غيرنا؟ يقطع درباً مثلنا! درباً خطيرة إلى الجزيرة ، من غيرنا؟
5</div>

Wrap code blocks in div[dir="ltr"] (assuming your code is written in a LTR language!):

 1<div dir="rtl">
 2# العنوان
 3 
 4ها نحن ذا ، على دروب كنزنا. نسير معاً و أمالنا تسير قبلنا. من غيرنا؟ يقطع درباً مثلنا! درباً خطيرة إلى الجزيرة ، من غيرنا؟
 5 
 6<div dir="ltr">
 7```js
 8import 'alpinejs'
 9```
10</div>
11 
12</div>

If you have LTR copy/code within RTL copy, it may be a good practice to default to wrapping it in span[dir="ltr"] as some characters may flip to the wrong side. For instance, the brackets () of a function can appear on the left instead the right e.g. myFunction():

1<div dir="rtl">
2# العنوان
3 
4إذا أضفنا <span dir="ltr">`.passive`</span> إلى المتصنّت للحدث، فإن هذا الرمز المميز سيعطل وظيفة <span dir="ltr">`preventDefault()`</span> ولن تعمل على أي حدث يتم تنفيذه. يمكن أن يساعدك أحياناً في تحسين أداء التمرير (scroll) على الأجهزة التي تعمل باللمس.
5</div>