Header Sticky: Keep the open navigation overlay above the admin bar and Search Bar - #135

Description

Fixes #98, fixes #99.

With the Header Sticky design, the header wrapper is position: sticky; z-index: 10, which creates a stacking context. The navigation overlay's z-index: 100000 then only applies inside the header, so at page level the open overlay sits at 10:

• below the admin bar (#wpadminbar, z-index: 99999), which covers the overlay's close button on small screens (Header stick: Difficult to close the navigation overlay once opened #98);
• level with the pinned Search Bar (.sticky-bottom, z-index: 10), which comes later in the DOM and is painted on top of the overlay (Header Stick: Search bar is on top of the navigation overlay #99).

Thanks to @prasadkarmalkar for the analysis in #99. Raising the header to z-index: 11 fixes #99 but not #98, because the admin bar is still above it. This PR lifts the sticky header to z-index: 100000 only while the overlay is open, so it behaves like the default and collapsed headers. When the menu is closed, the header keeps z-index: 10 and stays under the admin bar as before.

Measured at 390×844 and 599×900, logged in with the admin bar showing, Header Sticky, overlay opened at the top of the page:

The default (non-sticky) header measured the same before and after.

Separate from this PR: the overlay close icon in patterns/hidden-navigation-overlay.php has no colour set, so it renders black on the black overlay with every header design. I can open a separate issue for that.

Screenshots

Testing Instructions

1. Activate Ipsum and make sure the admin bar shows on the front end.
2. In the Site Editor, set the header template part to the Header Sticky design and save.
3. On the front end, narrow the window below 600px and stay at the top of the page.
4. Open the navigation overlay.
5. Before: the close button sits under the admin bar and the Search Bar shows above the overlay. After: the close button can be clicked (and reached with Tab), and the overlay covers the Search Bar.
6. Close the menu and scroll: the sticky header still sits below the admin bar and above the content.

Use of AI Tools

AI assistance: Yes
Used for: Initial draft of the change, measurements and this description; the change was reviewed and tested by me in Chrome.