-
-
Notifications
You must be signed in to change notification settings - Fork 60.2k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Solve some problems with RTL Languages #6714
Comments
if we set a section talking about this solution in Guidelines in CONTRIBUTING (after we finish discussing it here of course) Other contributors can do the same with their own RTL languages |
Thanks for adding this. We can leave it open for a while. |
As commented in #6715 if this marks, HTML entity or unicode raw character breaks alphabetize plugin, even worst when are placed at the begining of sentence (the reason: see Moreover, non printable version should be used instead of HTML entity. Remember that Markdown markup should be HTML agnostic |
To support bidirectional text alphabetization (https://en.wikipedia.org/wiki/Bidirectional_text) Via EbookFoundation/free-programming-books#6714
@davorpa i can make regex patterns for all these cases |
Go ahead 😉. It can be helpful to any maintainer ❤️ |
@AhmedElTabarani Hello sir, can I work on this? |
About regex putterns ? Ok no problems at all I was working on it but i was very busy this weeks. I was decided to make a JavaScript script to detect all of these and some unit tests to make everything organized This is last thing I ended up with, maybe it will help you.
|
The main RTL languages are Arabic, Persian and Hebrew... which are only 3 out of all the languages translated on this repo... might be better to have a special section for these languages... as it is not relevant for all the LTR ones. |
Have you tried the following?
|
some good ideas in this issue. Would welcome a PR. |
does this issue still needs to be fixed |
Can i work on this issue. |
Here I will talk about some problems with RTL Languages and their solutions.
I will explain all the points here, and we can have a discussion about it.
And maybe add a section that talking about these problems & solution in Guidelines in CONTRIBUTING
The base discussion on this issue starts on this PR #6706 and #6715
What is the issue ?
If we have an RTL text here
Note :
تعلم البرمجة
means thatLearn Programming
It will appear on the website like this:
![image](https://user-images.githubusercontent.com/69223584/153501166-5b48b48d-1fe0-493e-90a9-323495e15e33.png)
In this case, we can just
dir="rtl"
Result:
![image](https://user-images.githubusercontent.com/69223584/153501504-eb5a0bfc-be76-40fd-9b77-1bc6716d11b2.png)
Is that it ?, No! The monster will show up below 😢
Mixing RTL with LRT languages issue !
The real problem is that when mixing RTL with LRT languages
Case 1
Note :
تعلم
means thatLearn
.Result:
![image](https://user-images.githubusercontent.com/69223584/153503064-a37a9142-8083-4d0e-a689-e6a657d73347.png)
Look, he put words in the mixer!
Case 2
If we need to make LTR to go right (both author name and title are LTR)
Result:
![image](https://user-images.githubusercontent.com/69223584/153504593-9385005c-abba-4f9a-9488-fd9f7a7fa6e8.png)
Both words have been swapped!!
Solution ?
We can solve these two problems with Unicode mark called RLM:
https://en.wikipedia.org/wiki/Right-to-left_mark
By adding
‏
after the LRT word that we need to mark it as RTL (it will pretend as RTL word)Solve case 1
Result:
![image](https://user-images.githubusercontent.com/69223584/153505418-84cb69d2-deaa-4271-b474-2a37a8dd5dbf.png)
We added
‏
afterHTML
Solve case 2
Result:
![image](https://user-images.githubusercontent.com/69223584/153505643-acddc09e-f44e-40d4-bf23-ba8ecd49a491.png)
You get the point!
Extra Cases!
Case 1
Try to make
C#
go to right!Note:
* [تعلم لغة C# الرائعة](URL) - إسم المؤلف
means* [Learn the Cool C# Language] (URL) - Author Name
Result:
![image](https://user-images.githubusercontent.com/69223584/153506682-fcdce415-8511-476c-a65e-bf8eb4205be7.png)
The Symbols have the same problem when we try to RTL it
And it has the same solution 😉, by LRM Unicode mark:
https://en.wikipedia.org/wiki/Left-to-right_mark
We use
&lrm
not&rlm
, why?The issue with the symbol is that when we try to add a RTL attribute to
C#
to make it get to rightIt will render as a RTL word, so the symbol will reorder to the other side.
By adding
‎
after theC#
we mark it as LTR word, so it will render as LTR wordCase 1.1
Both
Author Name
andTitle
are LTR and end with a symbol asC#
Result:
![image](https://user-images.githubusercontent.com/69223584/191685572-d53effa5-4992-4525-8314-aafaa86740b5.png)
The first here will be simple, just put
‏
at the end of the titleResult:
![image](https://user-images.githubusercontent.com/69223584/191686177-bd989612-6ef8-4a90-9465-d022440bd4bf.png)
But note that the symbol
#
renders as a RTL word, so it will reorder to the other side.so we must use
‎
after this symbol.Result:
![image](https://user-images.githubusercontent.com/69223584/191688160-dde46073-4015-4584-8a6a-962e237814ef.png)
Case 2
If the
Title
in English and theAuthor Name
in ArabicResult:
![image](https://user-images.githubusercontent.com/69223584/180845224-a8940164-eecc-44a4-be18-bed8d95cee86.png)
It is enough to make the direction be RTL only without putting any Unicode mark
Result:
![image](https://user-images.githubusercontent.com/69223584/180845333-ec57782c-8f65-4dab-801c-16a97a25fb5e.png)
Case 3
Sometimes we add some information like
(:construction: *in process*)
after the author nameResult:
![image](https://user-images.githubusercontent.com/69223584/191689840-05c1f9b6-ee92-49d7-9983-53aa502348a0.png)
It seems like it is correct, but we read from right to left, so it would be nice if this information was in left to read the author name first then the information
So to solve this, we just put
‏
after the nameResult:
![image](https://user-images.githubusercontent.com/69223584/191692248-dae4285d-710e-4c0b-9577-098bed5bd6bf.png)
The text was updated successfully, but these errors were encountered: