Add new settings for sticky header/footer

app.js

@@ -320,6 +320,9 @@ app.set('logoheight', settings.logoheight);
 app.set('burned_coins', settings.burned_coins);
 app.set('api_cmds', settings.api_cmds);
 
+app.set('sticky_header', settings.sticky_header);
+app.set('sticky_footer', settings.sticky_footer);
+
 app.set('footer_height_desktop', settings.footer_height_desktop);
 app.set('footer_height_tablet', settings.footer_height_tablet);
 app.set('footer_height_mobile', settings.footer_height_mobile);

lib/settings.js

@@ -24,6 +24,11 @@ exports.homelink = "coin";
 // home link logo height (value in px, only valid if using homelink = 'logo')
 exports.logoheight = 50;
 
+// set whether page header "sticks" to top of page or not
+exports.sticky_header = true;
+// set whether page footer "sticks" to bottom of page or not
+exports.sticky_footer = false;
+
 // Footer height
 exports.footer_height_desktop = "50px";
 exports.footer_height_tablet = "60px";

public/stylesheets/style.css

@@ -1,7 +1,5 @@
 body {
-  padding: 80px 40px;
   font: 14px "Lucida Grande", Helvetica, Arial, sans-serif;
- /* background-image: url('/images/background2.png');*/
 }
 
 .navbar {
@@ -209,10 +207,14 @@ tr {
 	color: #ffffff;
 }
 
+#body-container {
+  padding: 0 40px;
+}
+
 @media(max-width:767px){
-	body {
-		padding: 0px;
-		padding-top:60px;
+  #body-container {
+    padding-left:0;
+    padding-right:0;
   }
 }
 
@@ -244,12 +246,6 @@ tr {
 	padding: 0 15px;
 }
 
-@media(max-width:767px){
-	.logo-main {
-		padding: 0 15px 0 30px;
-	}
-}
-
 .decimal {
 	font-size: 0.7em;
 }

settings.json.template

@@ -27,6 +27,11 @@
   // home link logo height (value in px, only valid if using homelink = 'logo')
   "logoheight":  50,
   
+  // set whether page header "sticks" to top of page or not
+  "sticky_header": true,
+  // set whether page footer "sticks" to bottom of page or not
+  "sticky_footer": false,
+  
   // Customize the height of the footer for the following screen sizes:
   // Mobile (0-575px)
   // Tablet (576-991px)

views/layout.pug

@@ -205,8 +205,12 @@ html
         margin: 0 3px;
       }
   body
-    - var navbarClasses = ['nav','navbar','navbar-expand-lg','fixed-top'];
-    - var footerClasses = ['nav','navbar','navbar-default','fixed-bottom','d-none','d-md-flex','d-flex','footer'];
+    - var navbarClasses = ['nav','navbar','navbar-expand-lg'];
+    - var footerClasses = ['nav','navbar','navbar-default','d-none','d-md-flex','d-flex','footer'];
+    if settings.sticky_header == true
+      - navbarClasses.push('fixed-top');
+    if settings.sticky_footer == true
+      - footerClasses.push('fixed-bottom');
     if settings.display.navbar_dark == true
       - navbarClasses.push('bg-dark');
       - navbarClasses.push('navbar-dark');
@@ -269,6 +273,7 @@ html
               a.nav-link(href='/info')
                 span.fa.fa-info-circle
                 span.menu-text #{settings.locale.menu_api}
+    div#body-container(style='margin-top:' + (settings.sticky_header == true ? '80px;' : '20px'))
       if showSync != null && showSync == true
         .col-lg-12
           .alert.alert-warning