Let's Add RTL Support 🌐

About :information_source:

RTL means “Right to left” and it is the notation used to describe how letters in particular alphabets are written – from which side to which.
For example:
Arabic is an RTL language, while German is LTR(left to right).

By adding RTL support I mean, that layout of the markdown should flip the text to the other side and all features work fine when the direction of writing is RTL.
It means many parts of the design will be flipped from left to right or the opposite.

Affected Languages ⚠
  • Arabic
  • Aramaic
  • Azeri
  • Dhivehi/Maldivian
  • Hebrew
  • Kurdish (Sorani)
  • Persian/Farsi
  • Urdu

How To Solve? :bulb:

The EZ way is to add a BTN that will flip the current document to RTL mode, it can be also done as a global setting for a collection of collectives or just one collective or just one file.
when the user clicks, on the RTL BTN the markdown file will switch all the text using
html <div dir='rtl'>
it should work everywhere, for example here:

As you can see this is a markdown with RTL support

Now I am not sure, how the collective app works, and maybe this will be hard to implement
but it would be nice to write in the affected languages on the collectives app.

2 Likes

i see the support is good now but the ui till now not showing the right direction RTL.

Can you provide a screenshot please?

1 Like

@Bandarrex thanks for your post. I’m one of the maintainers of Collectives. Unfortunately I lack knowledge of RTL languages. Could you help me to identify problems with RTL support in Collectives? Screenshots would indeed help, as @rakekniven suggested.

@mejo, Thank you for the great work.

This is an RTL support for tiptap editor:
https://github.com/neokazemi/tiptap-text-direction-extension

I am working on not just adding RTL but bidirectional text support. This helps not only with RTL layout for RTL languages, but also it helps with mixed RTL and LTR content.

Checkout WIP - Add bidirectional text support by ahangarha · Pull Request #42471 · nextcloud/server · GitHub

3 Likes