How to make navbar right to left?

[amirhrahimi]

I added rtl class to body tag in index.html then I had my slidebar on the right which is nice, but the problem is navbar remains unchanged, for example, I should have my navbar-wrapper on the right not left

[groovemen]

Hello @amirhrahimi,

Thank you for your interest in working with our products. It seems that you haven't respected our ISSUE_TEMPLATE, so we are going to close it. Please add a new comment here, or open a new issue, by filling the mentioned ISSUE_TEMPLATE and please be sure that your issue title is a very small description of your issue as well. Also, please let us know if you are using the Angular version.

All the best, Stefan

[amirhrahimi]

Hi @groovemen

Thank you for your response. I am using the Angular version.

Prerequisites

Please answer the following questions for yourself before submitting an issue.

• [Yes] I am running the latest version
• [Yes] I checked the documentation and found no answer
• [Yes] I checked to make sure that this issue has not already been filed
• [Yes] I'm reporting the issue to the correct repository (for multi-repository projects)

Expected Behavior

the navbar should be rtl after I add rtl class to the body tag in index.html

Current Behavior

navbar is not rtl for example, I should have my navbar-wrapper on the right not left as showing on the pic

Failure Information (for bugs)

it is happening after adding rtl class to the body tag

Steps to Reproduce

Please provide detailed steps for reproducing the issue.

1. step 1: just add rtl class to body tag as shown here:

Context

Device: Computer Operating System: Windows 10 Browser and Version: Chrome 79.0.3945.130 (Official Build) (64-bit)

[chelaruc]

Hi, @amirhrahimi! Have you followed the steps from https://demos.creative-tim.com/material-dashboard-pro-angular2/#/documentation/rtl?

[amirhrahimi]

Hi @chelaruc

Thank you for your advice, I actually fixed that, it was a silly mistake in configuring angular.json file, anyway, as you said and mentioned here: https://demos.creative-tim.com/material-dashboard-pro-angular2/#/documentation/rtl the solution is just adding these two lines in styles of both build and serve part of the file:

"node_modules/bootstrap/dist/css/bootstrap.css" , "node_modules/bootstrap-rtl/dist/css/bootstrap-rtl.css"

best wishes