From e294fd3a8257b88511fa7134d5d8d39d955ed6be Mon Sep 17 00:00:00 2001
From: Marius <24592972+gilbN@users.noreply.github.com>
Date: Tue, 20 Apr 2021 21:59:25 +0200
Subject: [PATCH] arr EnhancedSelectInput fixes

---
 CSS/themes/bazarr/bazarr-base.css     |  6 ++--
 CSS/themes/lidarr/lidarr-base.css     | 45 ++++++++++-----------------
 CSS/themes/prowlarr/prowlarr-base.css | 37 +++++++++++++---------
 CSS/themes/radarr/radarr-base.css     | 25 ++++++++-------
 CSS/themes/readarr/readarr-base.css   | 28 ++++++++++-------
 CSS/themes/sonarr/sonarr-base.css     | 27 +++++++++-------
 6 files changed, 87 insertions(+), 81 deletions(-)

diff --git a/CSS/themes/bazarr/bazarr-base.css b/CSS/themes/bazarr/bazarr-base.css
index 33cd068e..ac073ea7 100644
--- a/CSS/themes/bazarr/bazarr-base.css
+++ b/CSS/themes/bazarr/bazarr-base.css
@@ -572,15 +572,15 @@ a:hover {
 }
 
 .custom-selector .selector__control {
-    background-color: #00000040;
-    border-color: rgba(0, 0, 0, 0);
+    background-color: rgba(0, 0, 0, 0.25);
+    border-color: rgba(0, 0, 0, 0) !important;
     color: #fff;
 }
 
 [class$="-singleValue"],
 [class$="-placeholder"],
 [class$="-indicatorContainer"] {
-    color: var(--text);
+    color: var(--text) !important;
 }
 
 [class$="-indicatorContainer"]:hover {
diff --git a/CSS/themes/lidarr/lidarr-base.css b/CSS/themes/lidarr/lidarr-base.css
index 6060e5ca..c4a39113 100644
--- a/CSS/themes/lidarr/lidarr-base.css
+++ b/CSS/themes/lidarr/lidarr-base.css
@@ -210,20 +210,24 @@ a:hover {
 }
 
 /* ADD NEW */
-div[class*='EnhancedSelectInputOption'] {
-    background-color: #1e1e1e;
-    color: #fff;
-}
-
-div[class*='EnhancedSelectInputOption']:hover {
-    background-color: rgba(255, 255, 255, 0.08);
-    color: #fff;
-}
-
 [class*="EnhancedSelectInput-options-"] {
-    border: 1px solid #1e1e1e;
+    border: 1px solid rgba(255, 255, 255, 0.2);
     border-radius: 4px;
-    background-color: #1e1e1e;
+    background: var(--modal-bg-color);
+}
+
+[class*="EnhancedSelectInputOption-isSelected-"],
+[class*="EnhancedSelectInputOption-isSelected-"]:hover {
+    background-color: rgba(255, 255, 255, 0.20) !important;
+}
+
+[class*="EnhancedSelectInputOption-option-"]:hover {
+    background-color: rgba(255, 255, 255, 0.08);
+}
+
+[class*="HintedSelectInputOption-hintText-"],
+[class*="RootFolderSelectInputOption-freeSpace-"] {
+    color: var(--text);
 }
 
 /* SIDE MENU */
@@ -508,23 +512,6 @@ div[class*='EnhancedSelectInputOption']:hover {
     color: #FFF;
 }
 
-/* ADD NEW */
-div[class*='EnhancedSelectInputOption'] {
-    background-color: #1e1e1e;
-    color: #fff;
-}
-
-div[class*='EnhancedSelectInputOption']:hover {
-    background-color: rgba(255, 255, 255, 0.08);
-    color: #fff;
-}
-
-[class*="EnhancedSelectInput-options-"] {
-    border: 1px solid #1e1e1e;
-    border-radius: 4px;
-    background-color: #1e1e1e;
-}
-
 /* SEARCH BAR */
 [class*="Input-input-"],
 [class*="AddNewArtist-searchIconContainer-"],
diff --git a/CSS/themes/prowlarr/prowlarr-base.css b/CSS/themes/prowlarr/prowlarr-base.css
index 154b7642..4624027a 100644
--- a/CSS/themes/prowlarr/prowlarr-base.css
+++ b/CSS/themes/prowlarr/prowlarr-base.css
@@ -165,6 +165,7 @@ a:hover {
 
 [class*="PageHeader-header-"] {
     background-color: rgba(0, 0, 0, .35);
+    box-shadow: none;
 }
 
 /* SEARCH DROPDOWN HEADER */
@@ -486,20 +487,23 @@ a:hover {
 }
 
 /* ADD NEW */
-div[class*='EnhancedSelectInputOption'] {
-    background-color: #1e1e1e;
-    color: #fff;
-}
-
-div[class*='EnhancedSelectInputOption']:hover {
-    background-color: rgba(255, 255, 255, 0.08);
-    color: #fff;
-}
 
 [class*="EnhancedSelectInput-options-"] {
-    border: 1px solid #1e1e1e;
+    border: 1px solid rgba(255, 255, 255, 0.2);
     border-radius: 4px;
-    background-color: #1e1e1e;
+    background: var(--modal-bg-color);
+}
+[class*="EnhancedSelectInputOption-isSelected-"],
+[class*="EnhancedSelectInputOption-isSelected-"]:hover {
+    background-color: rgba(255, 255, 255, 0.20) !important;
+}
+
+[class*="EnhancedSelectInputOption-option-"]:hover {
+    background-color: rgba(255, 255, 255, 0.08);
+}
+
+[class*="HintedSelectInputOption-hintText-"] {
+    color: var(--text);
 }
 
 /* SEARCH BAR */
@@ -933,6 +937,11 @@ div[class*='EnhancedSelectInputOption']:hover {
 }
 
 /* ChartJS */
-canvas.chartjs-render-monitor {
-    background: rgb(255, 255, 255, 0.05);
-    }
+[class*="Stats-fullWidthChart-"],
+[class*="Stats-halfWidthChart-"]{
+  background: rgba(0, 0, 0, .25) !important;
+}
+
+canvas {
+filter: invert(1)
+}
\ No newline at end of file
diff --git a/CSS/themes/radarr/radarr-base.css b/CSS/themes/radarr/radarr-base.css
index ddd975bc..07fe68a9 100644
--- a/CSS/themes/radarr/radarr-base.css
+++ b/CSS/themes/radarr/radarr-base.css
@@ -486,20 +486,23 @@ a:hover {
 }
 
 /* ADD NEW */
-div[class*='EnhancedSelectInputOption'] {
-    background-color: #1e1e1e;
-    color: #fff;
-}
-
-div[class*='EnhancedSelectInputOption']:hover {
-    background-color: rgba(255, 255, 255, 0.08);
-    color: #fff;
-}
 
 [class*="EnhancedSelectInput-options-"] {
-    border: 1px solid #1e1e1e;
+    border: 1px solid rgba(255, 255, 255, 0.2);
     border-radius: 4px;
-    background-color: #1e1e1e;
+    background: var(--modal-bg-color);
+}
+[class*="EnhancedSelectInputOption-isSelected-"],
+[class*="EnhancedSelectInputOption-isSelected-"]:hover {
+    background-color: rgba(255, 255, 255, 0.20) !important;
+}
+
+[class*="EnhancedSelectInputOption-option-"]:hover {
+    background-color: rgba(255, 255, 255, 0.08);
+}
+
+[class*="HintedSelectInputOption-hintText-"] {
+    color: var(--text);
 }
 
 /* SEARCH BAR */
diff --git a/CSS/themes/readarr/readarr-base.css b/CSS/themes/readarr/readarr-base.css
index c49b58fd..c808cc39 100644
--- a/CSS/themes/readarr/readarr-base.css
+++ b/CSS/themes/readarr/readarr-base.css
@@ -210,20 +210,24 @@ a:hover {
 }
 
 /* ADD NEW */
-div[class*='EnhancedSelectInputOption'] {
-    background-color: #1e1e1e;
-    color: #fff;
-}
-
-div[class*='EnhancedSelectInputOption']:hover {
-    background-color: rgba(255, 255, 255, 0.08);
-    color: #fff;
-}
-
 [class*="EnhancedSelectInput-options-"] {
-    border: 1px solid transparent;
+    border: 1px solid rgba(255, 255, 255, 0.2);
     border-radius: 4px;
-    background-color: #1e1e1e;
+    background: var(--modal-bg-color);
+}
+
+[class*="EnhancedSelectInputOption-isSelected-"],
+[class*="EnhancedSelectInputOption-isSelected-"]:hover {
+    background-color: rgba(255, 255, 255, 0.20) !important;
+}
+
+[class*="EnhancedSelectInputOption-option-"]:hover {
+    background-color: rgba(255, 255, 255, 0.08);
+}
+
+[class*="HintedSelectInputOption-hintText-"],
+[class*="RootFolderSelectInputOption-freeSpace-"] {
+    color: var(--text);
 }
 
 /* SIDE MENU */
diff --git a/CSS/themes/sonarr/sonarr-base.css b/CSS/themes/sonarr/sonarr-base.css
index eb975474..97a4ae84 100644
--- a/CSS/themes/sonarr/sonarr-base.css
+++ b/CSS/themes/sonarr/sonarr-base.css
@@ -479,20 +479,23 @@ a:hover {
 }
 
 /* ADD NEW */
-div[class*='EnhancedSelectInputOption'] {
-    background-color: #1e1e1e;
-    color: #fff;
-}
-
-div[class*='EnhancedSelectInputOption']:hover {
-    background-color: rgba(255, 255, 255, 0.08);
-    color: var(--text-hover);
-}
-
 [class*="EnhancedSelectInput\/options\/"] {
-    border: 1px solid #1e1e1e;
+    border: 1px solid rgba(255, 255, 255, 0.2);
     border-radius: 4px;
-    background-color: #1e1e1e;
+    background: var(--modal-bg-color);
+}
+[class*="EnhancedSelectInputOption\/isSelected\/"],
+[class*="EnhancedSelectInputOption\/isSelected\/"]:hover {
+    background-color: rgba(255, 255, 255, 0.20) !important;
+}
+
+[class*="EnhancedSelectInputOption\/option\/"]:hover {
+    background-color: rgba(255, 255, 255, 0.08);
+}
+
+[class*="HintedSelectInputOption\/hintText\/"],
+[class*="RootFolderSelectInputOption\/freeSpace\/"] {
+    color: var(--text);
 }
 
 /* SEARCH BAR */