Is possible use mobile menu for always resolution?

2 replies · opened Jul 15, 2020

PpapanzJul 15, 2020

I use the last version on canvas 6.0, is possible alway use mobile menu (because i have a lot of item to add in menu)

  1. i change the break poin in style css (row #3367)

@media (min-width: 2000px) {

.primary-menu {
	-ms-flex: 0 0 auto;
	flex: 0 0 auto;
	-ms-flex-positive: 0;
	flex-grow: 0;
}........
  1. i change function.js (row #624)

$('#primary-menu-trigger').off( 'click' ).on( 'click', function() {
if( $body.hasClass('device-xl') || $body.hasClass('device-lg') || $body.hasClass('device-md') || $body.hasClass('device-sm') || $body.hasClass('device-xs') ) {.................


now it works, but the style is a little different than dafault's padding and submenus are open for default

Is there a more comfortable and elegant way to always use the mobile menu?

SSemicolon WebSTAFFJul 16, 2020

Hello,

This is Definitely Possible but there is a fair bit of Customization required to achieve this:

  1. In the style.css File, you will need to change all the Media Queries that includes the #header,#primary-menu and other Header Elements from @media (min-width: 992px) to @media (min-width: 2000px) and from @media (max-width: 991.98px) to @media (max-width: 1999.98px).

  2. In the js/functions.js File, you will need to remove all the if Blocks targeting the Headers and Primary Menus:


$body.hasClass('device-xl') || $body.hasClass('device-lg')

and:


$body.hasClass('device-md') || $body.hasClass('device-sm') || $body.hasClass('device-xs')

to:


$body.hasClass('device-xl') || $body.hasClass('device-lg') || $body.hasClass('device-md') || $body.hasClass('device-sm') || $body.hasClass('device-xs')

This will definitely work fine. We are working on making this much more easier in the coming updates. Hope this Helps!

Let us know if we can help you with anything else or if you find any further issues.

PpapanzJul 20, 2020

Thanks a lot!

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