fancier popover

src/renderer/less/bootstrap.less

@@ -7693,7 +7693,7 @@ fieldset:disabled .btn {
   word-wrap: break-word;
   background-color: var(--modalBackground);
   background-clip: padding-box;
-  box-shadow: var(--mediaItemShadow), var(--mediaItemShadow-ShadowSubtle);
+  box-shadow: var(--mediaItemShadow), var(--mediaItemShadow-Shadow);
   border-radius: var(--mediaItemRadius);
 }
 .popover .popover-arrow {

src/renderer/less/helpers.less

@@ -489,21 +489,35 @@
 
 .mediainfo-popover {
   user-select: none;
-  .popover-artwork {
-    width: 200px;
-    height: 200px;
-    margin: 0 0 20px 0;
-  }
+  background-color: rgb(0 0 0 / 100%);
+  overflow: hidden;
 
-  .song-name {
-    font-weight: 600;
-  }
-  .song-artist,.song-album {
-    opacity: 0.75;
-    cursor: pointer;
+  .content {
+    .shadow-artwork {
+      height: 100%;
+      width: 100%;
+      position: absolute;
+      top: 0;
+      left: 0;
+      z-index: -1;
+      filter:blur(32px) brightness(50%) saturate(280%);
+    }
+    .popover-artwork {
+      width: 200px;
+      height: 200px;
+      margin: 0 0 20px 0;
+    }
 
-    &:hover {
-      text-decoration: underline;
+    .song-name {
+      font-weight: 600;
+    }
+    .song-artist,.song-album {
+      opacity: 0.75;
+      cursor: pointer;
+
+      &:hover {
+        text-decoration: underline;
+      }
     }
   }
 }