From 30ed6e742a2e7e887286c0792cd00efa031b851b Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=C4=B0nan=C3=A7=20CAN?= <ge82ced@mytum.de>
Date: Wed, 26 Apr 2023 15:43:15 +0200
Subject: [PATCH] Refactor toggle button

---
 .../src/components/common/Switch/Switch.styled.ts            | 4 ++++
 kafka-ui-react-app/src/theme/theme.ts                        | 5 +++--
 2 files changed, 7 insertions(+), 2 deletions(-)

diff --git a/kafka-ui-react-app/src/components/common/Switch/Switch.styled.ts b/kafka-ui-react-app/src/components/common/Switch/Switch.styled.ts
index 8823928059..0f4f2c1d11 100644
--- a/kafka-ui-react-app/src/components/common/Switch/Switch.styled.ts
+++ b/kafka-ui-react-app/src/components/common/Switch/Switch.styled.ts
@@ -39,6 +39,10 @@ export const StyledSlider = styled.span<Props>`
   transition: 0.4s;
   border-radius: 20px;
 
+  :hover {
+    background-color: ${({ theme }) => theme.switch.hover};
+  }
+
   &::before {
     position: absolute;
     content: '';
diff --git a/kafka-ui-react-app/src/theme/theme.ts b/kafka-ui-react-app/src/theme/theme.ts
index 33dbf1c619..ea83381422 100644
--- a/kafka-ui-react-app/src/theme/theme.ts
+++ b/kafka-ui-react-app/src/theme/theme.ts
@@ -235,12 +235,13 @@ const baseTheme = {
     color: Colors.neutral[90],
   },
   switch: {
-    unchecked: Colors.brand[30],
+    unchecked: Colors.neutral[20],
+    hover: Colors.neutral[40],
     checked: Colors.brand[50],
     circle: Colors.neutral[0],
     disabled: Colors.neutral[10],
     checkedIcon: {
-      backgroundColor: Colors.neutral[70],
+      backgroundColor: Colors.neutral[10],
     },
   },
   pageLoader: {