Fix logo sizing bug during navigation

packages/gitbook/src/components/PageBody/PageBody.tsx

@@ -65,6 +65,8 @@ export function PageBody(props: {
             (page) => page.type !== 'document' || (page.type === 'document' && !page.hidden)
         ).length > 0;
 
+    const pageHasToc = page.layout.tableOfContents && hasVisibleTOCItems;
+
     return (
         <CurrentPageProvider page={{ spaceId: context.space.id, pageId: page.id }}>
             <main
@@ -76,12 +78,10 @@ export function PageBody(props: {
                     '@container',
                     pageWidthWide ? 'page-width-wide 3xl:px-8' : 'page-width-default',
                     siteWidthWide ? 'site-width-wide' : 'site-width-default',
-                    page.layout.tableOfContents && hasVisibleTOCItems
-                        ? 'page-has-toc'
-                        : 'page-no-toc'
+                    pageHasToc ? 'page-has-toc' : 'page-no-toc'
                 )}
             >
-                <PreservePageLayout siteWidthWide={siteWidthWide} />
+                <PreservePageLayout siteWidthWide={siteWidthWide} pageHasToc={pageHasToc} />
                 {page.cover && page.layout.cover && page.layout.coverSize === 'hero' ? (
                     <PageCover as="hero" page={page} cover={page.cover} context={context} />
                 ) : null}

packages/gitbook/src/components/PageBody/PreservePageLayout.tsx

@@ -11,9 +11,10 @@ import * as React from 'react';
  * 3. Page 2 with full width block: `body:has(.site-width-wide)` is true
  *
  * This component ensures that the layout is preserved while transitioning between the 2 page states (in step 2).
+ * It also preserves the page TOC state (page-has-toc/page-no-toc) to prevent logo sizing issues during navigation.
  */
-export function PreservePageLayout(props: { siteWidthWide: boolean }) {
-    const { siteWidthWide } = props;
+export function PreservePageLayout(props: { siteWidthWide: boolean; pageHasToc: boolean }) {
+    const { siteWidthWide, pageHasToc } = props;
 
     React.useLayoutEffect(() => {
         // We use the header as it's an element preserved between page transitions
@@ -28,7 +29,15 @@ export function PreservePageLayout(props: { siteWidthWide: boolean }) {
         } else {
             header.classList.remove('site-width-wide');
         }
-    }, [siteWidthWide]);
+
+        if (pageHasToc) {
+            header.classList.add('page-has-toc');
+            header.classList.remove('page-no-toc');
+        } else {
+            header.classList.add('page-no-toc');
+            header.classList.remove('page-has-toc');
+        }
+    }, [siteWidthWide, pageHasToc]);
 
     return null;
 }