Cleanup Navigation

[derweili]

FoundationPress includes a bunch of navigation styling in the navigation.scss

This is special styling without any documentation. (Which causes problems for users using FoundationPress for the first time #1364)

FoundationPress is a Starter Theme is for WordPress implementing the foundation-sites framework
Because of this I don't see any reason why FoundationPress should implement own styles different to the foundation-sites standards unless WordPress requires those styles.

I recommend following changes:

• Remove the unnecessary stylings in the navigation scss
• Reset the Top-Bar and Menus Styling-Variables in the settings.scss
• Toggle the whole Top-Bar when using it as a mobile nav instead of the mobile nav inside the top-bar-right
  According to the Foundation Docs https://foundation.zurb.com/sites/docs/top-bar.html#advanced-layout

[zkriszti]

Ole, thank you for this clean WP-starting theme.
However, talking about navigation, I think it is not really good practice making the menu responsive by creating two menu locations, rendering both in the DOM, and then just set "display: none" in CSS for whichever is not necessary in the current view. There should be only one menu location in the header, as we are talking about the same functional item ("header menu") regardless of size of viewport. Then apply CSS styling with media queries to this one. This is simple to solve by using flexbox (order), but if FoundationPress needs to support legacy browsers, it is still achievable by using floats.

[zkriszti]

Also, putting the hamburger icon into title-bar and the menu into top-bar makes changing responsive menu toggling (ie. make a different breakpoint only for the menu) a cumbersome task.

[nitrokevin]

As foundationpress is based on foundation, it needs to follow how foundation works, you need to suggest those changes to the foundation-sites team :)