From 918b77eebbea3eb6832a16d72740dbfb363f176b Mon Sep 17 00:00:00 2001
From: jeffvli <jeffvictorli@gmail.com>
Date: Fri, 3 Mar 2023 00:30:00 -0800
Subject: [PATCH] Adjust default dropdown styling

---
 src/renderer/components/context-menu/index.tsx  | 10 +++++-----
 src/renderer/components/dropdown-menu/index.tsx |  4 ++--
 src/renderer/themes/default.scss                |  8 ++++----
 3 files changed, 11 insertions(+), 11 deletions(-)

diff --git a/src/renderer/components/context-menu/index.tsx b/src/renderer/components/context-menu/index.tsx
index 178e3612..83b675f0 100644
--- a/src/renderer/components/context-menu/index.tsx
+++ b/src/renderer/components/context-menu/index.tsx
@@ -19,17 +19,17 @@ const ContextMenuContainer = styled(motion.div)<Omit<ContextMenuProps, 'children
   min-width: ${({ minWidth }) => minWidth}px;
   max-width: ${({ maxWidth }) => maxWidth}px;
   background: var(--dropdown-menu-bg);
-  border-radius: 10px;
+  border-radius: var(--dropdown-menu-border-radius);
   box-shadow: 2px 2px 10px 2px rgba(0, 0, 0, 40%);
 
   button:first-child {
-    border-top-left-radius: 10px;
-    border-top-right-radius: 10px;
+    border-top-left-radius: var(--dropdown-menu-border-radius);
+    border-top-right-radius: var(--dropdown-menu-border-radius);
   }
 
   button:last-child {
-    border-bottom-right-radius: 10px;
-    border-bottom-left-radius: 10px;
+    border-bottom-right-radius: var(--dropdown-menu-border-radius);
+    border-bottom-left-radius: var(--dropdown-menu-border-radius);
   }
 `;
 
diff --git a/src/renderer/components/dropdown-menu/index.tsx b/src/renderer/components/dropdown-menu/index.tsx
index 09af3c5e..0d7305d8 100644
--- a/src/renderer/components/dropdown-menu/index.tsx
+++ b/src/renderer/components/dropdown-menu/index.tsx
@@ -85,7 +85,8 @@ const StyledMenuDropdown = styled(MantineMenu.Dropdown)`
 `;
 
 const StyledMenuDivider = styled(MantineMenu.Divider)`
-  /* margin: 0.3rem 0; */
+  margin: 0;
+  padding: 0;
 `;
 
 export const DropdownMenu = ({ children, ...props }: MenuProps) => {
@@ -97,7 +98,6 @@ export const DropdownMenu = ({ children, ...props }: MenuProps) => {
           filter: 'drop-shadow(0 0 5px rgb(0, 0, 0, 50%))',
         },
       }}
-      transition="fade"
       {...props}
     >
       {children}
diff --git a/src/renderer/themes/default.scss b/src/renderer/themes/default.scss
index 25176b11..8bc63a92 100644
--- a/src/renderer/themes/default.scss
+++ b/src/renderer/themes/default.scss
@@ -64,13 +64,13 @@
   --input-active-fg: rgb(193, 193, 193);
   --input-active-bg: rgba(255, 255, 255, 0.1);
 
-  --dropdown-menu-bg: rgb(40, 40, 40);
+  --dropdown-menu-bg: rgb(45, 45, 45);
   --dropdown-menu-fg: rgb(235, 235, 235);
-  --dropdown-menu-item-padding: 1rem;
+  --dropdown-menu-item-padding: 0.8rem;
   --dropdown-menu-item-font-size: 1rem;
   --dropdown-menu-bg-hover: rgb(62, 62, 62);
-  --dropdown-menu-border: none;
-  --dropdown-menu-border-radius: 10px;
+  --dropdown-menu-border: 1px var(--generic-border-color) solid;
+  --dropdown-menu-border-radius: 0;
 
   --switch-track-bg: rgb(50, 50, 50);
   --switch-track-enabled-bg: var(--primary-color);