From 3c4c8d14e398dc783080f7b91a961532fe4afa24 Mon Sep 17 00:00:00 2001 From: trippusultan Date: Mon, 8 Jun 2026 13:48:31 +0530 Subject: [PATCH] fix(theme): constrain navbar width to match content on large displays On wide viewports, the navbar expanded to full screen width while the main content area was constrained to --ifm-container-width-xl. This caused navbar items to appear at the far edges of the screen, requiring users to scan the entire width. Changes: - Add justify-content: center to .navbar - Add max-width: var(--ifm-container-width-xl) to .navbar__inner This aligns the navbar with the content area, footer, and other page elements, creating a consistent vertical scanning area. Closes #7562 --- .../src/theme/Navbar/Layout/styles.module.css | 8 ++++++++ 1 file changed, 8 insertions(+) diff --git a/packages/docusaurus-theme-classic/src/theme/Navbar/Layout/styles.module.css b/packages/docusaurus-theme-classic/src/theme/Navbar/Layout/styles.module.css index 8258c17f2cfd..0ac317fe0372 100644 --- a/packages/docusaurus-theme-classic/src/theme/Navbar/Layout/styles.module.css +++ b/packages/docusaurus-theme-classic/src/theme/Navbar/Layout/styles.module.css @@ -5,6 +5,14 @@ * LICENSE file in the root directory of this source tree. */ +.navbar { + justify-content: center; +} + +.navbar__inner { + max-width: var(--ifm-container-width-xl); +} + .navbarHideable { transition: transform var(--ifm-transition-fast) ease; }