From 0d442a5b8d041a6e96870e94484d8d63bb96c8d8 Mon Sep 17 00:00:00 2001
From: Luke <sabolukas03@gmail.com>
Date: Wed, 4 Jan 2023 19:57:08 +0100
Subject: [PATCH] refactor(web/menu): remove borders from context menu buttons

---
 .../features/menu/context/components/ContextButton.tsx    | 8 ++++++--
 web/src/features/menu/context/components/HeaderButton.tsx | 6 ++++--
 2 files changed, 10 insertions(+), 4 deletions(-)

diff --git a/web/src/features/menu/context/components/ContextButton.tsx b/web/src/features/menu/context/components/ContextButton.tsx
index cbfaf42..752628a 100644
--- a/web/src/features/menu/context/components/ContextButton.tsx
+++ b/web/src/features/menu/context/components/ContextButton.tsx
@@ -16,13 +16,16 @@ const useStyles = createStyles((theme, params: { disabled?: boolean }) => ({
   inner: {
     justifyContent: 'flex-start',
   },
+  root: {
+    border: 'none',
+  },
   label: {
     width: '100%',
     color: params.disabled ? theme.colors.dark[3] : theme.colors.dark[0],
     whiteSpace: 'pre-wrap',
   },
   description: {
-    color: params.disabled ? theme.colors.dark[3] : theme.colors.dark[2]
+    color: params.disabled ? theme.colors.dark[3] : theme.colors.dark[2],
   },
   dropdown: {
     padding: 10,
@@ -30,6 +33,7 @@ const useStyles = createStyles((theme, params: { disabled?: boolean }) => ({
     fontSize: 14,
     maxWidth: 256,
     width: 'fit-content',
+    border: 'none',
   },
 }));
 
@@ -49,7 +53,7 @@ const ContextButton: React.FC<{
       >
         <HoverCard.Target>
           <Button
-            classNames={{ inner: classes.inner, label: classes.label }}
+            classNames={{ inner: classes.inner, label: classes.label, root: classes.root }}
             onClick={() => (!button.disabled ? (button.menu ? openMenu(button.menu) : clickContext(buttonKey)) : null)}
             variant="default"
             h="fit-content"
diff --git a/web/src/features/menu/context/components/HeaderButton.tsx b/web/src/features/menu/context/components/HeaderButton.tsx
index e10e759..69d6202 100644
--- a/web/src/features/menu/context/components/HeaderButton.tsx
+++ b/web/src/features/menu/context/components/HeaderButton.tsx
@@ -19,7 +19,9 @@ const useStyles = createStyles((theme, params: { canClose?: boolean }) => ({
     justifyContent: 'center',
     padding: 2,
   },
-
+  root: {
+    border: 'none',
+  },
   label: {
     color: params.canClose ? theme.colors.dark[0] : theme.colors.dark[2],
   },
@@ -32,7 +34,7 @@ const HeaderButton: React.FC<Props> = ({ icon, canClose, iconSize, handleClick }
     <Button
       variant="default"
       className={classes.button}
-      classNames={{ label: classes.label }}
+      classNames={{ label: classes.label, root: classes.root }}
       disabled={canClose === false}
       onClick={handleClick}
     >