footer styling implemented using flexbox

resources/public/js/themes.js

@@ -112,21 +112,11 @@ function showPage() {
   less = {
     modifyVars: vars
   };
-  putFooter();
   var script = document.createElement("script");
   script.type = "text/javascript";
   script.src = "//cdnjs.cloudflare.com/ajax/libs/less.js/2.1.0/less.min.js";
   document.head.appendChild(script);
 }
 
-function putFooter(){
-  var elem = $("footer");
-  if(!elem) return;
-  if(window.innerHeight * 0.85 >= document.body.clientHeight) {
-      elem.style.position = "fixed";
-      elem.style.bottom = 0;
-  }
-}
-
 // for the case if main.js is not loaded
 var onLoad = showPage;

resources/public/styles/main.less

@@ -100,7 +100,6 @@ html, body {
     color: @foreground;
     margin: 0;
     padding: 0;
-    display: block !important;
 }
 #hero {
     padding-top: 5em;
@@ -141,6 +140,8 @@ article {
     .central-element;
     margin-top: 5em;
     text-align: justify;
+    flex: 1;
+    -webkit-flex: 1;
 }
 article p {
     font-size: 1.2em * @text_size_factor;
@@ -203,3 +204,11 @@ td {
 .middot {
     padding: 0.5em;
 }
+
+body {
+    display: flex !important;
+    display: -webkit-flex !important;
+    min-height: 100vh;
+    flex-direction: column;
+    -webkit-flex-direction: column;
+}

src/notehub/views.clj

@@ -33,7 +33,7 @@
          (include-js "//cdnjs.cloudflare.com/ajax/libs/marked/0.3.2/marked.min.js")
          (include-js "/js/md5.js")
          (include-js "/js/main.js")))]
-    [:body {:style "display: none;" :onload "onLoad()"} content]))
+    [:body {:style "display: none" :onload "onLoad()"} content]))
 
 (defn- sanitize
   "Breakes all usages of <script> & <iframe>"