RTL Version Nuxt JS
Import the below scss at the end in the assets/scss/app.scss
@import "custom/rtl/general-rtl";
@import "custom/rtl/bootstrap-rtl";
@import "custom/rtl/spacing-rtl";
@import "custom/rtl/float-rtl";
@import "custom/rtl/text-rtl";
@import "custom/rtl/structure-rtl";
@import "custom/rtl/plugins-rtl";
@import "custom/rtl/components-rtl";
@import "custom/rtl/pages-rtl";
Then in nuxt.config.ts
change htmlAttrs with
{ dir: "rtl", lang: "en" },
.
RTL Version Vue JS
You need to add the below code in mounted function in the
src/App.vue
file.
document.getElementsByTagName("html")[0].setAttribute("dir", "rtl");
In order to have RTL mode enabled, you need to import below rtl scss files
in the app.scss file src/assets/scss/app.scss
.
@import "custom/rtl/bootstrap-rtl";
@import "custom/rtl/components-rtl";
@import "custom/rtl/float-rtl";
@import "custom/rtl/general-rtl";
@import "custom/rtl/pages-rtl";
@import "custom/rtl/plugins-rtl";
@import "custom/rtl/spacing-rtl";
@import "custom/rtl/structure-rtl";
@import "custom/rtl/text-rtl";