✨ feat(player): improve player metadata handling and thumbnail loading with queue system

styles/player.css

@@ -1,11 +1,9 @@
 .player-box {
   min-height: 60px;
   min-width: 300px;
-  padding: 1px;
-  box-shadow:
-    inset 0 0 100px rgba(148, 148, 148, 0.3),
-    inset 70px 0 20px rgba(255, 255, 255, 0.3),
-    inset 0px 0px 20px 5px rgba(255, 255, 255, 0.3);
+  padding: 10px;
+  background-color: alpha(#000, 0.3);
+  box-shadow: inset 0 0 0 1px alpha(#aaa, 0.4);
   border-radius: 10px;
   background-position: center;
   background-size: cover;
@@ -14,7 +12,7 @@
 #player-container {
   min-height: 60px;
   border-radius: 10px;
-  padding: 4px;
+  padding: 2px;
   margin-left: 2px;
   background-position: center;
   background-size: cover;
@@ -31,12 +29,11 @@
   border-radius: 10px;
 }
 
-#artist {
-  color: var(--primary);
-}
+/* #artist { */
+/*   color: var(--primary); */
+/* } */
 
 #song {
-  color: var(--surface);
   font-size: 15px;
   margin-top: 5px;
 }
@@ -52,27 +49,17 @@
 }
 
 #pause-button {
-  background-color: whitesmoke;
+  /* background-color: whitesmoke; */
   border-radius: 16px;
   padding: 10px;
 }
 
 #pause-label,
 #play-label {
-  color: var(--shadow);
+  /* color: var(--shadow); */
   font-size: 20px;
   padding: 2px;
-  border-radius: 999px;
-  min-width: 25px;
-}
-
-#pause-label.mini,
-#play-label.mini {
-  color: white;
-  font-size: 20px;
-  padding: 2px;
-  border-radius: 999px;
-  min-width: 25px;
+  border-radius: 9px;
 }
 
 #shuffle-button,
@@ -80,24 +67,25 @@
 #prev-button,
 #play-pause-button {
   border: none;
+  border-radius: 12px;
   padding: 0px;
   padding-left: 11px;
   padding-right: 11px;
+  min-width: 25px;
+  min-height: 25px;
 }
 
 #shuffle-button:hover,
 #next-button:hover,
 #prev-button:hover,
 #play-pause-button:hover {
-  border-radius: 100%;
-
   box-shadow: inset rgba(255, 255, 255, 0.5) 0 0 10px;
 }
 
 .player-button {
   border-radius: 5px;
-  background-color: var(--shadow);
-  /* background-color: white; */
+  /* background-color: var(--shadow); */
+  background-color: white;
   opacity: 1;
   min-width: 10px;
   min-height: 10px;