I basically created my own custom mobile menu by doing this.
Can anyone from the team pls verify this is the proper way to do it?
Also why are the icons for sub-dropdowns not showing up?
- Create OffCanvas, set width and height to 100%. Added overflow-y: scroll;
flex-wrap: nowrap; because all the contents were disappearing. - I added a nestable navigation to the Offcanvas but for “mobile” I set it to “never” because I dont want the hamburger-icon inside the OffCanvas to show up.
- Removed the custom toggle close and open elements and added them newly where I want them
- Set all the dropdowns to static and all dropdown-elements to width: 100% (so the dropdown menus cover the entire space and can be styled)
- Put other dropdowns inside the dropdown elements. Set Multilevel to true and set a “Back”-Text. However, whenver I add icons to the sub-dropdown elements (which lead to the menu with the “back” link) the icons won’t show up.
Icons for subdropdown not showing:
