From b9b5887b5f2010010287ca755c7eb5265c8873b9 Mon Sep 17 00:00:00 2001
From: Zeno Kapitein <zeno@gitbook.io>
Date: Thu, 14 Aug 2025 20:02:17 +0200
Subject: [PATCH] Mobile considerations

---
 .../gitbook/src/components/Header/Header.tsx  | 26 ++++++++++++-------
 .../components/SpaceLayout/SpaceLayout.tsx    |  5 +++-
 2 files changed, 20 insertions(+), 11 deletions(-)

diff --git a/packages/gitbook/src/components/Header/Header.tsx b/packages/gitbook/src/components/Header/Header.tsx
index 094a3667d..57144c865 100644
--- a/packages/gitbook/src/components/Header/Header.tsx
+++ b/packages/gitbook/src/components/Header/Header.tsx
@@ -165,10 +165,13 @@ export function Header(props: {
                                     'page-default-width:2xl:px-[calc((100%-1536px+4rem)/2)]'
                                 )}
                             >
-                                {withVariants === 'generic' && (
+                                {withVariants ? (
                                     <div
                                         id="variants"
-                                        className="my-2 mr-5 page-no-toc:flex hidden grow border-tint border-r pr-5 *:grow only:mr-0 only:border-none only:pr-0 sm:max-w-64"
+                                        className={tcls(
+                                            'my-2 mr-5 page-no-toc:flex hidden grow border-tint border-r pr-5 *:grow only:mr-0 only:border-none only:pr-0 sm:max-w-64',
+                                            withVariants === 'translations' ? 'xl:hidden' : ''
+                                        )}
                                     >
                                         <SpacesDropdown
                                             context={context}
@@ -177,14 +180,17 @@ export function Header(props: {
                                             className="w-full grow py-1"
                                         />
                                     </div>
-                                )}
-                                {sections &&
-                                    (sections.list.some((s) => s.object === 'site-section-group') || // If there's even a single group, show the tabs
-                                        sections.list.length > 1) && ( // Otherwise, show the tabs if there's more than one section
-                                        <SiteSectionTabs
-                                            sections={encodeClientSiteSections(context, sections)}
-                                        />
-                                    )}
+                                ) : null}
+                                {sections
+                                    ? (sections.list.some(
+                                          (s) => s.object === 'site-section-group'
+                                      ) || // If there's even a single group, show the tabs
+                                          sections.list.length > 1) && ( // Otherwise, show the tabs if there's more than one section
+                                          <SiteSectionTabs
+                                              sections={encodeClientSiteSections(context, sections)}
+                                          />
+                                      )
+                                    : null}
                             </div>
                         </div>
                     </div>
diff --git a/packages/gitbook/src/components/SpaceLayout/SpaceLayout.tsx b/packages/gitbook/src/components/SpaceLayout/SpaceLayout.tsx
index fb9f947eb..828fdb0ab 100644
--- a/packages/gitbook/src/components/SpaceLayout/SpaceLayout.tsx
+++ b/packages/gitbook/src/components/SpaceLayout/SpaceLayout.tsx
@@ -162,13 +162,16 @@ export function SpaceLayout(props: {
                                                     )}
                                                 />
                                             )}
-                                            {withVariants === 'generic' && (
+                                            {withVariants && (
                                                 <SpacesDropdown
                                                     context={context}
                                                     siteSpace={siteSpace}
                                                     siteSpaces={siteSpaces}
                                                     className={tcls(
                                                         'w-full',
+                                                        withVariants === 'translations'
+                                                            ? 'xl:hidden'
+                                                            : '',
                                                         'page-no-toc:hidden',
                                                         'page-no-toc:site-header-none:flex'
                                                     )}