search

20lives / tailwindcss-rtl

Enabling bidirectional support on tailwindcss framework
MIT License
347 stars 33 forks source link

Size variation priority #25

Open AmirHosseinKarimi opened 3 years ago

AmirHosseinKarimi commented 3 years ago

Hi, I have a scenario which I need set text align to start by default and set it to center on SM break-point. So set these class: text-start sm:text-center The result is not correct: Screenshot from 2021-03-12 15-23-50

The text-start will override sm:text-center

20lives commented 3 years ago

Nice catch. I Will try to think of a solution

20lives commented 3 years ago

Adding the following to textAlignUtilities.js solves this specifically, but this could be pretty expensive when adding to all utilities without directions.

'[dir] .text-center': { 'text-align': 'center' },
AmirHosseinKarimi commented 3 years ago

@20lives Thanks for quick fix solution, I just handled it by is_rtl() condition for temporary hot fix in this specific scenario. I just think about it, what about disable Tailwind core text align plugin and extend it via direction prefix to fix rules priority in variations?

20lives commented 3 years ago

I don't think it's possible to remove existing utilities with plugins

AmirHosseinKarimi commented 3 years ago

But can mention it on documentation which need manually do it to fix the issue?

20lives commented 3 years ago

I am not planning on leaving it that way :)