Mirrors/spicetify-themes
1
0
Fork 0
mirror of https://github.com/morpheusthewhite/spicetify-themes.git synced 2024-11-25 20:32:47 +01:00
Code Issues Projects Releases Activity

fix hovering and multiple dots bug

Browse Source
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
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
Fluent/fluent.js
View File

@ -113,6 +113,8 @@
waitForElement([".npv-main-container .progress-bar__slider"], () => { waitForElement([".npv-main-container .progress-bar__slider"], () => {
const sliders = document.getElementsByClassName("npv-main-container")[0].getElementsByClassName("progress-bar__slider"); const sliders = document.getElementsByClassName("npv-main-container")[0].getElementsByClassName("progress-bar__slider");
for (const slider of sliders) { for (const slider of sliders) {
if(slider.dataset.dot === "true") { continue; }
slider.dataset.dot = "true";
const dot = document.createElement("div"); const dot = document.createElement("div");
dot.classList.add("slider-dot"); dot.classList.add("slider-dot");
slider.appendChild(dot); slider.appendChild(dot);

8
Fluent/user.css
View File

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