Created by: PascalPixel
Lets help out the 500 million poor souls whose languages flow from right to left?
This doesn't change any of the classnames (left/right), but does flip around the attributes for them.
So you write .float-left
, and it floats to the right. Madness.
Would supplant our dependency on bootstrap-rtl versions and manual solutions.
Edit
- Need to rewrite any shorthand css notation with differing sizes for left and right (
margin: 0rem 2rem 0rem 5rem;
) - Need to add support into the
js
, I haven't used any of these except modals, dropdowns, tooltips and popovers.
Edit2 There are multiple approaches for this:
- Eliminate all left/right logic in Bootstrap with Flexbox (would be best)
- Write and maintain overrides in a separate optional file (every other RTL solution out there, unmaintainable, file bloat)
- Add a variable to export an RTL-only version (the solution in this PR)
Since 1. would require a bunch more internal tooling on BS it isn't really viable right now (I think?). 2 is too much work to maintain and has never found its way back into vanilla BS out of all the solutions online. Thus I am advocating solution 3 (this PR) for the time being.
At only 200 line changes, this solution solves the problem for a setup that can take care of compilation for you on the fly (sprockets, webpack) but won't serve basic users who use raw files or CDN.