From 3df601c2fa89ce6124e7fca04a1f5c3fa9d5424f Mon Sep 17 00:00:00 2001
From: Alexey Pyltsyn <lex61rus@gmail.com>
Date: Tue, 12 Nov 2019 07:48:39 +0300
Subject: [PATCH] fix(v2): remove empty containers when no data in blog pages
 (#1963)

---
 .../src/theme/BlogPostItem/index.js           | 20 +++++++++----------
 .../src/theme/BlogPostPage/index.js           | 14 +++++++------
 2 files changed, 18 insertions(+), 16 deletions(-)

diff --git a/packages/docusaurus-theme-classic/src/theme/BlogPostItem/index.js b/packages/docusaurus-theme-classic/src/theme/BlogPostItem/index.js
index 80c0dba90c..79e8c864e2 100644
--- a/packages/docusaurus-theme-classic/src/theme/BlogPostItem/index.js
+++ b/packages/docusaurus-theme-classic/src/theme/BlogPostItem/index.js
@@ -89,10 +89,10 @@ function BlogPostItem(props) {
       <article className="markdown">
         <MDXProvider components={MDXComponents}>{children}</MDXProvider>
       </article>
-      <div className="row margin-vert--lg">
-        <div className="col">
+      {(tags.length > 0 || truncated) && (
+        <div className="row margin-vert--lg">
           {tags.length > 0 && (
-            <>
+            <div className="col">
               <strong>Tags:</strong>
               {tags.map(({label, permalink: tagPermalink}) => (
                 <Link
@@ -102,17 +102,17 @@ function BlogPostItem(props) {
                   {label}
                 </Link>
               ))}
-            </>
+            </div>
           )}
-        </div>
-        <div className="col text--right">
           {truncated && (
-            <Link to={metadata.permalink}>
-              <strong>Read More</strong>
-            </Link>
+            <div className="col text--right">
+              <Link to={metadata.permalink}>
+                <strong>Read More</strong>
+              </Link>
+            </div>
           )}
         </div>
-      </div>
+      )}
     </div>
   );
 }
diff --git a/packages/docusaurus-theme-classic/src/theme/BlogPostPage/index.js b/packages/docusaurus-theme-classic/src/theme/BlogPostPage/index.js
index 38e5b03300..553d86ab91 100644
--- a/packages/docusaurus-theme-classic/src/theme/BlogPostPage/index.js
+++ b/packages/docusaurus-theme-classic/src/theme/BlogPostPage/index.js
@@ -23,12 +23,14 @@ function BlogPostPage(props) {
               <BlogPostItem frontMatter={frontMatter} metadata={metadata}>
                 <BlogPostContents />
               </BlogPostItem>
-              <div className="margin-vert--xl">
-                <BlogPostPaginator
-                  nextItem={metadata.nextItem}
-                  prevItem={metadata.prevItem}
-                />
-              </div>
+              {(metadata.nextItem || metadata.prevItem) && (
+                <div className="margin-vert--xl">
+                  <BlogPostPaginator
+                    nextItem={metadata.nextItem}
+                    prevItem={metadata.prevItem}
+                  />
+                </div>
+              )}
             </div>
           </div>
         </div>