Fix sticky footer issue using Jquery

Calculates height of footer on page load and on resize and
set bootom padding of body according to it to keep footer at bottom.

Fixes: #36

plonetheme/barceloneta/theme/index.html

@@ -54,5 +54,23 @@
     <footer id="portal-footer-wrapper" role="contentinfo">
       <div class="container" id="portal-footer"></div>
     </footer>
+
+    <!-- STICKY FOOTER -->
+    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>
+    <script>
+      function stickyFooter() {
+        var footerHeight = $('#portal-footer-wrapper').outerHeight()
+        $('body').css('padding-bottom', footerHeight);
+        $('footer').css('height', footerHeight);
+      }
+
+      $(document).ready(function(){
+        stickyFooter();
+      });
+
+      $( window ).resize(function() {
+        stickyFooter();
+      });
+    </script>
   </body>
 </html>

plonetheme/barceloneta/theme/less/footer.plone.less

@@ -1,5 +1,14 @@
 //*// FOOTER //*//
 
+footer{
+  position: absolute;
+  left: 0;
+  bottom: 0;
+  height: auto;
+  width: 100%;
+}
+
+
 #portal-footer-wrapper {
   padding: 30px 15px;
   background-color: @plone-footer-bg;

plonetheme/barceloneta/theme/less/scaffolding.plone.less

@@ -12,6 +12,8 @@
 
 //*// Body reset
 html {
+  position: relative;
+  min-height: 100%;
   font-size: 62.5%;
   -webkit-tap-highlight-color: rgba(0,0,0,0);
 }