diff --git a/packages/docusaurus-theme-classic/src/theme/DocPage/styles.module.css b/packages/docusaurus-theme-classic/src/theme/DocPage/styles.module.css index 453432cb78..424e7743e4 100644 --- a/packages/docusaurus-theme-classic/src/theme/DocPage/styles.module.css +++ b/packages/docusaurus-theme-classic/src/theme/DocPage/styles.module.css @@ -13,6 +13,8 @@ border-right: 1px solid var(--ifm-contents-border-color); box-sizing: border-box; width: 300px; + position: relative; + top: calc(-1 * var(--ifm-navbar-height)); } .docMainContainer { diff --git a/packages/docusaurus-theme-classic/src/theme/DocSidebar/index.js b/packages/docusaurus-theme-classic/src/theme/DocSidebar/index.js index 98480a4696..cf1a30153b 100644 --- a/packages/docusaurus-theme-classic/src/theme/DocSidebar/index.js +++ b/packages/docusaurus-theme-classic/src/theme/DocSidebar/index.js @@ -7,7 +7,8 @@ import React, {useState, useCallback} from 'react'; import classnames from 'classnames'; - +import useDocusaurusContext from '@docusaurus/useDocusaurusContext'; +import useBaseUrl from '@docusaurus/useBaseUrl'; import Link from '@docusaurus/Link'; import styles from './styles.module.css'; @@ -104,6 +105,10 @@ function mutateSidebarCollapsingState(item, location) { function DocSidebar(props) { const [showResponsiveSidebar, setShowResponsiveSidebar] = useState(false); + const { + siteConfig: {themeConfig: {navbar: {title, logo = {}} = {}}} = {}, + } = useDocusaurusContext(); + const logoUrl = useBaseUrl(logo.src); const { docsSidebars, @@ -132,6 +137,10 @@ function DocSidebar(props) { return (