Language selector fixes (#3632)

Author: zenoachtig

.changeset/serious-actors-sing.md

@@ -0,0 +1,5 @@
+---
+"gitbook": patch
+---
+
+Language selector edge cases

packages/gitbook/src/components/Header/Header.tsx

@@ -80,13 +80,14 @@ export function Header(props: {
                         >
                             <HeaderMobileMenu
                                 className={tcls(
-                                    'lg:hidden',
                                     '-ml-2',
                                     'text-tint-strong',
                                     'theme-bold:text-header-link',
                                     'hover:bg-tint-hover',
                                     'hover:theme-bold:bg-header-link/3',
-                                    withVariants === 'generic' ? '' : 'page-no-toc:hidden'
+                                    withVariants === 'generic'
+                                        ? 'xl:hidden'
+                                        : 'page-no-toc:hidden lg:hidden'
                                 )}
                             />
                             <HeaderLogo context={context} />

packages/gitbook/src/components/SpaceLayout/SpaceLayout.tsx

@@ -20,7 +20,7 @@ import type { RenderAIMessageOptions } from '../AI';
 import { AIChat } from '../AIChat';
 import { AdaptiveVisitorContextProvider } from '../Adaptive';
 import { Announcement } from '../Announcement';
-import { SpacesDropdown } from '../Header/SpacesDropdown';
+import { SpacesDropdown, TranslationsDropdown } from '../Header/SpacesDropdown';
 import { InsightsProvider } from '../Insights';
 import { SearchContainer } from '../Search';
 import { SiteSectionList, encodeClientSiteSections } from '../SiteSections';
@@ -156,12 +156,20 @@ export function SpaceLayout(props: SpaceLayoutProps) {
                                         'pr-4',
                                         'lg:flex',
                                         'grow-0',
-                                        'flex-wrap',
                                         'dark:shadow-light/1',
-                                        'text-base/tight'
+                                        'text-base/tight',
+                                        'items-center'
                                     )}
                                 >
                                     <HeaderLogo context={context} />
+                                    {withVariants === 'translations' ? (
+                                        <TranslationsDropdown
+                                            context={context}
+                                            siteSpace={siteSpace}
+                                            siteSpaces={siteSpaces}
+                                            className="[&_.button-leading-icon]:block! ml-auto py-2 [&_.button-content]:hidden"
+                                        />
+                                    ) : null}
                                 </div>
                             )
                         }