Mobile menu kicks in at 767px, but between 768-991px things are sort of limbo where the main navigation has suppressed to toggle button but most desktop header styling still exists. So in essence there are three different headers. This makes styling customization much more complicated for people.
The solution:
Let's eliminate the "limbo" stage, and have the entire mobile header kick in earlier at that 991px.
Customization:
Many people will of course not like the simplified mobile header kicking in so early (at tablets), but will be required for those with large primary navigations. So we will need to set this all up so there's a theme option to specify where the mobile header kicks in at Appearance > Theme Options > Layout > Header. Holding off on this.
Note: Relates to #185, #274.
Additional: Let's consider adding a height option for mobile header. #316
The current problem:
Mobile menu kicks in at 767px, but between 768-991px things are sort of limbo where the main navigation has suppressed to toggle button but most desktop header styling still exists. So in essence there are three different headers. This makes styling customization much more complicated for people.
The solution:
Let's eliminate the "limbo" stage, and have the entire mobile header kick in earlier at that 991px.
Customization:
Many people will of course not like the simplified mobile header kicking in so early (at tablets), but will be required for those with large primary navigations. So we will need to set this all up so there's a theme option to specify where the mobile header kicks in at Appearance > Theme Options > Layout > Header.Holding off on this.Note: Relates to #185, #274.
Additional: Let's consider adding a height option for mobile header. #316