Merge pull request #42 from software-mansion-labs/@cdOut/ideal-nav-fi…

…xes-2
allroundexperts · Jan 26, 2024 · 140229f · 140229f
2 parents ed57401 + 2bdf278
commit 140229f
Show file tree

Hide file tree

Showing 5 changed files with 18 additions and 5 deletions.
diff --git a/src/components/MenuItem.tsx b/src/components/MenuItem.tsx
@@ -397,7 +397,7 @@ function MenuItem(
                             combinedStyle,
                             !interactive && styles.cursorDefault,
                             StyleUtils.getButtonBackgroundColorStyle(getButtonState(focused || isHovered, pressed, success, disabled, interactive), true),
-                            (isHovered || pressed) && hoverAndPressStyle,
+                            !focused && (isHovered || pressed) && hoverAndPressStyle,
                             ...(Array.isArray(wrapperStyle) ? wrapperStyle : [wrapperStyle]),
                             shouldGreyOutWhenDisabled && disabled && styles.buttonOpacityDisabled,
                         ] as StyleProp<ViewStyle>

diff --git a/src/pages/home/sidebar/AllSettingsScreen.tsx b/src/pages/home/sidebar/AllSettingsScreen.tsx
@@ -68,8 +68,9 @@ function AllSettingsScreen() {
             wrapperStyle: styles.sectionMenuItem,
             isPaneMenu: true,
             focused: item.focused,
+            hoverAndPressStyle: styles.hoveredComponentBG,
         }));
-    }, [isSmallScreenWidth, styles.sectionMenuItem, translate, waitForNavigate]);
+    }, [isSmallScreenWidth, styles.hoveredComponentBG, styles.sectionMenuItem, translate, waitForNavigate]);
 
     return (
         <ScreenWrapper

diff --git a/src/pages/settings/InitialSettingsPage.js b/src/pages/settings/InitialSettingsPage.js
@@ -262,6 +262,7 @@ function InitialSettingsPage(props) {
                                 shouldStackHorizontally={item.shouldStackHorizontally}
                                 floatRightAvatarSize={item.avatarSize}
                                 ref={popoverAnchor}
+                                hoverAndPressStyle={styles.hoveredComponentBG}
                                 shouldBlockSelection={Boolean(item.link)}
                                 onSecondaryInteraction={
                                     !_.isEmpty(item.link) ? (e) => ReportActionContextMenu.showContextMenu(CONST.CONTEXT_MENU_TYPES.LINK, e, item.link, popoverAnchor.current) : undefined
@@ -274,7 +275,19 @@ function InitialSettingsPage(props) {
                 </View>
             );
         },
-        [styles.pb4, styles.mh3, styles.sectionTitle, styles.sectionMenuItem, translate, props.userWallet.currentBalance, isExecuting, singleExecution, activeRoute, waitForNavigate],
+        [
+            styles.pb4,
+            styles.mh3,
+            styles.sectionTitle,
+            styles.sectionMenuItem,
+            styles.hoveredComponentBG,
+            translate,
+            props.userWallet.currentBalance,
+            isExecuting,
+            singleExecution,
+            activeRoute,
+            waitForNavigate,
+        ],
     );
 
     const accountMenuItems = useMemo(() => getMenuItemsSection(accountMenuItemsData), [accountMenuItemsData, getMenuItemsSection]);

diff --git a/src/pages/settings/Wallet/WalletPage/WalletPage.js b/src/pages/settings/Wallet/WalletPage/WalletPage.js
@@ -443,7 +443,6 @@ function WalletPage({bankAccountList, cardList, fundList, isLoadingPaymentMethod
                                                             ref={buttonRef}
                                                             text={translate('walletPage.enableWallet')}
                                                             onPress={triggerKYCFlow}
-                                                            style={styles.mh5}
                                                             isDisabled={network.isOffline}
                                                             success
                                                             large

diff --git a/src/styles/index.ts b/src/styles/index.ts
@@ -3184,7 +3184,7 @@ const styles = (theme: ThemeColors) =>
             alignItems: 'center',
             gap: 8,
             paddingHorizontal: 24,
-            backgroundColor: theme.highlightBG,
+            backgroundColor: theme.hoverComponentBG,
             borderRadius: variables.componentBorderRadiusRounded,
         },