luci-theme-bootstrap: dynamically adjust body margin

[oweals/luci.git] / themes / luci-theme-bootstrap / luasrc / view / themes / bootstrap / json-menu.htm

diff --git a/themes/luci-theme-bootstrap/luasrc/view/themes/bootstrap/json-menu.htm b/themes/luci-theme-bootstrap/luasrc/view/themes/bootstrap/json-menu.htm
index b38406f65aeb38a24475cc5b4ba383edcc9bd318..02b81b88112291996ee9fb4513663fc88843a9f0 100644 (file)
--- a/themes/luci-theme-bootstrap/luasrc/view/themes/bootstrap/json-menu.htm
+++ b/themes/luci-theme-bootstrap/luasrc/view/themes/bootstrap/json-menu.htm
@@ -98,6 +98,13 @@
                                ul.style.display = '';
                }
 
+               function adjust_body_margin(ev) {
+                       var body = document.querySelector('body'),
+                           head = document.querySelector('header');
+
+                       body.style.marginTop = head.offsetHeight + 'px';
+               }
+
                document.addEventListener('luci-loaded', function(ev) {
                        var tree = <%= luci.http.write_json(luci.dispatcher.context.authsession and luci.dispatcher.menu_json() or {}) %>,
                            node = tree,
@@ -114,6 +121,14 @@
                                if (node)
                                        render_tabmenu(node, url);
                        }
+
+                       document.addEventListener('poll-start', adjust_body_margin);
+                       document.addEventListener('poll-stop', adjust_body_margin);
+                       document.addEventListener('uci-new-changes', adjust_body_margin);
+                       document.addEventListener('uci-clear-changes', adjust_body_margin);
+                       window.addEventListener('resize', adjust_body_margin);
+
+                       adjust_body_margin(ev);
                });
        })();
 </script>