4 replies · opened Sep 24, 2023
I need the Products mega menu to behave like the rest of the Primary menu. Specifically, when resized down between 768-991px the primary menu trigger appears as expected. At that point, everything then operates as expected except for the Products mega menu. That menu only begins working under 768px. I need this to work in concert with the rest. I'm guessing it's just a JS tweak, but I've been unable to put my finger on it.
Can you please help me get this working?
Hello,
Thanks for your Patience!
We have checked out the Codes but are not able to pinpoint what is causing the issues due to extensive customizations. Our best guess is that the Customizations are causing this issue as the Default Files from v6.6.5 Package (which you are also using) appears to be working perfectly fine: https://themes.semicolonweb.com/html/canvas/v6/mega-menu.html on all breakpoints. We highly recommend taking a Backup of your Codes and then replacing the JS Codes from your Website with the Default JS Codes from the v6.6.5 Package to debug this issue. If the issue still remains, please provide us with an Updated Live URL so that we can check more on this. Thanks for your Patience.
Meanwhile, do let us know if we can help you with anything else or if you find any further issues with Canvas.
OK. This is a CSS issue that only happens when you compile the SASS code into a style.css file. That is what causes the problem described above, where none of the mega menus work between 768px and 991px and then once further reduced to the 767px they begin to work properly.
You can reproduce, by downloading a fresh copy and compiling the style.scss file and then testing for the problem above.
I'm not sure what's causing this as it's rather difficult to compare the SASS file to the CSS file as the file looks quite different to the style.css file that is included in the 6.5.5 download.
I would appreciate it you could look at this more closely and help me get this fixed. Thanks.
Nevermind. I figured it out, but you should probably update your code too.
The fix for this is found on line 719 of _header.scss which needs to be changed to "@include media-breakpoint-down(lg)" not "md".
You can close this ticket. You're welcome. :-)
Hello,
Apologies for the Inconveniences caused and Thank You so much for providing us with the Solution! Really Appreciated!
Canvas versions prior to v7 were CSS first and SCSS were created and updated manually based on the CSS Updates (which we know is terrible practice)! Which is why we wrote everything from scratch in v7.
Thanks again for your Kind Patience and please do let us know if we can help you with anything else.
Have the same question, or something new?
Sign in to the Canvas dashboard to reply or open your own topic. Canvas owners get direct help from the SemiColonWeb team.
Reply on the dashboard