Better solution

facebook · Mar 27, 2022 · 1bc5884 · 1bc5884
1 parent 5870f0f
commit 1bc5884
Show file tree

Hide file tree

Showing 3 changed files with 5 additions and 6 deletions.
diff --git a/packages/docusaurus-theme-classic/src/theme/DocPage/Layout/index.tsx b/packages/docusaurus-theme-classic/src/theme/DocPage/Layout/index.tsx
@@ -14,13 +14,13 @@ import DocPageLayoutMain from '@theme/DocPage/Layout/Main';
 
 import styles from './styles.module.css';
 
-import {useDocsSidebar, ThemeClassNames} from '@docusaurus/theme-common';
+import {useDocsSidebar} from '@docusaurus/theme-common';
 
 export default function DocPageLayout({children}: Props): JSX.Element {
   const sidebar = useDocsSidebar();
   const [hiddenSidebarContainer, setHiddenSidebarContainer] = useState(false);
   return (
-    <Layout wrapperClassName={ThemeClassNames.wrapper.docsPages}>
+    <Layout wrapperClassName={styles.docsWrapper}>
       <BackToTopButton />
       <div className={styles.docPage}>
         {sidebar && (

diff --git a/packages/docusaurus-theme-classic/src/theme/DocPage/Layout/styles.module.css b/packages/docusaurus-theme-classic/src/theme/DocPage/Layout/styles.module.css
@@ -10,14 +10,11 @@
   --doc-sidebar-hidden-width: 30px;
 }
 
-:global(.docs-wrapper) {
-  display: flex;
-}
-
 .docPage {
   width: 100%;
 }
 
+.docsWrapper,
 .docPage,
 .docMainContainer {
   display: flex;

diff --git a/packages/docusaurus-theme-classic/src/theme/DocPage/index.tsx b/packages/docusaurus-theme-classic/src/theme/DocPage/index.tsx
@@ -77,6 +77,8 @@ export default function DocPage(props: Props): JSX.Element {
       />
       <HtmlClassNameProvider
         className={clsx(
+          // TODO: it should be removed from here
+          ThemeClassNames.wrapper.docsPages,
           ThemeClassNames.page.docsDocPage,
           props.versionMetadata.className,
         )}>