New local navbar design breaks ubiquitous header styling

[elringus]

Describe the bug

https://github.com/vuejs/vitepress/pull/3359 makes it so that there are two separate headers now (VPNav and VPLocalNav), which make it impossible to apply single style for header, such as blur effect. Even if I remove the divider and border, it'll look as follow:

Reproduction

Add blur filter to VPNav and VPLocalNav and remove borders.

Expected behavior

Both headers should be wrapped under single element (eg, <header>).

System Info

-

Additional context

No response

Validations

• [X] Check if you're on the latest VitePress version.
• [X] Follow our Code of Conduct
• [X] Read the docs.
• [X] Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.

[brc-dd]

/cc @kiaking

[giladgd]

@brc-dd Please bring back the curtain below the header instead of the black divider, the curtain looked much better. I stay on an older version of Vitepress because of that

[elringus]

the curtain looked much better

That's subjective. I like the new style more. Additionally, curtain was causing UX issues, where it blocked raycast for visible elements, such as links (user could clearly see a link under the curtain, but couldn't click it).

And you can always bring the curtain back via custom CSS anyway.

[giladgd]

@elringus That's the thing, I can't just add this using purely CSS, as it requires another DOM element and depends on custom logic built around it. Having it brought back as a flag that can be enabled would also be great.