feat: support rtl layout

[c0m1t]

This pull requests allows the web app to change layout(direction) based on the language selected by the user. For languages like Persian or Arabic, it will be RTL.

Apparently it is not possible to support RTL using Sass. So I converted Sass styles to JSS, so with the help of rtl plugin from jss-rtl properties can be flipped. (for example padding-left would change to padding-right).

I kept the main layout the same, participants pane is still on the right, chat pane is still on the left, filmstrips are still on the right side, ... .

Prejoin:

Main layout:

Chat panel:

Overflow menu:

Dialogs:

Filmstrips:

[jitsi-jenkins]

Hi, thanks for your contribution!
If you haven't already done so, could you please make sure you sign our CLA (https://jitsi.org/icla for individuals and https://jitsi.org/ccla for corporations)? We would unfortunately be unable to merge your patch unless we have that piece :(.

[saghul]

Amazing work, thank you!

[c0m1t]

@saghul If you are willing to support RTL layout, I think it would be a good idea to encourage contributors to use JSS instead of Sass in their new pull requests.

[saghul]

Yep, JSS is where we are headed.

Now, this PR is huge, which means it will be hard to review and keep up to date with our own ongoing work.

Any chance you can break it down into smaller chunks, so we can start merging them one by one?

[c0m1t]

Sure.

Btw I already submitted these 2 pull requests 2 weeks ago #11038 and #11037.

[saghul]

Oh I must have missed those, thanks for the reminder!

[saghul]

Closing this since it has been broken down into smaller PRs. Amazing work @c0m1t !