Fixed cursor not disappearing when idling over new playback controls

Selbi182 · May 11, 2024 · 590eb02 · 590eb02
1 parent 1c2ba8f
commit 590eb02
Show file tree

Hide file tree

Showing 3 changed files with 7 additions and 7 deletions.
diff --git a/src/main/resources/static/design/style.css b/src/main/resources/static/design/style.css
@@ -50,7 +50,7 @@ body.dark-blur > *:not(#modal-overlay) {
     transition: filter var(--transition);
 }
 
-#main.hide-cursor-enabled.hide-cursor {
+body.hide-cursor-enabled.hide-cursor {
     cursor: none !important;
 }
 
@@ -1470,13 +1470,13 @@ div#device {
     width: 100%;
     height: 100%;
     pointer-events: all;
-    cursor: pointer;
     transition: opacity var(--transition);
     background: #0004 var(--url) center no-repeat;
 }
 
-#playback-controller > div:hover {
+#mouse-move-buttons.show > #playback-controller > div:hover {
     opacity: 1;
+    cursor: pointer;
 }
 
 #playback-controller > #button-play-pause {

diff --git a/src/main/resources/static/js/spotify-big-picture.js b/src/main/resources/static/js/spotify-big-picture.js
@@ -2298,7 +2298,7 @@ let cursorTimeout;
 const MOUSE_MOVE_HIDE_TIMEOUT_MS = 1000;
 
 function setMouseVisibility(state) {
-  setClass("main".select(), "hide-cursor", !state);
+  setClass(document.body, "hide-cursor", !state);
 }
 
 function handleMouseEvent(e) {
@@ -2431,7 +2431,7 @@ function isSettingControlElem(e) {
 }
 
 function isHoveringControlElem(target) {
-  return target && "mouse-move-buttons".select().contains(target);
+  return target && "mouse-move-buttons".select().contains(target) && !"playback-controller".select().contains(target);
 }
 
 function toggleSettingsMenu() {
@@ -2841,7 +2841,7 @@ const PREFERENCES = [
     category: "General",
     default: true,
     protected: true,
-    css: {"main": "hide-cursor-enabled"}
+    css: {"body": "hide-cursor-enabled"}
   },
   {
     id: "hide-top-buttons",

diff --git a/src/main/resources/static/layout.html b/src/main/resources/static/layout.html
@@ -11,7 +11,7 @@
   <link rel="stylesheet" href="design/style.css"/>
   <link rel="icon" href="favicon.png" type="image/x-icon">
 </head>
-<body>
+<body id="body">
   <div id="dark-overlay"></div>
   <div id="toast">
     <div id="toast-text"></div>