how can i use trix in rtl mod by default?
pars0097
All 4 comments
I have tried some possible solutions for this feature and here are the results. I'll be happy to have your opinion.
Automatic direction
Using HTML5's dir='auto' it's possible to hand over text direction control to browser itself (I couldn't find a complete browser support report yet, but tested it on latest version of Firefox and Chrome with no problem).
There are some problems with this solutions. We can either apply it on trix-editor and have following result:
Which as you can see it'll set direction based on the first input character and all children will inherit accordingly. I have also tried to set direction per children instead of trix-editor and the result is this:
This is a little bit better, but since default container (div) will not break until the next different container (ol in this example) new paragraphs with different direction will follow previous direction. Anyway the resulting markup will be so messy this way.
Manual direction
Currently I'm trying to implement RTL/LTR toolbar buttons:
I plan to wrap each paragraph with enabled RTL/LTR direction into a child container (I'll start with <p></p>) to be able to apply direction per paragraph. I'm not sure of results yet...
Anyway, the chosen icons in the picture aren't correct, they are for aligning buttons not direction controllers. I couldn't find direction controllers in material icons. It'll be awesome to help me here :)
Thank you all
shahinism
on 28 Nov 2016
It also looks like #187 has implemented a pretty useful change. So I can just update dir value of current container.
shahinism
on 28 Nov 2016
Well I've managed to make automatic direction solution work using #187. You can find the resulting demo here. Even though this solution currently works perfectly and is cleaner IMO, but I'm not quite happy with it since it still needs to put a dir="auto" in every new node. This is why I didn't submit a pull request yet.
@javan can I have your opinion on this matter please?
EDIT: changes on our fork and a preview in Chrome:
The result is the same in Firefox, Firefox Android and Chrome Android.
shahinism
on 2 Jan 2017
yes, it works in the best way.
thanks.
pars0097
on 10 Jan 2017
Related issues
divyenduz
路
4Comments
javan
路
4Comments
binchentx
路
5Comments
acapro
路
3Comments
souporserious
路
4Comments
Most helpful comment
Well I've managed to make automatic direction solution work using #187. You can find the resulting demo here. Even though this solution currently works perfectly and is cleaner IMO, but I'm not quite happy with it since it still needs to put a
dir="auto"in every new node. This is why I didn't submit a pull request yet.@javan can I have your opinion on this matter please?
EDIT: changes on our fork and a preview in Chrome:
The result is the same in Firefox, Firefox Android and Chrome Android.