HealthSelector: use lighter background so the trigger is more visible

scality · Feb 17, 2021 · b7ca2a0 · b7ca2a0
1 parent 2c243cc
commit b7ca2a0
Showing 1 changed file with 6 additions and 6 deletions.
diff --git a/src/lib/components/healthselector/Healthselector.component.js b/src/lib/components/healthselector/Healthselector.component.js
@@ -47,13 +47,13 @@ const ThreeCirclesWrapper = styled.span`
 
 const TriggerStyled = styled(ButtonStyled)`
   box-sizing: border-box;
-  background-color: ${getThemePropSelector('primary')};
+  background-color: ${getThemePropSelector('border')};
   color: ${getThemePropSelector('textPrimary')};
   &:hover {
-    background-color: ${getThemePropSelector('primaryDark2')};
+    background-color: ${getThemePropSelector("secondaryDark1")};
   }
   &:active {
-    background-color: ${getThemePropSelector('primaryDark2')};
+    background-color: ${getThemePropSelector("secondaryDark1")};
   }
   border-radius: 4px;
 
@@ -210,13 +210,13 @@ const HealthSelectorMenuItem = styled.li`
   justify-content: space-around;
 
   ${css`
-    background-color: ${getThemePropSelector('primary')};
+    background-color: ${getThemePropSelector('border')};
     color: ${getThemePropSelector('textPrimary')};
     &:hover {
-      background-color: ${getThemePropSelector('primaryDark2')};
+      background-color: ${getThemePropSelector("secondaryDark1")};
     }
     &:active {
-      background-color: ${getThemePropSelector('primaryDark2')};
+      background-color: ${getThemePropSelector("secondaryDark1")};
     }
   `};
 `;