perf(layout): improve margins for tail block (#1243)

Keeps the margin of the elements in the tail area consistent regardless of the number of siblings, or if a <script> is inserted.

_includes/comments/disqus.html

@@ -1,6 +1,6 @@
 <!-- The Disqus lazy loading. -->
 
-<div id="disqus_thread" class="mb-5">
+<div id="disqus_thread">
   <p class="text-center text-muted small">Comments powered by <a href="https://disqus.com/">Disqus</a>.</p>
 </div>
 

_sass/addon/commons.scss

@@ -1121,7 +1121,7 @@ search {
   }
 }
 
-/* --- main wrapper --- */
+/* --- basic wrappers --- */
 
 #main-wrapper {
   position: relative;
@@ -1135,6 +1135,16 @@ search {
   @include ml-mr(0);
 }
 
+#tail-wrapper {
+  > :not(script) {
+    margin-top: 3rem;
+  }
+
+  > :only-child {
+    margin-top: 0;
+  }
+}
+
 /* --- button back-to-top --- */
 
 #back-to-top {

_sass/addon/variables.scss

@@ -14,7 +14,6 @@ $search-max-width: 200px !default;
 $footer-height: 5rem !default;
 $footer-height-large: 6rem !default; /* screen width: < 850px */
 $main-content-max-width: 1250px !default;
-$bottom-min-height: 35rem !default;
 $base-radius: 0.5rem !default;
 $back2top-size: 2.75rem !default;
 

_sass/layout/post.scss

@@ -346,21 +346,13 @@ h1 + .post-meta {
   }
 }
 
-#tail-wrapper {
-  min-height: 2rem;
-
-  > *:not(:last-child) {
-    margin-top: 3rem;
-  }
-
-  > *:nth-last-child(2) {
-    margin-bottom: 3rem;
-  }
-
-  /* stylelint-disable-next-line selector-id-pattern */
-  #disqus_thread {
+/* stylelint-disable-next-line selector-id-pattern */
+#disqus_thread {
   min-height: 8.5rem;
-  }
+}
+
+.utterances {
+  max-width: 100%;
 }
 
 %btn-share-hovor {