fix(v1): apply negative margin to docs heading only (#2028)

facebook · Nov 22, 2019 · 0984dfc · 0984dfc
1 parent a2c9298
commit 0984dfc
Show file tree

Hide file tree

Showing 2 changed files with 9 additions and 9 deletions.
diff --git a/packages/docusaurus-1.x/lib/core/DocsLayout.js b/packages/docusaurus-1.x/lib/core/DocsLayout.js
@@ -97,7 +97,7 @@ class DocsLayout extends React.Component {
             collapsible={this.props.config.docsSideNavCollapsible}
             metadata={metadata}
           />
-          <Container className="mainContainer">
+          <Container className="mainContainer docsContainer">
             <DocComponent
               metadata={metadata}
               content={content}

diff --git a/packages/docusaurus-1.x/lib/static/css/main.css b/packages/docusaurus-1.x/lib/static/css/main.css
@@ -653,12 +653,12 @@ blockquote {
   padding: 0;
 }
 
-.mainContainer .wrapper .post .postHeader:before,
-.mainContainer .wrapper .post .postHeaderTitle:before {
-  content: "";
+.docsContainer .wrapper .post .postHeader:before,
+.docsContainer .wrapper .post .postHeaderTitle:before {
+  content: '';
   display: block;
   height: 90px; /* fixed header height and empty space below it */
-  margin-top: -90px;  /* negative fixed header height and empty space below it  */
+  margin-top: -90px; /* negative fixed header height and empty space below it  */
   visibility: hidden;
   pointer-events: none;
 }
@@ -726,12 +726,12 @@ blockquote {
 }
 
 @media only screen and (max-width: 1023px) {
-  .mainContainer .wrapper .post .postHeader:before,
-  .mainContainer .wrapper .post .postHeaderTitle:before {
-    content: "";
+  .docsContainer .wrapper .post .postHeader:before,
+  .docsContainer .wrapper .post .postHeaderTitle:before {
+    content: '';
     display: block;
     height: 200px; /* fixed header height and empty space below it */
-    margin-top: -200px;  /* negative fixed header height and empty space below it  */
+    margin-top: -200px; /* negative fixed header height and empty space below it  */
     visibility: hidden;
     pointer-events: none;
   }