matrix-react-sdk
matrix-react-sdk copied to clipboard
matrix-org
Correct text alignment in RTL languages
For https://github.com/vector-im/element-web/issues/14520 and https://github.com/vector-im/element-web/issues/4771
This PR intends to relieve frustration of RTL language users. cf. https://github.com/matrix-org/matrix-react-sdk/pull/5453
Please mind the position of (edited).
cf. https://github.com/matrix-org/matrix-react-sdk/pull/5453#issuecomment-862466809
I modified the declarations for blockquote, ul, and ol to apply logical properties. Since I am not able to read RTL languages, it is not really possible for me to test edge cases though.
The ideal solution would be to implement logical properties all over the UI, but the task is too large for this PR. Therefore adjusting position of UI elements such as timestamp is out of scope.
| Before | After | |
|---|---|---|
| IRC layout |  |
 |
| Modern layout |  |
 |
| Bubble layout |  |
 |
type: defect
Signed-off-by: Suguru Hirahara [email protected]
Here's what your changelog entry will look like:
🐛 Bug Fixes
- Correct text alignment in RTL languages (#9026). Contributed by @luixxiul.
Though I don't find a regression, I think it would be better to merge this PR after some feedback comments are provided from native RTL language speakers.
I've posted a link to the netlify build on https://github.com/matrix-org/matrix-react-sdk/pull/5453#issuecomment-1179037978.
Do we have an example of that kind of tests? Though I am not able to create one from nothing, I could at least try to modify the example.
converting to draft for now- looking for a way of implementing visual tests.
after the weekend the team should be able to help with tests in https://matrix.to/#/#element-dev:matrix.org
