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
RTL (Right to Left) support for comments and issues #147
Comments
@aziz لطفا اضافه کن فونت تاهوما رو هم به صورت fallback تو استایل ست کنند. فارسی نوشتم که متوجه بشند دقیقا چی میکشیم. |
lots of people use RTL languages, please add this feature |
You can add a test <p dir='rtl' align='right'>test</p> |
I created this userscript which will add a RTL block (as a !YAY
|
@Mottie This is great but not enough. As I mentioned inside that div that you automatically inject, we're gonna lose the ability to use markdown! Try to write RTL ordered lists or tables in HTML and you'll feel the pain. |
Hmm, ok I could set up the userscript to replace in-line tags, so something like this
becomes this: <div style="direction: rtl; text-align: right">
<table>
<thead>
<tr>
<th>h1</th>
<th>h2</th>
</tr>
</thead>
<tbody>
<tr>
<td>c1</td>
<td>c2</td>
</tr>
</tbody>
</table>
</div> Users without the userscript would see the |
Ok, I've been looking into this a bit more. I think instead of using
I can get the userscript to replace any of those symbol combinations with a Which symbol combination would you guys suggest? |
These unicode chars can control order but none of them can achieve align: right. Or do you mean a user would use such chars in the markdown source, then run your script which would transform them into html with appropriate dir? A quick-and-dirty way to implement it is first converting markdown->HTML, then slapping
This all sounds like it could be useful outside github. |
* Replace `‏` and `‎` within markdown with a div. * Include `unicode-bidi:isolate;` * Force LTR inside code blocks. * Start using some ES6 code. * See dear-github/dear-github#147 for details.
Hey @cben! Thanks for the detailed post. It looks like what I had working locally was working as expected. I just updated the script to now use My main concern right now is that inline RTL blocks are all currently wrapped in a
Here is the code I was using to test the userscript. Below it is the rendered code (install the userscript to test).
Inline text is split upMixed LTR RTL! and back to LTR RTL Block:
From http://codepen.io/cben/pen/ezzWVO?editors=1100 "Recall that נזכיר ש- |
@Mottie great job.
This shows however how easy it is for github to implement this. |
Hmm, that is odd, the preview is working for me. I did encounter the issue with the userscript not being applied immediately after submitting a comment - I'll look into fixing that. |
Ok, I've updated the userscript to update the preview, after editing and adding new comments. It's not GitHub's fault (yet) that RTL languages aren't supported (ref). The change needs to happen in the Markdown spec first, then organizations using Markdown will have to comply. |
Oh boy! You might think everybody's aware of RTL languages by now (2016!), but NOOOO, we have to wait for every renderer, parser or whatever to support RTL! For god's sake! Would you please support the RTL languages already?! (or at least support |
Test RTL without HTML. Got from (here)[dear-github/dear-github#147] It doesn't work in preview mode so I have to commit the change.
Hi everyone, I'm also concerned about this feature for Arabic. Any news? |
gitlab add |
یه تگ div ایجاد کنید و اتربیوت dir='rtl' رو بهش بدین درست میشه. اگه رو این کامنت هم Inspect Element کنین اون تگ div رو خواهید دید.
|
You can open a div tag with dir='rtl' and write inside it. (As I Did in the above comment) |
راست به چپ در فارسی بر محمد و آل محمد صلوات بر محمد و آل محمد صلوات بر محمد و آل محمد صلوات بر محمد و آل محمد صلوات |
Hello, since supporting automatic text conversion by language without using dir=rtl Now I had some texts like this
review: Can't make the sentence "hello world" go right even though I use dir=rtl to force it even when using align=right
review: The bullet for the list is still on the left |
Hello @AhmedElTabarani! I think you can make the "hello world" list item right-align if you remove the empty lines between
we get بسم الله الرحمن الرحيم
- hello world
السلام عليكم You may then add extra spaces (or |
hi @chesterbr and I notice that with nested list it became wrong
preview
preview |
I hope to fix the problem in general I have a repo, I was explaining something on it with many lessons on this repo |
Thanks so much for all the feedback folks - it's really helpful. @ahangarha, re: #147 (comment), I'd love to hear some other opinions here. To be honest, changing the editor behaviour in this way feels bad to me. It seems like we're telling people "this is what the final result will look like" by supporting right-to-left languages in the editor at all, and then it's even more frustrating when the final result looks different from what we showed in the editor. But, I don't write in right-to-left languages, so I might be making the wrong trade-offs. I'm also going to get some opinions from some of our GitHub colleagues who do speak those languages. @AhmedElTabarani, re: #147 (comment) I hear the frustration. For the most part, we've been trying to follow patterns that we've seen elsewhere for RTL support, like on Facebook and Twitter, though I admit that's not possible in all cases because of Markdown-specific differences. One thing I don't understand in your case is whether this is a long-term problem with the implementation, or rather a temporary adjustment problem that we need to work through. It sounds like (if I'm reading properly), the implementation is okay, but it's frustrating making changes to existing files that were written before this support was introduced. Is that right? If so, that's a challenge I'd like to help with - I just want to make sure I understand the problem before we try to solve it. |
Hi @emmaviolet
yeah, it is right, but there is one issue with lists Can't enforce list to go right if the first element was a LRT language contexttry to make this list to go right
|
@emmaviolet Hi again, Sorry that I may have bothered you with so much talking about problems But I discover the root of the problem like here #147 (comment), Can't enforce any content that has a prefix special character to go right such as
preview: |
Using HTML only will solve all problem, but that not a good solution in general |
Regarding the issue with forcing RTL on LTR list items, frankly I think this is too much to expect from Markdown. Markdown is not meant to serve like a rich text format. It is meant to be minimal and be consistent between plaintext view and parsed version to other formats. Adding bidi support has served this purpose for RTL/LTR content. Here the aim is to hack Markdown to behave differently. And for sure it needs to be done in some specific way. Please remove how earlier it could be hacked by adding html element which actually has harmed significant amount of contents. Since here you don't want to follow Markdown, then why not to write it in HTML? <ul dir="rtl">
<li>Hello World</li>
<ul dir="rtl">
<li>Hello World</li>
</ul>
<li>Hello World</li>
</ul> And the result:
|
👋 I'm hopeful we've now improved/solved editor support (at least, as much as we can within Do let me know what you think - if it works for you we'd be delighted to ship publicly. |
Hi @emmaviolet and thank for the work. I checked the textarea and it works as expected. Just I wanted to know if you have |
ss سلام salam چهار پنج شش تست میکنیم. |
Let's talk about the scenarios in which one would write something similar to what you did. I cannot imagine in what situation would a person write such markdown. If one needs to add text in different languages in different paragraphs, two new lines is required. One new line doesn't count as paragraph separator. Isn't it? If I am wrong, please share some example. I cannot imagine one. |
You're right. It's not the problem in outcome. |
Since we are dealing with rich text, we should have different expectation. I think before anything else we should know that markdown was not made as some simpler HTML syntax. Markdown is Markdown and is supposed to be readable and editable in plaintext. If we parse Markdown to other formats, it shouldn't change the way we look at markdown. In markdown we want to be able to write and read text with minimum marks which can help us to understand formatting even in plaintext. If one needs to do something beyond what Markdown is capable of, I think should move for some rich text format. In Markdown we should be able to make paragraphs, headings, lists, quotes, codes, table (in very basic format), link, image and some basic formattings such as bold and italic. Yet there are few cases that making decision becomes hard especially in lists. But I think we are at very good situation. I cannot imagine any better way to handle such issues. If one follow md standards, rarely would face with any issue. |
Thanks both for the feedback!
I hear this - that's why we held off doing this for a while, because we can't get However, the Write box and Preview Area mostly are different for the reasons @ahangarha describes. ### doesn't immediately show a header, even though we might want it to. Going forward, we're investigating whether we can/should do away with |
I can list other issues which are more common to encounter and frankly there is no way to specify one fit all solution for them. For example take this list:
and this is the result:
while in any editor, the text would appear like this: This is the same when it comes to code block. One real issue is that github MD to HTML renders all code blocks as LTR while there are situation in which one might want to add RTL comment! Yet this one is a bug on github parser which I hope it be resolved but the other (list) needs some convention. The current status is good: whole list follow the direction of the first item. Doing anything else, brings significant complexities. I can provide live example of such issues but to be frank, we need to come to agreement that we are dealing with plaintext not rich text. Either we should go for WYSIWYG editor which is horrible for development or use Markdown as Markdown. |
@emmaviolet There is an issue with blockquote: Border is fixed on left side. It can be resolved easily by styling before: .markdown-body blockquote {
padding: 0 1em;
color: var(--color-fg-muted);
border-left: .25em solid var(--color-border-default);
} after: .markdown-body blockquote > p {
padding: 0 1em;
color: var(--color-fg-muted);
border-inline-start: .25em solid var(--color-border-default);
} Update:I withdraw this suggestion |
@ahangarha Hello! Could you please provide an example of a blockquote that shows the issue that the styling above would fix? Thank you! |
@chesterbr Thanks for your reply Since the day I sent the comment I have made several experiment with different scenarios and realized this (nested elements in general) is a complex issue. I would like to withdraw my suggestion as it doesn't work with lists but still give you example to deal with. take this code:
The issue is that Even if the text inside the quote is RTL, the blockquote shows the line on the left side. Simply it is hardcoded to be that side. Now apply what I said. The result should be something like this: My suggestion can kind of fix the issue but not really. It only works in limited scenarios. I withdraw my suggestion but also I want to request github devs to look into this issue. I am myself working on a plugin for By the way Gitlab only applies |
Any news on this guys? here is a book that we are translating and we have problems with right-to-left styles. |
But also this is an example of why we should try to avoid adding Also as a suggestion see if you can avoid adding headings in lists. |
Hi @emmaviolet just seen this thread after months! Great work, please find my tests. UL follows first item, tick
OL button adds latin nums but works
١. یەکەم
Heading works, tick سەردێڕسەردێڕ ٢سەردێڕ ٣
var a = 2
// تێبینی Inline Code works, tick
Tagging works, tick @احمد
Links work, tick بەستەر بەستەر تەواوە. Even with some ltr Thank you! |
Thanks for raising @layik - looking into this and will get back. |
In task list, when using rtl convert to issue button overlap the check button.
|
First attempt was not for GitHub markdown. This time try to follow a bug report and remove spaces between items in the list. (dear-github/dear-github#147 (comment))
Not all disscussions on github are in English and some like Persian, Hebrew or Arabic are written from right to left.
It would be easy to add a checkmark to the editor to switch the direction from LTR to RTL and then represent that piece of text in UI from right to left.
This would dramatically improve the usability and enhance UX. For instance, take a look at this issue on an open source Persian font project. The text is barely readable if it's mixed with an English word (which happens quite a lot in a technical disscussion) and all it needs is a div wrapper with
dir='rtl' align='right'
or if you want to do it with CSSdirection: rtl; text-align: right
.I can still write all my comments in HTML and add
dir='rtl' align='right'
but then I lose the ability to use markdown which is painful. Try writing a simple uordered list in html instead of makrdown and you'll feel the pain, let alone the html table.The text was updated successfully, but these errors were encountered: