mirror of
https://github.com/BookStackApp/BookStack.git
synced 2026-02-05 00:29:48 +03:00
Bidi support #2263
Reference in New Issue
Block a user
Delete Branch "%!s()"
Deleting a branch is permanent. Although the deleted branch may continue to exist for a short time before it actually gets removed, it CANNOT be undone in most cases. Continue?
Originally created by @ahangarha on GitHub (May 24, 2021).
Describe the bug
Basically the app doesn't work properly when the text is mixed of RTL and LTR scripts.
Steps To Reproduce
Steps to reproduce the behavior:
these text are "on two three four". One starts with Persian and the Other starts with English. The first one should be read /rendered from right to left.
3. See the behavior in edit and view mode.
Expected behavior
There are different methods on how to deal with mixed text. The most used approach is to decide the direction of the paragraph based on the first strong character on the paragraph. So it it starts with Persian, it should be RTL (even if rest of the text is in English) and vise versa. This can be handled usually by adding
dir="auto"to html element containing the text.Screenshots
Your Configuration (please complete the following information):
I used the demo on https://demo.bookstackapp.com.
@ssddanbrown commented on GitHub (May 24, 2021):
Hi @ahangarha, Thanks for your input.
We have
dir=autoby default at a parent level within page content hence the browser is auto deciding the direction of the content as a whole based upon the first text it reads, the title.We technically could add
dir=autoto every block level item but I'd have thought that may cause more confusion and inconsistency on a page. If you're certain that this is the expected method of dealing with mixed direction text, some references to sources on the matter would be ideal to prove the existing standards.As an added note, since I see you're using the demo, When you enable an RTL language for your profile within BookStack, you'll be provided additional text direction controls within the editor to manually set the direction of each block.
@ahangarha commented on GitHub (May 24, 2021):
Thanks for you reply
I see the impact of that
dir="auto"but this would work if whole of the content is in one language. In practice and especially in making documentations for some program, apart from the regular text (which can be RTL), one would add lots of codes (which are mostly and not necessarily fully LTR). This means it is very much important to take care of such contents. This means each element should have its own direction independent from the surrounding text.Regarding the option to set RTL language for UI, that doesn't help in the scenario I explained. Messengers, Social Media and projects like BookStack would host lots of mixed LTR and RTL content. So having Bidi support is important. We cannot impose one direction to the whole page.
Yet the main challenge is with editor.
@ssddanbrown commented on GitHub (May 25, 2021):
Just to confirm, the text direction controls that will show in the WYSIWYG editor, when an RTL language is in use, allows per-block level control (Section of a page, not the entire page content):
As said above, if this is not the right approach then some examples of common handling on the web, by popular similar applications (Long-form content), would be appreciated since I don't really want to change the existing behavour if it's simply a matter of preference, only if it's a strong followed convention, since there's a significant risk of causing a change of behaviour to existing users.
@ahangarha commented on GitHub (May 25, 2021):
I didn't notice direction controls. That would work for rich text for sure.
Bidi support is only needed for plain texts like title.
@ssddanbrown commented on GitHub (Jun 2, 2021):
I'm going to close this off as I wouldn't really be happy to move forward on any of these requests without clear proof of established convention since I'm not experienced in this area but I'll try to keep this in mind in the event of any similar issues arising.
@ahangarha commented on GitHub (Jun 2, 2021):
Convention is clear: text should have direction based on first strong character. This can be achieved by adding
dir=autoto text container html element andtext-align: startcss style.You have already used
dir="auto"on html elements. What is needed is to add the style to title so that it keeps showing on correct side. And this should be done on all elements which doesn't contain rich text. See the following image which is related to a new book made on demo server:Gitlab uses the same method on its issues/MR to keeps things in correct direction and alignment.