pikvm/pikvm#803: Ability to use LEDs in GPIO title

This commit is contained in:
Maxim Devaev
2022-10-08 06:09:33 +03:00
parent 16d9c3815f
commit a39d3dffbe
15 changed files with 84 additions and 33 deletions

View File

@@ -44,6 +44,7 @@ ul#navbar li.left {
}
ul#navbar li a#logo {
height: 50px; /* Чтобы вертикальные разделители не вылезали за пределы навбара */
line-height: 50px;
outline: none;
cursor: pointer;
@@ -55,6 +56,7 @@ ul#navbar li a#logo {
}
ul#navbar li a.menu-button {
height: 50px; /* То же самое */
line-height: 50px;
outline: none;
cursor: pointer;
@@ -83,7 +85,7 @@ ul#navbar li a.menu-button:hover:not(.active) {
@media only screen and (pointer: coarse) {
ul#navbar li a#logo:hover:not(.active),
ul#navbar li a.menu-button:hover:not(.active) {
background-color: var(--cs-navbar-default-bg) !important;
background-color: var(--cs-navbar-default-bg);
}
}
@@ -92,11 +94,15 @@ ul#navbar li a#logo img {
height: 24px;
}
ul#navbar li a.menu-button span,
ul#navbar li a.menu-button img {
vertical-align: middle;
margin-right: 10px;
height: 20px;
}
ul#navbar li a.menu-button span:not(:last-child),
ul#navbar li a.menu-button img:not(:last-child) {
margin-right: 10px;
}
ul#navbar li a.menu-button-pressed {
box-shadow: var(--shadow-navbar-item-pressed);

View File

@@ -72,7 +72,16 @@ export function Gpio(__recorder) {
self.setModel = function(model) {
tools.feature.setEnabled($("gpio-dropdown"), model.view.table.length);
if (model.view.table.length) {
$("gpio-menu-button").innerHTML = `${model.view.header.title}`;
let title = [];
let last_is_label = false;
for (let item of model.view.header.title) {
if (last_is_label && item.type === "label") {
title.push("<span></span>");
}
last_is_label = (item.type === "label");
title.push(__createItem(item));
}
$("gpio-menu-button").innerHTML = title.join(" ");
}
let content = "<table class=\"kv\">";

View File

@@ -344,8 +344,9 @@ function __WindowManager() {
var __globalMouseButtonHandler = function(event) {
if (
event.target.matches && !event.target.matches(".menu-button")
&& event.target.closest && !event.target.closest(".modal")
event.target.closest
&& !event.target.closest(".menu-button")
&& !event.target.closest(".modal")
) {
for (let el_item = event.target; el_item && el_item !== document; el_item = el_item.parentNode) {
if (el_item.hasAttribute("data-force-hide-menu")) {