Adjusting Sidebar Position and Collapse Functionality in Support Portal

Ali AK:
I am trying to make the menu show on the right side for the portal template. But when I updated the CSS it is still showing on the left side /* NAVIGATION CUSTOMIZATIONS */
.theme-default .sidebar-right .nav>li.open>a,
.sidebar .nav > li > .nav-sub > li > a:hover,
.theme-default .sidebar-right .nav>li>a:hover {
color: var(–primary-color);
background-color: var(–white-color);
}

.theme-default .sidebar-right {
background-color: var(–background-color);
right: 0; /* stick sidebar to right /
left: auto; /
remove left positioning /
direction: rtl; /
enable right-to-left layout */
text-align: right;
}

.sidebar-right .nav>li>a:focus,
.sidebar .nav > li > .nav-sub > li > a:focus {
color: var(–primary-color);
background-color: var(–white-color);
font-weight: 600;
}

.sidebar .nav a,
.sidebar .nav > li > .nav-sub > li > a {
text-decoration: none;
font-weight: 400;
color: var(–text-primary) !important;
}

.theme-default.sidebar-mini .sidebar-right .nav>li.active>a,
.theme-default.sidebar-mini .sidebar-right .nav>li.active>a:focus,
.theme-default.sidebar-mini .sidebar-right .nav>li.active>a:hover,
.theme-default .sidebar-right .nav>li.active>a,
.theme-default .sidebar-right .nav>li.active>a:focus,
.theme-default .sidebar-right .nav>li.active>a:hover {
color: var(–primary-color);
background-color: var(–white-color);
}
/* NAVIGATION CUSTOMIZATIONS END */


Linxue Ren:
The default class for the menu is sidebar-left, can you switch back to use this and then apply the rest rules to it?


Ali AK:
ok edited the following css but it will show for a sec on the right side and then dissapear and then there is still a blank space on the left side

   .theme-default .sidebar-left { background-color: var(--background-color);
     right: 0;   /* stick sidebar to right */
    left: auto; /* remove left positioning */
    text-align: right;
}

Ali AK:

image


Ali AK:
ok I got it to work and fix the menu bar to the right, but the collapse is not working check it out on https://nazaha.clientportal.cloud/#/


Ali AK:
ok got it to work by adding this css. I think we will have finally an RTL menu @media (min-width: 768px) {
.sidebar + .main-content-wrapper {
margin-right: 240px;
margin-left:auto;
-webkit-transition: all 0.1s ease-in-out;
-moz-transition: all 0.1s ease-in-out;
-o-transition: all 0.1s ease-in-out;
-ms-transition: all 0.1s ease-in-out;
transition: all 0.1s ease-in-out;
width: auto;
}