diff --git a/packages/docusaurus-theme-classic/src/theme/DocRoot/Layout/Sidebar/index.tsx b/packages/docusaurus-theme-classic/src/theme/DocRoot/Layout/Sidebar/index.tsx index 7ea64ff764d0..f996615bc19c 100644 --- a/packages/docusaurus-theme-classic/src/theme/DocRoot/Layout/Sidebar/index.tsx +++ b/packages/docusaurus-theme-classic/src/theme/DocRoot/Layout/Sidebar/index.tsx @@ -49,7 +49,7 @@ export default function DocRootLayoutSidebar({ }, [setHiddenSidebarContainer, hiddenSidebar]); return ( - } - + ); } diff --git a/packages/docusaurus-theme-classic/src/theme/DocSidebar/Desktop/Content/index.tsx b/packages/docusaurus-theme-classic/src/theme/DocSidebar/Desktop/Content/index.tsx index 50da5fedb280..f19ececb14cb 100644 --- a/packages/docusaurus-theme-classic/src/theme/DocSidebar/Desktop/Content/index.tsx +++ b/packages/docusaurus-theme-classic/src/theme/DocSidebar/Desktop/Content/index.tsx @@ -12,7 +12,6 @@ import { useAnnouncementBar, useScrollPosition, } from '@docusaurus/theme-common/internal'; -import {translate} from '@docusaurus/Translate'; import DocSidebarItems from '@theme/DocSidebarItems'; import type {Props} from '@theme/DocSidebar/Desktop/Content'; @@ -41,12 +40,7 @@ export default function DocSidebarDesktopContent({ const showAnnouncementBar = useShowAnnouncementBar(); return ( - + ); } diff --git a/packages/docusaurus-theme-classic/src/theme/DocSidebar/Desktop/index.tsx b/packages/docusaurus-theme-classic/src/theme/DocSidebar/Desktop/index.tsx index 845fd8943999..504723a5b425 100644 --- a/packages/docusaurus-theme-classic/src/theme/DocSidebar/Desktop/index.tsx +++ b/packages/docusaurus-theme-classic/src/theme/DocSidebar/Desktop/index.tsx @@ -5,9 +5,11 @@ * LICENSE file in the root directory of this source tree. */ -import React from 'react'; +import React, {useState} from 'react'; import clsx from 'clsx'; import {useThemeConfig} from '@docusaurus/theme-common'; +import {useScrollPosition} from '@docusaurus/theme-common/internal'; +import {translate} from '@docusaurus/Translate'; import Logo from '@theme/Logo'; import CollapseButton from '@theme/DocSidebar/Desktop/CollapseButton'; import Content from '@theme/DocSidebar/Desktop/Content'; @@ -22,18 +24,49 @@ function DocSidebarDesktop({path, sidebar, onCollapse, isHidden}: Props) { sidebar: {hideable}, }, } = useThemeConfig(); + const [isNavbarVisible, setIsNavbarVisible] = useState(hideOnScroll); + + useScrollPosition( + ({scrollY}) => { + if (hideOnScroll) { + setIsNavbarVisible(scrollY === 0); + } + }, + [hideOnScroll], + ); return ( -