How to collapse nav bar to hamburger toggle at 1200px

Hello,

Canvas 6 does not include the css/responsive.css anymore and the Responsive Codes are directly embedded into the style.css Files. Having a Mobile Menu at 1200px 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: 1200px) and from @media (max-width: 991.98px) to @media (max-width: 1199.98px).

2. In the js/functions.js File, you will need to change all the following codes targeting the Headers and Primary Menus:

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

to:

$body.hasClass('device-xl')

and:

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

to:

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

This should definitely work fine. We are already 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.