From 2be52664519e32cf5e48a9ba55526530c18a0b9b Mon Sep 17 00:00:00 2001
From: lukewalczak <lukasz.walczak.pwr@gmail.com>
Date: Fri, 15 Apr 2022 14:54:57 +0200
Subject: [PATCH] refactor: correct elevation

---
 example/src/Examples/MenuExample.tsx | 2 +-
 src/components/Menu/Menu.tsx         | 9 +++------
 2 files changed, 4 insertions(+), 7 deletions(-)

diff --git a/example/src/Examples/MenuExample.tsx b/example/src/Examples/MenuExample.tsx
index 133f9318a6..5f79d5a64d 100644
--- a/example/src/Examples/MenuExample.tsx
+++ b/example/src/Examples/MenuExample.tsx
@@ -67,7 +67,7 @@ const MenuExample = ({ navigation }: Props) => {
             <Appbar.Action
               icon={MORE_ICON}
               onPress={_toggleMenu('menu1')}
-              {...(isV3 && { color: 'white' })}
+              {...(!isV3 && { color: 'white' })}
             />
           }
         >
diff --git a/src/components/Menu/Menu.tsx b/src/components/Menu/Menu.tsx
index 639e3d917d..c29cbc0370 100644
--- a/src/components/Menu/Menu.tsx
+++ b/src/components/Menu/Menu.tsx
@@ -530,7 +530,8 @@ class Menu extends React.Component<Props, State> {
     const shadowMenuContainerStyle = {
       opacity: opacityAnimation,
       transform: scaleTransforms,
-      borderRadius: theme.isV3 ? 4 : theme.roundness,
+      borderRadius: theme.roundness,
+      ...(!theme.isV3 && { elevation: 8 }),
       ...(scrollableMenuHeight ? { height: scrollableMenuHeight } : {}),
     };
 
@@ -572,7 +573,6 @@ class Menu extends React.Component<Props, State> {
                     [
                       styles.shadowMenuContainer,
                       shadowMenuContainerStyle,
-                      theme.isV3 && styles.md3ShadowMenuContainer,
                       theme.isV3 && {
                         backgroundColor: color(theme.colors.surface)
                           .mix(color(theme.colors.primary), 0.08)
@@ -582,6 +582,7 @@ class Menu extends React.Component<Props, State> {
                       contentStyle,
                     ] as StyleProp<ViewStyle>
                   }
+                  {...(theme.isV3 && { elevation: 2 })}
                 >
                   {(scrollableMenuHeight && (
                     <ScrollView>{children}</ScrollView>
@@ -603,10 +604,6 @@ const styles = StyleSheet.create({
   shadowMenuContainer: {
     opacity: 0,
     paddingVertical: 8,
-    elevation: 8,
-  },
-  md3ShadowMenuContainer: {
-    elevation: 3,
   },
 });