Topic: Sidenav with icons
Zaffar free asked 4 years ago
Hi,
I am using the sidenav from pro template. When toggling it is closed completey but I would like to keep it only showing the icons. Is there any opportunity?
If not, how can I get access to the properties like width and body padding to set the properties on my own. JQuery is not working with my Typescript.
Thanks in advance!
Arkadiusz Idzikowski staff answered 4 years ago
The slim sidenav works just as you described. It has two modes - normal and minimized, and in the second mode it display only icons. Copy this code to your component html file and click on the 'minimize' button to see how it works:
https://mdbootstrap.com/docs/angular/navigation/sidenav/#slim-sidenav
The default sidenav breakpoint is 1440px. When screen width is lower than 1440px, then sidenav will be hidden automatically. You can adjust this breakpoint with [sidenavBreakpoint]
input.
<mdb-side-nav #sidenav class="wide sn-bg-1 fixed" [fixed]="true" [sidenavBreakpoint]="800">
Closed
This topic is closed.
FREE CONSULTATION
Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.
Closed
- ForumUser: Free
- Premium support: No
- Technology: MDB Angular
- MDB Version: 8.10.1
- Device: All
- Browser: All
- OS: Windows
- Provided sample code: No
- Provided link: No
Arkadiusz Idzikowski staff commented 4 years ago
Did you try to use our slim sidenav version?
https://mdbootstrap.com/docs/angular/navigation/sidenav/#slim-sidenav
Zaffar free commented 4 years ago
Yes but there are no icons and i want to minimize the sidenav and keep only icons. Is it possible?