Skip to content
This repository has been archived by the owner on Sep 16, 2019. It is now read-only.

How to disable desktop menu, top bar completely - use mobile menu at all widths #1381

Open
adambundy opened this issue Apr 22, 2019 · 1 comment

Comments

@adambundy
Copy link

Using latest FP version, what is the protocol for disabling the desktop menu completely and using the mobile menu always? Modifying that breakpoint is doable but I can't seem to get it fully disabled. Thanks much in advance for any help!

@adambundy
Copy link
Author

adambundy commented Apr 23, 2019

Updating here with the solution that worked for me. Rather than disabling the switch, I created a new breakpoint called 'uber' (> 9999px) which would never match. Then, I added data-hide-for="uber" to the .title-bar element:
<div class="site-title-bar title-bar" <?php foundationpress_title_bar_responsive_toggle(); ?> data-hide-for="uber">

I also needed to adjust the breakpoints in _navigation.scss:

// Navigation breakpoints
.mobile-menu,
.site-title-bar {
  @include hide-for(uber);
}
.desktop-menu,
.site-navigation .top-bar-left {
  @include show-for(uber);
}

Now the switch to the desktop menu never happens.

Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant