search

patternfly / react-topology

MIT License
10 stars 19 forks source link

Implement RTL support #116

Open srambach opened 10 months ago

srambach commented 10 months ago

Describe the problem PatternFly now provides RTL language support, but topology has a few instances where it's causing problems. Node labels are one trouble spot.

How do you reproduce the problem? Add dir="rtl" to the <body> tag to see it in RTL. Note that English text will still be readable left to right, but should be right aligned where it was previously left aligned, etc.

Screenshots

image

Any other information? See the RTL handbook for help - in particular, the helper multiplier might be of use. https://www.patternfly.org/developer-resources/right-to-left-handbook#patternfly-rtl-helpers

jeff-phillips-18 commented 8 months ago

@srambach Would RTL expect node label elements to be completely reversed?

LTR: <Icon> <Badge> <Label> <Context Menu>

image

Should RTL be: <Context Menu> <Label> <Badge> <Icon>?

jeff-phillips-18 commented 8 months ago

@andrew-ronaldson ^^

srambach commented 7 months ago

@jeff-phillips-18 Yes - I think those elements would be reversed in position as you list. Just FYI to clarify, unless you actually translate the text into an RTL language, though, the words themselves will read left to right. But yes, I'd expect the elements to reverse to be <Context Menu> <Label> <Badge> <Icon>.

andrew-ronaldson commented 7 months ago

What @srambach said! Thanks Sarah!