Topic: Side Navigation
I have used the MDB side navigation in my web application,
I am facing few issues with the side nav
1) When the side navigation is collapsed, the text gets closer to the image and still the text is visible?
2) When i click on any one of the link in the side nav, the side nav is displayed as slim bar?
3) Need to apply custom color on the hover event of the side nav?
4) When i used the web application, i want the side nav as "Push", but push is not working?
https://mdbootstrap.com/snippets/standard/sriramk18/4174908
mlazaru staff answered 2 years ago
hi,
1.Do you want to make text invisible when collapsed? If that is the case, use:
<li class="sidenav-item">
<a class="sidenav-link" href=".">
<i class="fas fa-flask fa-2x me-3" style="width:50px"></i>
<span data-mdb-slim="false">Laboratory</span>
</a>
</li>;
2.Check out this example. Clicking link doesn't toggle slim sidenav in it's default behavior. However its possible to change it by adding sidenavInstance.toggleSlim();
to every link inside sidenav.
3.It can be done via CSS. Remember to use strong selector like:
.sidenav-primary .sidenav-item .sidenav-link:hover {
background-color: rgb(241,207,187, 0.33)
}
4.I will add a task for it because it seems to not work correctly.
sriramk18 pro premium priority commented 2 years ago
One more clarification is required regarding side slim navigation,
The selected menu is not getting highlighted after form post back. The selection is gone after the form is post back.
FREE CONSULTATION
Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.
Answered
- User: Pro
- Premium support: Yes
- Technology: MDB Standard
- MDB Version: MDB5 4.3.0
- Device: All
- Browser: All
- OS: All
- Provided sample code: No
- Provided link: Yes