From 3d0fb271470be6c2357bb47520c41c67044e3067 Mon Sep 17 00:00:00 2001
From: Patrick Jentsch <p.jentsch@uni-bielefeld.de>
Date: Fri, 5 Jul 2019 11:02:24 +0200
Subject: [PATCH] Add documentation and fixes for sidenav-fixed usage.
---
app/static/css/opaque.css | 26 ++++++++++++++++++++++++++
1 file changed, 26 insertions(+)
diff --git a/app/static/css/opaque.css b/app/static/css/opaque.css
index c94ab517..1e976351 100644
--- a/app/static/css/opaque.css
+++ b/app/static/css/opaque.css
@@ -1,3 +1,8 @@
+/*
+ * ### Start sticky footer ###
+ * Force the footer to always stay on the bottom of the page regardless of how
+ * little content is on the page.
+*/
body {
display: flex;
min-height: 100vh;
@@ -7,3 +12,24 @@ body {
main {
flex: 1 0 auto;
}
+/* ### End sticky footer ### */
+
+
+/*
+ * ### Start sidenav-fixed offset ###
+ * The sidenav-fixed class is used which causes the sidenav to be fixed and open
+ * on large screens and hides to the regular functionality on smaller screens.
+ * In order to prevent the sidenav to overlap the content, the content (in our
+ * case header, main and footer) gets an offset equal to the width of the
+ * sidenav.
+*/
+header, main, footer {
+ padding-left: 300px;
+}
+
+@media only screen and (max-width : 992px) {
+ header, main, footer {
+ padding-left: 0;
+ }
+}
+/* ### End sidenav-fixed offset ### */
--
GitLab