From 0a7979ede2de037fb656a64de97c800d4bf3d7af Mon Sep 17 00:00:00 2001
From: Zeno Kapitein <zeno@gitbook.io>
Date: Tue, 2 Dec 2025 17:49:51 +0100
Subject: [PATCH] More layout fixes

---
 .../components/SpaceLayout/SpaceLayout.tsx    | 84 ++++++++++---------
 .../TableOfContents/TableOfContents.tsx       |  9 +-
 .../src/components/primitives/SideSheet.tsx   |  2 +-
 3 files changed, 48 insertions(+), 47 deletions(-)

diff --git a/packages/gitbook/src/components/SpaceLayout/SpaceLayout.tsx b/packages/gitbook/src/components/SpaceLayout/SpaceLayout.tsx
index 1b67acc4b..927f1429b 100644
--- a/packages/gitbook/src/components/SpaceLayout/SpaceLayout.tsx
+++ b/packages/gitbook/src/components/SpaceLayout/SpaceLayout.tsx
@@ -171,46 +171,52 @@ export function SpaceLayout(props: SpaceLayoutProps) {
                         // according to the header/variant settings.
                         // E.g if there is no header, the search button will be displayed in the ToC.
                         innerHeader={
-                            <>
-                                {!withTopHeader && (
-                                    <div className="mt-4 flex gap-2 max-lg:hidden">
-                                        <SearchContainer
-                                            style={CustomizationSearchStyle.Subtle}
-                                            withVariants={variants.generic.length > 1}
-                                            withSiteVariants={
-                                                visibleSections?.list.some(
-                                                    (s) =>
-                                                        s.object === 'site-section' &&
-                                                        s.siteSpaces.length > 1
-                                                ) ?? false
-                                            }
-                                            withSections={withSections}
-                                            section={visibleSections?.current}
-                                            siteSpace={siteSpace}
-                                            siteSpaces={visibleSiteSpaces}
-                                            className="max-lg:hidden"
-                                            viewport="desktop"
+                            !withTopHeader || variants.generic.length > 1 ? (
+                                <div
+                                    className={tcls(
+                                        'my-4 flex flex-col gap-4 px-5 empty:hidden',
+                                        variants.generic.length > 1 ? '' : 'max-lg:hidden'
+                                    )}
+                                >
+                                    {!withTopHeader && (
+                                        <div className="flex gap-2 max-lg:hidden">
+                                            <SearchContainer
+                                                style={CustomizationSearchStyle.Subtle}
+                                                withVariants={variants.generic.length > 1}
+                                                withSiteVariants={
+                                                    visibleSections?.list.some(
+                                                        (s) =>
+                                                            s.object === 'site-section' &&
+                                                            s.siteSpaces.length > 1
+                                                    ) ?? false
+                                                }
+                                                withSections={withSections}
+                                                section={visibleSections?.current}
+                                                siteSpace={siteSpace}
+                                                siteSpaces={visibleSiteSpaces}
+                                                viewport="desktop"
+                                            />
+                                        </div>
+                                    )}
+                                    {!withTopHeader && withSections && visibleSections && (
+                                        <SiteSectionList
+                                            className={tcls('hidden', 'lg:block')}
+                                            sections={encodeClientSiteSections(
+                                                context,
+                                                visibleSections
+                                            )}
                                         />
-                                    </div>
-                                )}
-                                {!withTopHeader && withSections && visibleSections && (
-                                    <SiteSectionList
-                                        className={tcls('hidden', 'lg:block')}
-                                        sections={encodeClientSiteSections(
-                                            context,
-                                            visibleSections
-                                        )}
-                                    />
-                                )}
-                                {variants.generic.length > 1 ? (
-                                    <SpacesDropdown
-                                        context={context}
-                                        siteSpace={siteSpace}
-                                        siteSpaces={variants.generic}
-                                        className="w-full px-3 py-2"
-                                    />
-                                ) : null}
-                            </>
+                                    )}
+                                    {variants.generic.length > 1 ? (
+                                        <SpacesDropdown
+                                            context={context}
+                                            siteSpace={siteSpace}
+                                            siteSpaces={variants.generic}
+                                            className="w-full px-3"
+                                        />
+                                    ) : null}
+                                </div>
+                            ) : null
                         }
                     />
                     {children}
diff --git a/packages/gitbook/src/components/TableOfContents/TableOfContents.tsx b/packages/gitbook/src/components/TableOfContents/TableOfContents.tsx
index 2ff871923..1083e67a3 100644
--- a/packages/gitbook/src/components/TableOfContents/TableOfContents.tsx
+++ b/packages/gitbook/src/components/TableOfContents/TableOfContents.tsx
@@ -103,14 +103,9 @@ export async function TableOfContents(props: {
                         'page-has-toc:[html.sidebar-filled.circular-corners_&]:rounded-3xl'
                     )}
                 >
-                    {innerHeader ? (
-                        <div className="flex flex-col gap-4 px-5 empty:hidden">{innerHeader}</div>
-                    ) : null}
+                    {innerHeader ? innerHeader : null}
                     <TOCScrollContainer // The scrollview inside the sidebar
-                        className={tcls(
-                            'flex grow flex-col p-2 pt-4 ',
-                            'hide-scrollbar overflow-y-auto'
-                        )}
+                        className="hide-scrollbar flex grow flex-col overflow-y-auto p-2"
                     >
                         <PagesList
                             pages={pages}
diff --git a/packages/gitbook/src/components/primitives/SideSheet.tsx b/packages/gitbook/src/components/primitives/SideSheet.tsx
index b47101302..2ed1bcc6f 100644
--- a/packages/gitbook/src/components/primitives/SideSheet.tsx
+++ b/packages/gitbook/src/components/primitives/SideSheet.tsx
@@ -127,7 +127,7 @@ export function SideSheet(
                         : side === 'left'
                           ? 'hydrated:animate-exit-to-left'
                           : 'hydrated:animate-exit-to-right',
-                    'fixed inset-y-0 z-41', // Above the side sheet scrim on z-40
+                    'fixed inset-y-0 z-41 max-w-full', // Above the side sheet scrim on z-40
                     side === 'left' ? 'left-0' : 'right-0',
                     withCloseButton ? (side === 'left' ? 'mr-16' : 'ml-16') : '',
                     isOpen ? '' : 'hidden',