Update min-height for <main>

This ensures that we always take the full window height to avoid crowding elements together
LibraryOfCongress · Nov 14, 2018 · 51b5093 · 51b5093
1 parent 1947d17
commit 51b5093
Showing 1 changed file with 6 additions and 3 deletions.
diff --git a/concordia/static/css/base.css b/concordia/static/css/base.css
@@ -30,9 +30,8 @@
     --control-label-color: #333333;
 
     --height-top-nav: 113px; /* Height of logo image plus padding */
-    --height-main: calc(
-        100vh - var(--height-top-nav)
-    ); /* Subtract height of navbar */
+    --height-footer: 149px;
+    --height-main: calc(100vh - (var(--height-top-nav) + var(--height-footer)));
 
     /* Making room for instructions button on bottom and breadcrumb and nav on top */
     --height-contribute-image: calc(
@@ -51,6 +50,10 @@ body {
     background-color: var(--bg-offwhite);
 }
 
+main {
+    min-height: var(--height-main);
+}
+
 h1 {
     font-family: 'Roboto Slab', serif;
     font-weight: bold;