fix hovering and multiple dots bug

This commit is contained in:
Jan Ochwat 2022-01-09 23:41:25 +01:00
parent 5f89a8f26b
commit 07c6d09870
No known key found for this signature in database
GPG Key ID: D33C79EB4FE970CE
2 changed files with 17 additions and 11 deletions

View File

@ -104,20 +104,22 @@
dot.classList.add("slider-dot");
slider.appendChild(dot);
}
}, 10);
}, 10);
waitForElement([".ExtraControls"], () => {
waitForElement([".ExtraControls"], () => {
const element = document.querySelector(".ExtraControls");
element.addEventListener("click", () => {
waitForElement([".npv-main-container .progress-bar__slider"], () => {
const sliders = document.getElementsByClassName("npv-main-container")[0].getElementsByClassName("progress-bar__slider");
for (const slider of sliders) {
const dot = document.createElement("div");
dot.classList.add("slider-dot");
slider.appendChild(dot);
}
const sliders = document.getElementsByClassName("npv-main-container")[0].getElementsByClassName("progress-bar__slider");
for (const slider of sliders) {
if(slider.dataset.dot === "true") { continue; }
slider.dataset.dot = "true";
const dot = document.createElement("div");
dot.classList.add("slider-dot");
slider.appendChild(dot);
}
}, 10)
})
}, 10);
}, 10);
})();

View File

@ -1368,7 +1368,7 @@ option {
.progress-bar__slider,
.giO6cIQ8auPNZuTvC4Y8 {
background-color: var(--spice-selected-row) !important;
border: 5px solid var(--spice-selected-row);
border: 6px solid var(--spice-selected-row);
box-shadow: 0 0 3px 0 var(--spice-player-bar-shadow) !important;
box-sizing: content-box !important;
width: 10px;
@ -1390,12 +1390,16 @@ option {
transition: border-width 75ms ease;
}
.progress-bar__slider:hover .slider-dot:not(:hover) {
border-width: 7px;
}
.slider-dot:hover {
border-width: 7px;
}
.slider-dot:active {
border-width: 4px;
border-width: 4px !important;
}
.main-nowPlayingWidget-nowPlaying>.ellipsis-one-line,