chore: fix footer to bottom

Author: michigg

src/static/home/main.css

@@ -2,9 +2,18 @@ html {
     min-height: 100vh;
 }
 
+body {
+    margin-bottom: calc(var(--footer-height-y) + 10px);
+}
+
 footer {
     width: 100%;
     font-size: 12px;
+    position: fixed;
+    bottom: 0;
+    vertical-align: middle;
+    height: var(--footer-height-y);
+    line-height: 40px;
 }
 
 footer a:link,
@@ -26,7 +35,7 @@ footer a:active {
         justify-content: flex-end;
     }
 
-    .submit-btn-quote{
+    .submit-btn-quote {
         padding-left: 5px !important;
     }
 }
@@ -38,7 +47,6 @@ footer a:active {
 }
 
 
-
 .quote {
     box-shadow: 1px 1px 4px rgba(0, 0, 0, .6);
     padding: 5px 5px;
@@ -59,13 +67,15 @@ footer a:active {
     margin-left: 3px;
 }
 
-.custom-select{
+.custom-select {
     height: calc(2.50rem + 2px);
 }
+
 /*FLOATING LABELS*/
 :root {
     --input-padding-x: .75rem;
     --input-padding-y: .6rem;
+    --footer-height-y: 40px
 }
 
 

src/templates/base.jinja2

@@ -51,9 +51,11 @@
     {% block content %}{% endblock %}
 </div>
 
-<footer class="bg-dark text-white py-1 text-center">© Copyright 2020, Michael Götz
-    (<a href="#">Impressum</a>,
-    <a href="#">Datenschutz</a>)
+<footer class="bg-dark text-white text-center">
+    <div class="container"> © Copyright 2020, Michael Götz
+        (<a href="#">Impressum</a>,
+        <a href="#">Datenschutz</a>)
+    </div>
 </footer>
 
 <script src="{{ static('js/form.js') }}"></script>