fix whitespace with fixed navbar & footer

build/js/Layout.js

@@ -104,6 +104,9 @@ const Layout = (($) => {
         } else {
           $(Selector.CONTENT).css('min-height', (max + offset) - heights.header)
         }
+        if (this._isFooterFixed()) {
+          $(Selector.CONTENT).css('min-height', parseFloat($(Selector.CONTENT).css('min-height')) + heights.footer);
+        }
       }
 
       if ($('body').hasClass(ClassName.LAYOUT_FIXED)) {
@@ -142,9 +145,9 @@ const Layout = (($) => {
       // Activate layout height watcher
       this.fixLayoutHeight()
 
-      if (this._config.loginRegisterAutoHeight === true) {      
+      if (this._config.loginRegisterAutoHeight === true) {
         this.fixLoginRegisterHeight()
-      } else if (Number.isInteger(this._config.loginRegisterAutoHeight)) {      
+      } else if (Number.isInteger(this._config.loginRegisterAutoHeight)) {
         setInterval(this.fixLoginRegisterHeight, this._config.loginRegisterAutoHeight);
       }
 
@@ -186,6 +189,10 @@ const Layout = (($) => {
       return max
     }
 
+    _isFooterFixed() {
+      return $('.main-footer').css('position') === 'fixed';
+    }
+
     // Static
 
     static _jQueryInterface(config = '') {

build/scss/_layout.scss

@@ -91,11 +91,11 @@ body,
 
   body:not(.layout-fixed).layout-navbar-fixed & {
     .main-sidebar {
-      margin-top: calc(#{$main-header-height} / -1);
+      // margin-top: calc(#{$main-header-height} / -1);
 
-      .sidebar {
-        margin-top: $main-header-height;
-      }
+      // .sidebar {
+      //   margin-top: $main-header-height;
+      // }
     }
   }
 
@@ -301,13 +301,13 @@ body,
       }
 
       body:not(.layout-fixed).layout#{$infix}-navbar-fixed & {
-        .main-sidebar {
-          margin-top: calc(#{$main-header-height} / -1);
+        // .main-sidebar {
+        //   margin-top: calc(#{$main-header-height} / -1);
 
-          .sidebar {
-            margin-top: $main-header-height;
-          }
-        }
+        //   .sidebar {
+        //     margin-top: $main-header-height;
+        //   }
+        // }
       }
 
       body:not(.layout-fixed).layout#{$infix}-navbar-fixed.text-sm & {

dist/css/adminlte.css

@@ -10356,14 +10356,6 @@ body,
   height: calc(2.93725rem + 1px);
 }
 
-body:not(.layout-fixed).layout-navbar-fixed .wrapper .main-sidebar {
-  margin-top: calc(calc(3.5rem + 1px) / -1);
-}
-
-body:not(.layout-fixed).layout-navbar-fixed .wrapper .main-sidebar .sidebar {
-  margin-top: calc(3.5rem + 1px);
-}
-
 body:not(.layout-fixed).layout-navbar-fixed.text-sm .wrapper .main-sidebar {
   margin-top: calc(calc(2.93725rem + 1px) / -1);
 }
@@ -10642,14 +10634,6 @@ body:not(.layout-fixed).layout-navbar-fixed.text-sm .wrapper .main-sidebar .side
   margin-top: calc(2.93725rem + 1px);
 }
 
-body:not(.layout-fixed).layout-navbar-fixed .wrapper .main-sidebar {
-  margin-top: calc(calc(3.5rem + 1px) / -1);
-}
-
-body:not(.layout-fixed).layout-navbar-fixed .wrapper .main-sidebar .sidebar {
-  margin-top: calc(3.5rem + 1px);
-}
-
 body:not(.layout-fixed).layout-navbar-fixed.text-sm .wrapper .main-sidebar {
   margin-top: calc(calc(2.93725rem + 1px) / -1);
 }
@@ -10789,12 +10773,6 @@ body:not(.layout-fixed).layout-navbar-fixed.text-sm .wrapper .main-sidebar .side
   .layout-sm-navbar-fixed.text-sm .wrapper .content-wrapper {
     margin-top: calc(2.93725rem + 1px);
   }
-  body:not(.layout-fixed).layout-sm-navbar-fixed .wrapper .main-sidebar {
-    margin-top: calc(calc(3.5rem + 1px) / -1);
-  }
-  body:not(.layout-fixed).layout-sm-navbar-fixed .wrapper .main-sidebar .sidebar {
-    margin-top: calc(3.5rem + 1px);
-  }
   body:not(.layout-fixed).layout-sm-navbar-fixed.text-sm .wrapper .main-sidebar {
     margin-top: calc(calc(2.93725rem + 1px) / -1);
   }
@@ -10930,12 +10908,6 @@ body:not(.layout-fixed).layout-navbar-fixed.text-sm .wrapper .main-sidebar .side
   .layout-md-navbar-fixed.text-sm .wrapper .content-wrapper {
     margin-top: calc(2.93725rem + 1px);
   }
-  body:not(.layout-fixed).layout-md-navbar-fixed .wrapper .main-sidebar {
-    margin-top: calc(calc(3.5rem + 1px) / -1);
-  }
-  body:not(.layout-fixed).layout-md-navbar-fixed .wrapper .main-sidebar .sidebar {
-    margin-top: calc(3.5rem + 1px);
-  }
   body:not(.layout-fixed).layout-md-navbar-fixed.text-sm .wrapper .main-sidebar {
     margin-top: calc(calc(2.93725rem + 1px) / -1);
   }
@@ -11071,12 +11043,6 @@ body:not(.layout-fixed).layout-navbar-fixed.text-sm .wrapper .main-sidebar .side
   .layout-lg-navbar-fixed.text-sm .wrapper .content-wrapper {
     margin-top: calc(2.93725rem + 1px);
   }
-  body:not(.layout-fixed).layout-lg-navbar-fixed .wrapper .main-sidebar {
-    margin-top: calc(calc(3.5rem + 1px) / -1);
-  }
-  body:not(.layout-fixed).layout-lg-navbar-fixed .wrapper .main-sidebar .sidebar {
-    margin-top: calc(3.5rem + 1px);
-  }
   body:not(.layout-fixed).layout-lg-navbar-fixed.text-sm .wrapper .main-sidebar {
     margin-top: calc(calc(2.93725rem + 1px) / -1);
   }
@@ -11212,12 +11178,6 @@ body:not(.layout-fixed).layout-navbar-fixed.text-sm .wrapper .main-sidebar .side
   .layout-xl-navbar-fixed.text-sm .wrapper .content-wrapper {
     margin-top: calc(2.93725rem + 1px);
   }
-  body:not(.layout-fixed).layout-xl-navbar-fixed .wrapper .main-sidebar {
-    margin-top: calc(calc(3.5rem + 1px) / -1);
-  }
-  body:not(.layout-fixed).layout-xl-navbar-fixed .wrapper .main-sidebar .sidebar {
-    margin-top: calc(3.5rem + 1px);
-  }
   body:not(.layout-fixed).layout-xl-navbar-fixed.text-sm .wrapper .main-sidebar {
     margin-top: calc(calc(2.93725rem + 1px) / -1);
   }

dist/js/adminlte.js

@@ -379,6 +379,10 @@
           } else {
             $(Selector.CONTENT).css('min-height', max + offset - heights.header);
           }
+
+          if (this._isFooterFixed()) {
+            $(Selector.CONTENT).css('min-height', parseFloat($(Selector.CONTENT).css('min-height')) + heights.footer);
+          }
         }
 
         if ($('body').hasClass(ClassName.LAYOUT_FIXED)) {
@@ -450,6 +454,10 @@
           }
         });
         return max;
+      };
+
+      _proto._isFooterFixed = function _isFooterFixed() {
+        return $('.main-footer').css('position') === 'fixed';
       } // Static
       ;