From 73e171b0fbce4a542e2141d7e2b1144450571ce1 Mon Sep 17 00:00:00 2001
From: Cotes Chung <11371340+cotes2020@users.noreply.github.com>
Date: Tue, 19 Sep 2023 04:44:35 +0800
Subject: [PATCH] perf(layout): optimize the main block height calculation
 (#1249)

If the post content height is smaller than the panel, there will be a large blank space between the bottom of the post and "Further Reading" section.
---
 _layouts/default.html    | 4 ++--
 _sass/addon/commons.scss | 9 ++++-----
 2 files changed, 6 insertions(+), 7 deletions(-)

diff --git a/_layouts/default.html b/_layouts/default.html
index 16f52c2..e2d3894 100644
--- a/_layouts/default.html
+++ b/_layouts/default.html
@@ -27,10 +27,10 @@ layout: compress
     {% include sidebar.html lang=lang %}
 
     <div id="main-wrapper" class="d-flex justify-content-center">
-      <div class="container px-xxl-5">
+      <div class="container d-flex flex-column px-xxl-5">
         {% include topbar.html lang=lang %}
 
-        <div class="row">
+        <div class="row flex-grow-1">
           <main
             aria-label="Main Content"
             class="col-12 col-lg-11 col-xl-9 px-md-4{% unless has_tail %} pb-5{% endunless %}"
diff --git a/_sass/addon/commons.scss b/_sass/addon/commons.scss
index cae3fcb..279d45a 100644
--- a/_sass/addon/commons.scss
+++ b/_sass/addon/commons.scss
@@ -372,7 +372,6 @@ i {
 
 main {
   line-height: 1.75;
-  min-height: calc(100vh - $topbar-height - $footer-height);
 
   h1 {
     margin-top: 2rem;
@@ -1127,6 +1126,10 @@ search {
   position: relative;
 
   @include pl-pr(0);
+
+  > .container {
+    min-height: 100vh;
+  }
 }
 
 #topbar-wrapper.row,
@@ -1280,10 +1283,6 @@ search {
     }
   }
 
-  main {
-    min-height: calc(100vh - $topbar-height - $footer-height-large);
-  }
-
   footer {
     @include slide;