Skip to content

Commit 37d72ac

Browse files
fix: match navbar Suspense fallback wrapper to loaded state
The fallback rendered LogoSection without a wrapper div, but the loaded state wrapped it in a div with flex/shrink classes. This mismatch caused a layout shift when BrandContextMenu loaded.
1 parent e71479b commit 37d72ac

File tree

1 file changed

+8
-6
lines changed

1 file changed

+8
-6
lines changed

src/components/Navbar.tsx

Lines changed: 8 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -305,12 +305,14 @@ export function Navbar({ children }: { children: React.ReactNode }) {
305305
<div className="flex items-center gap-2 font-black text-xl uppercase min-w-0">
306306
<React.Suspense
307307
fallback={
308-
<LogoSection
309-
menuButtonRef={menuButtonRef}
310-
setShowMenu={setShowMenu}
311-
showMenu={showMenu}
312-
title={Title}
313-
/>
308+
<div className={twMerge(`flex items-center group flex-shrink-0`)}>
309+
<LogoSection
310+
menuButtonRef={menuButtonRef}
311+
setShowMenu={setShowMenu}
312+
showMenu={showMenu}
313+
title={Title}
314+
/>
315+
</div>
314316
}
315317
>
316318
<LazyBrandContextMenu

0 commit comments

Comments
 (0)