From 9bebd092ebad1818e31cac8e86e5b03704554995 Mon Sep 17 00:00:00 2001 From: Divyansh Singh <40380293+brc-dd@users.noreply.github.com> Date: Thu, 27 Aug 2026 21:43:00 +0530 Subject: [PATCH] fix(theme): paint the navbar divider on its own layer Safari composites the sticky local nav above the bar's negative-z rule in their overlapping row, regardless of z-index, hiding the divider below 60rem (#5399). Promoting the rule to its own layer restores the order. Flyout panels still cover it. Co-Authored-By: Claude Fable 5 --- src/client/theme-default/components/VPNavBar.vue | 3 +++ 1 file changed, 3 insertions(+) diff --git a/src/client/theme-default/components/VPNavBar.vue b/src/client/theme-default/components/VPNavBar.vue index 7daff981..81c84c1e 100644 --- a/src/client/theme-default/components/VPNavBar.vue +++ b/src/client/theme-default/components/VPNavBar.vue @@ -274,6 +274,9 @@ const overflow = provideNavOverflow({ /* above the background surface, below the bar's content — an open flyout panel overlaps the bar's bottom edge and must cover the rule */ z-index: -1; + /* own layer — Safari otherwise sorts the rule behind the sticky local + nav's surface in their overlapping row (#5399) */ + transform: translateZ(0); width: 100%; height: 1px; padding-left: var(--vp-nav-col-offset);