How to use Bootstrap with Sass and RTL support?

Viewed 268

I've got a frontend project which is using Sass and Bootstrap 4.5. Currently my Src-Code looks pretty much like that:

@import '../node_modules/bootstrap/scss/functions';
@import '../node_modules/bootstrap/scss/mixins';
@import '../node_modules/bootstrap/scss/type';
@import '../node_modules/bootstrap/scss/images';
//...

.myWrapper {
    @import 'my_stlyesA';
    @import 'my_stlyesB';
    //...
}

The resulting/compiled myproject.css will get used within my html.

Objective:

So now I want to integrate support for RTL. The frontend should be dynamicly change from LTR to RTL if user clicks on a button.

I've found that rtlcss.com seems very popular. It also provide a already RTL-supporting "forge" of Bootstrap as a minified CSS file. But I want to integrate it into the above descriped sass construct (and also want to keep managing my dependencies with NPM; rtlcss only offers CDN).

How can I integrate RTL support in my Sass website?

0 Answers
Related