Determining directionality from javascript


(Noam Yorav-Raphael) #1

Here’s a simple RTL issue that I want to submit a fix to. The arrow to expand the category list should be flipped in RTL directionality. Here’s how it looks now:

The arrow comes from category-drop.js.es6:14:

    return "fa fa-caret-right";

I’d like to add an if, to return "fa fa-caret-left" on RTL directionality. My question is, how do I check what is the directionality.

Thanks,
Noam


(Sam Saffron) #2

Can you test

https://github.com/discourse/discourse/pull/3354

Does it solve this? Does it look good?


#3

its just simple css code
you can find this code in css @noamraph

.fa-caret-right:before {  content: "\f0da";}

and replace with

.fa-caret-right:before {  content: "\f0d9";}


(Noam Yorav-Raphael) #4

Cool! I think this is a good solution, as for example the display of “>” changes according to context.


(Kane York) #5

You should probably scope that CSS tighter, just in case.


(Noam Yorav-Raphael) #6

What about

.fa-caret-right[dir="rtl"]:before { content: "\f0d9"; }

Are the code points of Font Awesome stable?


(Kane York) #7

No, I meant this:

.rtl .category-dropdown-button .fa-caret-right:before { content: "\f0d9";}