diff --git a/Fluent/fluent.js b/Fluent/fluent.js index 056ce32..46b0457 100644 --- a/Fluent/fluent.js +++ b/Fluent/fluent.js @@ -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); })(); diff --git a/Fluent/user.css b/Fluent/user.css index 99d49f6..24ff1b1 100644 --- a/Fluent/user.css +++ b/Fluent/user.css @@ -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,