mirror of
https://github.com/mofeng-git/One-KVM.git
synced 2025-12-13 01:30:31 +08:00
pretty menu selecting
This commit is contained in:
parent
55da818b8e
commit
8bac7382bb
@ -51,10 +51,15 @@ ul#ctl li a.ctl-item {
|
|||||||
ul#ctl li a.ctl-item:hover:not(.active) {
|
ul#ctl li a.ctl-item:hover:not(.active) {
|
||||||
background-color: var(--bg-color-hovered);
|
background-color: var(--bg-color-hovered);
|
||||||
}
|
}
|
||||||
|
ul#ctl li a.ctl-item-selected {
|
||||||
|
box-shadow: 0 5px 0 var(--border-color-intensive) inset;
|
||||||
|
background-color: var(--bg-color-selected) !important;
|
||||||
|
}
|
||||||
div.ctl-dropdown-content {
|
div.ctl-dropdown-content {
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
white-space: nowrap;
|
white-space: nowrap;
|
||||||
border: var(--dark-border);
|
border: var(--intensive-border);
|
||||||
|
border-top: none;
|
||||||
-webkit-border-radius: 0 0 8px 8px;
|
-webkit-border-radius: 0 0 8px 8px;
|
||||||
-moz-border-radius: 0 0 8px 8px;
|
-moz-border-radius: 0 0 8px 8px;
|
||||||
border-radius: 0 0 8px 8px;
|
border-radius: 0 0 8px 8px;
|
||||||
|
|||||||
@ -9,6 +9,8 @@
|
|||||||
--small-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.2);
|
--small-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.2);
|
||||||
--big-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.4);
|
--big-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.4);
|
||||||
|
|
||||||
|
--border-color-intensive: #5b90bb;
|
||||||
|
|
||||||
--bg-color-normal: #36393f;
|
--bg-color-normal: #36393f;
|
||||||
--bg-color-light: #484b51;
|
--bg-color-light: #484b51;
|
||||||
--bg-color-gray: #3b3e43;
|
--bg-color-gray: #3b3e43;
|
||||||
|
|||||||
@ -92,12 +92,12 @@ var ui = new function() {
|
|||||||
__ctl_items.forEach(function(el_item) {
|
__ctl_items.forEach(function(el_item) {
|
||||||
var el_menu = el_item.parentElement.querySelector(".ctl-dropdown-content");
|
var el_menu = el_item.parentElement.querySelector(".ctl-dropdown-content");
|
||||||
if (el_item === el_a && el_menu.style.display === "none") {
|
if (el_item === el_a && el_menu.style.display === "none") {
|
||||||
|
el_item.classList.add("ctl-item-selected");
|
||||||
el_menu.style.display = "block";
|
el_menu.style.display = "block";
|
||||||
el_item.setAttribute("style", "background-color: var(--bg-color-selected)");
|
|
||||||
all_hidden &= false;
|
all_hidden &= false;
|
||||||
} else {
|
} else {
|
||||||
|
el_item.classList.remove("ctl-item-selected");
|
||||||
el_menu.style.display = "none";
|
el_menu.style.display = "none";
|
||||||
el_item.setAttribute("style", "background-color: default");
|
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
if (all_hidden) {
|
if (all_hidden) {
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user