Adjust body top padding to match header height when top menu is pinned.

3 files changed, 18 insertions, 4 deletions

diff --git a/src/usr/local/www/head.inc b/src/usr/local/www/head.inc
index f666e13..09bb2c0 100755
--- a/src/usr/local/www/head.inc
+++ b/src/usr/local/www/head.inc
@@ -382,7 +382,7 @@ if (isset($config['system']['webgui']['webguifixedmenu'])) {
 	$menuclass = "navbar navbar-fixed-top navbar-inverse";
 }
 ?>
-<nav class="<?=$menuclass?>">
+<nav id="topmenu" class="<?=$menuclass?>">
 	<div class="container">
 		<div class="navbar-header">
 			<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#pf-navbar">
diff --git a/src/usr/local/www/jquery/pfSenseHelpers.js b/src/usr/local/www/jquery/pfSenseHelpers.js
index 15bbd8d..dae1c23 100644
--- a/src/usr/local/www/jquery/pfSenseHelpers.js
+++ b/src/usr/local/www/jquery/pfSenseHelpers.js
@@ -387,4 +387,18 @@ $('tbody').each(function(){
 	$(this).html($.trim($(this).html()))
 });
 
-$('tbody:empty').html("<tr><td></td></tr>");
\ No newline at end of file
+// Put a dummy row into any empty table to keep IE happy
+$('tbody:empty').html("<tr><td></td></tr>");
+
+// Add body padding equivalent to the height of hte top menu
+function padMenu() {
+	if(! $('#topmenu').hasClass('navbar-static-top')) {
+		$('body').animate({ paddingTop: $('#topmenu').height()}, 0);
+	}
+}
+
+$( window ).resize(function() {
+  padMenu();
+});
+
+padMenu();
\ No newline at end of file
diff --git a/src/usr/local/www/system.php b/src/usr/local/www/system.php
index 1b4eb51..3f10473 100644
--- a/src/usr/local/www/system.php
+++ b/src/usr/local/www/system.php
@@ -482,8 +482,8 @@ $section->addInput(new Form_Select(
 $section->addInput(new Form_Select(
 	'webguifixedmenu',
 	'Menu',
-	($pconfig['webguifixedmenu'] == "fixed"),
-	["" => "Scrolls with page", "fixed" => "Fixed (pinned to top of page)"]
+	$pconfig['webguifixedmenu'],
+	["" => "Scrolls with page", "fixed" => "Fixed (Remains visible at top of page)"]
 ));
 
 $form->add($section);