switch between style rtl react
Hi ,
I am using Metronic 8 react and i have a problem when add rtl
how switch between style when change from rtl to ltr and vice versa
Replies (1)
Hi,
Unfortunately, dynamic direction switching is currently not supported by Metronic SPA versions.
The only way to change the direction dynamically in our React version is by updating the link href of the main style file. To achieve this, follow the steps below:
- Generate RTL and LTR CSS style files using our HTML version.
To generate styles, refer to our gulp build and rtl version setup docs. - Copy the generated style.bundle.css and style.bundle.rtl.css files to public folder in your React app.
- In the index.html file, add link tag with default direction styles as shown in this gist file.
- Remove the style import line below from src/main.tsx:
import "./_metronic/assets/sass/style.scss"
- To switch the direction, you just need to change the link href from style.bundle.css to style.bundle.rtl.css.
You can reuse switch functions from this gist.
Regards,
Lauris Stepanovs,
Keenthemes Support Team