Changing the smartmenus breakpoint for Backdrop CMS
The breakpoint for a Smartmens menu to go from displaying only the hamburger to displaying the whole menu is 768px by default. I had a site where I needed the breakpoint to fall at 1120px instead, here's how I changed it:
I started by copying two CSS files from backdrop core into my theme. The two files were named menu-dropdown.theme.css
and menu-toggle.theme.css
and are located in the core/modules/system/css/
directory.
I then opened both copies of these files in my editor, and changed every breakpoint that was 768px, to 1120px. The breakpoints are specified in ems, so that meant replacing
@media (min-width: 48em) {
with
@media (min-width: 70em) {
I then added both these stylesheets into my theme's .info file, like so: