From 2f706ed347787572730e8aa90450885d269bf267 Mon Sep 17 00:00:00 2001
From: Send_Nukez <erikjulius2701@yahoo.de>
Date: Mon, 8 Nov 2021 00:27:57 +0100
Subject: [PATCH] improved user menu hover style

---
 CHANGELOG.md         |  1 +
 src/js/main.js       |  2 +-
 src/styles/main.scss | 15 ++++++++++-----
 3 files changed, 12 insertions(+), 6 deletions(-)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index 3efc0f1..2b47c92 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -20,3 +20,4 @@ Improved:
 - Better install script for MacOs/Linux
 - `About` settings area is always open now
 - Context menus are now glassy
+- User menu hover state
diff --git a/src/js/main.js b/src/js/main.js
index c5abaca..b74d077 100644
--- a/src/js/main.js
+++ b/src/js/main.js
@@ -28,7 +28,7 @@ DribbblishShared.config.register({
     name: "Round Sidebar Icons",
     description: "If the Sidebar Icons should be round instead of square",
     defaultValue: false,
-    onChange: (val) => $("html").css("--sidebar-icons-border-radius", val ? "50%" : "var(--image-radius)")
+    onChange: (val) => $("html").css("--sidebar-icons-border-radius", val ? "50vh" : "var(--image-radius)")
 });
 
 DribbblishShared.config.register({
diff --git a/src/styles/main.scss b/src/styles/main.scss
index ca89d6f..148c4eb 100644
--- a/src/styles/main.scss
+++ b/src/styles/main.scss
@@ -18,7 +18,7 @@
     --cover-border-radius: 8px;
     --playbar-movement-anim-speed: 0.5s;
     --image-radius: 10px;
-    --sidebar-icons-border-radius: 50%;
+    --sidebar-icons-border-radius: 50vh; // 50vh = round / pill
     --song-transition-speed: 3s;
 }
 
@@ -292,14 +292,13 @@ span.artist-artistVerifiedBadge-badge svg > path:last-of-type {
 }
 
 .cover-art,
-.main-userWidget-box.update-avail,
 .view-homeShortcutsGrid-shortcut,
 :not(.view-homeShortcutsGrid-imageWrapper) > .main-image-image:not(.main-avatar-image) {
     border-radius: var(--image-radius) !important;
 }
 
 .main-avatar-image,
-.main-userWidget-box:not(.update-avail),
+.main-userWidget-box,
 .main-avatar-userIcon,
 .view-homeShortcutsGrid-shortcutLink {
     border-radius: var(--sidebar-icons-border-radius) !important;
@@ -310,8 +309,14 @@ span.artist-artistVerifiedBadge-badge svg > path:last-of-type {
 }
 
 .main-userWidget-box.update-avail {
-    backdrop-filter: invert(0.1);
     padding-right: 10px;
+    background-color: spiceColor("subtext", 0.1) !important;
+
+    &:hover,
+    &:active,
+    &[data-context-menu-open="true"] {
+        background-color: spiceColor("subtext", 0.15) !important;
+    }
 }
 
 .main-avatar-avatar.main-avatar-withBadge:after {
@@ -812,7 +817,7 @@ li.GlueDropTarget {
     overflow: hidden;
     text-overflow: ellipsis;
     white-space: nowrap;
-    font-size: 11px;
+    font-size: 12px;
     font-weight: 400;
     letter-spacing: normal;
     line-height: 16px;