fix dashboard select drop down (#1205)

This commit is contained in:
Guillermo Ruffino 2020-07-27 06:43:51 -03:00 committed by GitHub
parent 27d4b3b8ad
commit a1e10f384e
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
3 changed files with 20 additions and 4 deletions

View file

@ -163,6 +163,11 @@ main {
color: black; color: black;
} }
nav {
height: auto;
line-height: normal;
}
.select-port-container { .select-port-container {
margin-top: 8px; margin-top: 8px;
margin-right: 10px; margin-right: 10px;

View file

@ -5,6 +5,7 @@ $(document).ready(function () {
M.AutoInit(document.body); M.AutoInit(document.body);
nodeGrid(); nodeGrid();
startAceWebsocket(); startAceWebsocket();
fixNavbarHeight();
}); });
// WebSocket URL Helper // WebSocket URL Helper
@ -16,6 +17,17 @@ if (loc.protocol === "https:") {
} }
const wsUrl = wsLoc.href; const wsUrl = wsLoc.href;
/**
* Fix NavBar height
*/
const fixNavbarHeight = () => {
const fixFunc = () => {
const sel = $(".select-wrapper");
$(".navbar-fixed").css("height", (sel.position().top + sel.outerHeight()) + "px");
}
$(window).resize(fixFunc);
fixFunc();
}
/** /**
* Dashboard Dynamic Grid * Dashboard Dynamic Grid
@ -1003,4 +1015,3 @@ jQuery.validator.addMethod("nospaces", (value, element) => {
jQuery.validator.addMethod("lowercase", (value, element) => { jQuery.validator.addMethod("lowercase", (value, element) => {
return value === value.toLowerCase(); return value === value.toLowerCase();
}, "Name must be all lower case!"); }, "Name must be all lower case!");

View file

@ -31,8 +31,8 @@
<body> <body>
<div class="navbar-fixed"> <div class="navbar-fixed">
<nav> <nav class="grey lighten-2">
<div class="nav-wrapper grey lighten-2"> <div class="nav-wrapper">
<a href="#" class="black-text logo-wrapper"> <a href="#" class="black-text logo-wrapper">
<img src="https://esphome.io/_static/logo-text.svg" alt="ESPHome Logo" class="logo"> <img src="https://esphome.io/_static/logo-text.svg" alt="ESPHome Logo" class="logo">
</a> </a>
@ -53,7 +53,7 @@
<li><a data-action="edit" data-filename="secrets.yaml">Secrets Editor</a></li> <li><a data-action="edit" data-filename="secrets.yaml">Secrets Editor</a></li>
<li class="divider"></li> <li class="divider"></li>
{% if login_enabled %} {% if login_enabled %}
<li><a href="{{ relative_url }}logout">Logout</a></li> <li><a href="{{ relative_url }}logout">Logout</a></li>
{% end %} {% end %}
</ul> </ul>
</nav> </nav>