summaryrefslogtreecommitdiff
path: root/web/share
diff options
context:
space:
mode:
authorMaxim Devaev <[email protected]>2022-10-08 06:09:33 +0300
committerMaxim Devaev <[email protected]>2022-10-08 06:09:33 +0300
commita39d3dffbe837c15576615656df5a924bcd44831 (patch)
tree407258ff32ac271ec2ccf6069a00e56ce1f04722 /web/share
parent16d9c3815f5bb5ba98f0923efc9f0fad8e2f48a2 (diff)
pikvm/pikvm#803: Ability to use LEDs in GPIO title
Diffstat (limited to 'web/share')
-rw-r--r--web/share/css/navbar.css10
-rw-r--r--web/share/js/kvm/gpio.js11
-rw-r--r--web/share/js/wm.js5
3 files changed, 21 insertions, 5 deletions
diff --git a/web/share/css/navbar.css b/web/share/css/navbar.css
index 8a339b8a..e8a73820 100644
--- a/web/share/css/navbar.css
+++ b/web/share/css/navbar.css
@@ -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);
diff --git a/web/share/js/kvm/gpio.js b/web/share/js/kvm/gpio.js
index 15eabd79..08ec42a8 100644
--- a/web/share/js/kvm/gpio.js
+++ b/web/share/js/kvm/gpio.js
@@ -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\">";
diff --git a/web/share/js/wm.js b/web/share/js/wm.js
index 51f6c01a..20ea0805 100644
--- a/web/share/js/wm.js
+++ b/web/share/js/wm.js
@@ -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")) {