Fixed overflowing sidebar and footer scrolling bug

docs/license.md

@@ -1,23 +1,3 @@
 # License
 
 **MIT License**
-
-Copyright © 2016 Martin Donath
-
-Permission is hereby granted, free of charge, to any person obtaining a copy
-of this software and associated documentation files (the "Software"), to
-deal in the Software without restriction, including without limitation the
-rights to use, copy, modify, merge, publish, distribute, sublicense, and/or
-sell copies of the Software, and to permit persons to whom the Software is
-furnished to do so, subject to the following conditions:
-
-The above copyright notice and this permission notice shall be included in
-all copies or substantial portions of the Software.
-
-THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
-IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
-FITNESS FOR A PARTICULAR PURPOSE AND NON-INFRINGEMENT. IN NO EVENT SHALL THE
-AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
-LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING
-FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS
-IN THE SOFTWARE.

material/base.html

@@ -19,7 +19,7 @@
       {% else %}
         <link rel="shortcut icon" href="{{ base_url }}/assets/images/favicon.ico">
       {% endif %}
-      <meta name="generator" content="mkdocs-{{ mkdocs_version }}, mkdocs-material-1.0.3">
+      <meta name="generator" content="mkdocs-{{ mkdocs_version }}, mkdocs-material-1.0.4">
     {% endblock %}
     {% block htmltitle %}
       {% if page.title %}
@@ -34,7 +34,7 @@
       <script src="{{ base_url }}/assets/javascripts/modernizr-5b0c41c2b5.js"></script>
     {% endblock %}
     {% block styles %}
-      <link rel="stylesheet" href="{{ base_url }}/assets/stylesheets/application-166740f5bb.css">
+      <link rel="stylesheet" href="{{ base_url }}/assets/stylesheets/application-9c62e3c932.css">
       {% if config.extra.palette %}
         <link rel="stylesheet" href="{{ base_url }}/assets/stylesheets/application-02ce7adcc2.palette.css">
       {% endif %}
@@ -124,7 +124,7 @@
       {% endblock %}
     </div>
     {% block scripts %}
-      <script src="{{ base_url }}/assets/javascripts/application-39a173f6f5.js"></script>
+      <script src="{{ base_url }}/assets/javascripts/application-f7ac33b6fb.js"></script>
       <script>app.initialize({url:{base:"{{ base_url }}"}})</script>
       {% for path in extra_javascript %}
         <script src="{{ path }}"></script>

src/assets/javascripts/application.js

@@ -78,13 +78,6 @@ export const initialize = config => {
     }
   }).listen()
 
-  /* Component: sidebar container */
-  if (!Modernizr.csscalc)
-    new Material.Event.MatchMedia("(min-width: 960px)",
-      new Material.Event.Listener(window, [
-        "resize", "orientationchange"
-      ], new Material.Sidebar.Container("[data-md-component=container]")))
-
   /* Component: sidebar with navigation */
   new Material.Event.MatchMedia("(min-width: 1220px)",
     new Material.Event.Listener(window, [

src/assets/javascripts/components/Material/Sidebar.js

@@ -20,7 +20,6 @@
  * IN THE SOFTWARE.
  */
 
-import Container from "./Sidebar/Container"
 import Position from "./Sidebar/Position"
 
 /* ----------------------------------------------------------------------------
@@ -28,6 +27,5 @@ import Position from "./Sidebar/Position"
  * ------------------------------------------------------------------------- */
 
 export default {
-  Container,
   Position
 }

src/assets/javascripts/components/Material/Sidebar/Container.js

@@ -1,65 +0,0 @@
-/*
- * Copyright (c) 2016-2017 Martin Donath <martin.donath@squidfunk.com>
- *
- * Permission is hereby granted, free of charge, to any person obtaining a copy
- * of this software and associated documentation files (the "Software"), to
- * deal in the Software without restriction, including without limitation the
- * rights to use, copy, modify, merge, publish, distribute, sublicense, and/or
- * sell copies of the Software, and to permit persons to whom the Software is
- * furnished to do so, subject to the following conditions:
- *
- * The above copyright notice and this permission notice shall be included in
- * all copies or substantial portions of the Software.
- *
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
- * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
- * FITNESS FOR A PARTICULAR PURPOSE AND NON-INFRINGEMENT. IN NO EVENT SHALL THE
- * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
- * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING
- * FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS
- * IN THE SOFTWARE.
- */
-
-/* ----------------------------------------------------------------------------
- * Class
- * ------------------------------------------------------------------------- */
-
-export default class Container {
-
-  /**
-   * Monitor window height to stretch sidebar container to viewport
-   *
-   * @constructor
-   * @param {(string|HTMLElement)} el - Selector or HTML element
-   */
-  constructor(el) {
-    this.el_ = (typeof el === "string")
-      ? document.querySelector(el)
-      : el
-
-    /* Retrieve parent node */
-    this.parent_ = this.el_.parentNode
-  }
-
-  /**
-   * Initialize container state
-   */
-  setup() {
-    this.update()
-  }
-
-  /**
-   * Update minimum height
-   */
-  update() {
-    const height = this.parent_.offsetHeight - this.el_.offsetTop
-    this.el_.style.minHeight = `${height}px`
-  }
-
-  /**
-   * Reset minimum height
-   */
-  reset() {
-    this.el_.style.minHeight = ""
-  }
-}

src/assets/stylesheets/layout/_base.scss

@@ -93,6 +93,7 @@ hr {
   display: table;
   width: 100%;
   height: 100%;
+  padding-top: 5.6rem;
   table-layout: fixed;
 }
 
@@ -101,28 +102,11 @@ hr {
   display: table-row;
   height: 100%;
 
-  // Top-spacing to account for header and some additional padding
+  // Increase top spacing of content area to give typography more room
   &__inner {
-    margin-top: 5.6rem;
+    min-height: 100%;
     padding-top: 2.4rem + 0.6rem;
     overflow: auto;
-
-    // If the browser supports calc(), no JavaScript is necessary
-    .csscalc & {
-      min-height: calc(100% - #{5.6rem - 3rem});
-
-      // Hack: Firefox doesn't correctly calculate min-height, as it takes the
-      // top margin into account which leads to the container overflowing its
-      // parent. For this reason we use this hack here to target only Firefox
-      // and see if we can find a better solution later.
-
-      // stylelint-disable-next-line function-url-quotes
-      @-moz-document url-prefix() {
-        & {
-          min-height: calc(100% - 5.6rem);
-        }
-      }
-    }
   }
 }