Apply RTL as default

To apply RTL as default layout option in Jumbo follow the steps given below:

Set <body> tag's direction to "rtl"

For this, you will need to go to the /public/index.html and set the "dir" attribute to "rtl". After the changes your body tag will look like:

<body dir="rtl">

Set "direction" property in active theme object

Now, as a final step, you will need to set the direction property of your active theme object. In usual case, the active theme is /src/app/themes/default.js and after changes your theme object will look like below:

import {alpha} from "@mui/material";

export const mainTheme = {
    direction: "rtl",
    ...
}

That is all you will need to do to setup the RTL direction as default.

Last updated