From 849674ae090d1271a9e637585919cbf0a7f77d06 Mon Sep 17 00:00:00 2001 From: ayush00git Date: Sun, 14 Jun 2026 12:06:56 +0530 Subject: [PATCH 1/2] Fix docs sidebar rendering at double width on wide screens The previous sidebar fix widened the container by the navbar offset (`(100vw - 1280px)/2`), which on a 1920px screen made the sidebar ~620px instead of 300px. Revert the width to the panel width and use a normal menu inset so the sidebar stays a consistent 300px at every screen width without clipping. Co-Authored-By: Claude Opus 4.8 --- src/css/custom.css | 10 ++-------- 1 file changed, 2 insertions(+), 8 deletions(-) diff --git a/src/css/custom.css b/src/css/custom.css index 117bfab0e00..bed17a8184d 100644 --- a/src/css/custom.css +++ b/src/css/custom.css @@ -180,17 +180,11 @@ --fory-doc-gutter-width: 18px; --fory-doc-sidebar-inset: 2rem; --fory-doc-sidebar-panel-width: 300px; - --fory-doc-sidebar-offset: max(0px, calc((100vw - var(--fory-layout-width)) / 2)); --fory-doc-toc-right-inset: 1.5rem; } html:root { - /* - * The menu is aligned with the centered navbar on wide screens. Keep the - * Docusaurus sidebar at least that wide, otherwise its overflow clipping - * hides the menu and the sidebar looks empty. - */ - --doc-sidebar-width: calc(var(--fory-doc-sidebar-panel-width) + var(--fory-doc-sidebar-offset)); + --doc-sidebar-width: var(--fory-doc-sidebar-panel-width); } .theme-doc-breadcrumbs, @@ -352,7 +346,7 @@ html:root { @media (min-width: 997px) { .theme-doc-sidebar-menu { - padding-left: max(.75rem, var(--fory-doc-sidebar-offset)); + padding-left: var(--fory-doc-sidebar-inset); } } From 992630e44da12319b173a28d9f3e22c795afe222 Mon Sep 17 00:00:00 2001 From: ayush00git Date: Sun, 14 Jun 2026 17:57:40 +0530 Subject: [PATCH 2/2] Make navbar full width with logo aligned to docs sidebar The navbar was capped and centered at 1280px, so on wide screens the brand floated in a centered band that no longer lined up with the left-edge docs sidebar. Run the navbar full width and align its left padding with the sidebar inset so the logo sits above the sidebar. Co-Authored-By: Claude Opus 4.8 --- src/css/custom.css | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/src/css/custom.css b/src/css/custom.css index bed17a8184d..ecf1aa504b0 100644 --- a/src/css/custom.css +++ b/src/css/custom.css @@ -34,14 +34,14 @@ @media (min-width: 997px) { .navbar { - padding-left: 1.5rem; + /* Align the logo with the docs sidebar inset and run full width so the + * brand sits above the sidebar instead of floating in a centered band. */ + padding-left: var(--fory-doc-sidebar-inset); padding-right: 1.5rem; } .navbar__inner { - margin-left: auto; - margin-right: auto; - max-width: var(--fory-layout-width); + max-width: none; } .navbar__brand {