From a76f334447df57a33346d15408eb3f3e7112b145 Mon Sep 17 00:00:00 2001
From: Finnian Jacobson-Schulte
 <140328381+finnian0826@users.noreply.github.com>
Date: Fri, 17 May 2024 05:27:32 +1200
Subject: [PATCH] feat: Change button color to black (#5401)

### Description
- Change primary button color to black
- Set opacity at 25% when disabled
- Set opacity of GRAY_WITH_BORDER to 50% when disabled

### Test plan

Updated unit tests, manual tests:

![token-details](https://github.com/valora-inc/wallet/assets/140328381/52e0bb80-1011-45ef-b7e7-361c0de161f6)


https://github.com/valora-inc/wallet/assets/140328381/5fdf0e9c-fef7-4c9b-8608-48354a2ca6c2


https://github.com/valora-inc/wallet/assets/140328381/6afe33f8-7751-42c0-8fce-e13192324e3a


https://github.com/valora-inc/wallet/assets/140328381/2dd9d319-cf81-40c4-b104-bbe1544788cc






### Related issues

- N/A

### Backwards compatibility

Yes

### Network scalability

If a new NetworkId and/or Network are added in the future, the changes
in this PR will:

- [X] Continue to work without code changes, OR trigger a compilation
error (guaranteeing we find it when a new network is added)
---
 .../AccountKeyEducation.test.tsx.snap         |  2 +-
 .../__snapshots__/Education.test.tsx.snap     |  6 ++---
 .../__snapshots__/GoldEducation.test.tsx.snap |  2 +-
 .../__snapshots__/Persona.test.tsx.snap       |  6 ++---
 .../__snapshots__/Profile.test.tsx.snap       |  6 ++---
 src/app/MultichainBeta.tsx                    |  2 --
 src/app/__snapshots__/Debug.test.tsx.snap     |  6 ++---
 .../__snapshots__/ErrorScreen.test.tsx.snap   | 12 +++++-----
 .../__snapshots__/BackupPhrase.test.tsx.snap  |  2 +-
 src/components/Button.tsx                     | 23 ++++++++-----------
 .../__snapshots__/Button.test.tsx.snap        |  8 +++----
 .../__snapshots__/FullscreenCTA.test.tsx.snap |  6 ++---
 .../__snapshots__/CashInSuccess.test.tsx.snap | 12 +++++-----
 .../FiatExchangeAmount.test.tsx.snap          | 12 +++++-----
 .../__snapshots__/SimplexScreen.test.tsx.snap | 10 ++++----
 src/points/PointsHome.tsx                     |  1 -
 src/send/EnterAmount.tsx                      |  4 ----
 .../SendConfirmation.test.tsx.snap            |  6 ++---
 .../ValidateRecipientAccount.test.tsx.snap    | 12 +++++-----
 src/tokens/TokenDetails.tsx                   |  1 -
 20 files changed, 63 insertions(+), 76 deletions(-)

diff --git a/src/account/__snapshots__/AccountKeyEducation.test.tsx.snap b/src/account/__snapshots__/AccountKeyEducation.test.tsx.snap
index 3de91fee2a4..e53e3d6d0e3 100644
--- a/src/account/__snapshots__/AccountKeyEducation.test.tsx.snap
+++ b/src/account/__snapshots__/AccountKeyEducation.test.tsx.snap
@@ -555,7 +555,7 @@ exports[`AccountKeyEducation renders correctly 1`] = `
                 "color": "#2E3338",
                 "fontFamily": "Inter-SemiBold",
                 "fontSize": 16,
-                "lineHeight": 22,
+                "lineHeight": 24,
                 "marginLeft": 0,
                 "marginRight": 0,
               }
diff --git a/src/account/__snapshots__/Education.test.tsx.snap b/src/account/__snapshots__/Education.test.tsx.snap
index 52986d918b5..3f6445701de 100644
--- a/src/account/__snapshots__/Education.test.tsx.snap
+++ b/src/account/__snapshots__/Education.test.tsx.snap
@@ -241,12 +241,12 @@ exports[`Education renders correctly 1`] = `
             [
               {
                 "alignItems": "center",
-                "backgroundColor": "#1AB775",
+                "backgroundColor": "#2E3338",
                 "flexDirection": "row",
                 "height": 48,
                 "justifyContent": "center",
                 "minWidth": 120,
-                "opacity": undefined,
+                "opacity": 1,
                 "paddingHorizontal": 24,
                 "paddingVertical": 5,
               },
@@ -264,7 +264,7 @@ exports[`Education renders correctly 1`] = `
                 "color": "#FFFFFF",
                 "fontFamily": "Inter-SemiBold",
                 "fontSize": 16,
-                "lineHeight": 22,
+                "lineHeight": 24,
                 "marginLeft": 0,
                 "marginRight": 0,
               }
diff --git a/src/account/__snapshots__/GoldEducation.test.tsx.snap b/src/account/__snapshots__/GoldEducation.test.tsx.snap
index 2562a85c553..3635d1b2f20 100644
--- a/src/account/__snapshots__/GoldEducation.test.tsx.snap
+++ b/src/account/__snapshots__/GoldEducation.test.tsx.snap
@@ -555,7 +555,7 @@ exports[`renders correctly 1`] = `
                 "color": "#2E3338",
                 "fontFamily": "Inter-SemiBold",
                 "fontSize": 16,
-                "lineHeight": 22,
+                "lineHeight": 24,
                 "marginLeft": 0,
                 "marginRight": 0,
               }
diff --git a/src/account/__snapshots__/Persona.test.tsx.snap b/src/account/__snapshots__/Persona.test.tsx.snap
index 0f14a961ec8..c421090c726 100644
--- a/src/account/__snapshots__/Persona.test.tsx.snap
+++ b/src/account/__snapshots__/Persona.test.tsx.snap
@@ -61,12 +61,12 @@ exports[`Persona renders correctly 1`] = `
         [
           {
             "alignItems": "center",
-            "backgroundColor": "#1AB77580",
+            "backgroundColor": "#2E3338",
             "flexDirection": "row",
             "height": 48,
             "justifyContent": "center",
             "minWidth": 120,
-            "opacity": undefined,
+            "opacity": 0.25,
             "paddingHorizontal": 24,
             "paddingVertical": 5,
           },
@@ -82,7 +82,7 @@ exports[`Persona renders correctly 1`] = `
             "color": "#FFFFFF",
             "fontFamily": "Inter-SemiBold",
             "fontSize": 16,
-            "lineHeight": 22,
+            "lineHeight": 24,
             "marginLeft": 0,
             "marginRight": 0,
           }
diff --git a/src/account/__snapshots__/Profile.test.tsx.snap b/src/account/__snapshots__/Profile.test.tsx.snap
index 4ef7e703efa..83ea07df97e 100644
--- a/src/account/__snapshots__/Profile.test.tsx.snap
+++ b/src/account/__snapshots__/Profile.test.tsx.snap
@@ -308,12 +308,12 @@ exports[`Profile renders correctly 1`] = `
                 [
                   {
                     "alignItems": "center",
-                    "backgroundColor": "#1AB775",
+                    "backgroundColor": "#2E3338",
                     "flexDirection": "row",
                     "height": 48,
                     "justifyContent": "center",
                     "minWidth": 120,
-                    "opacity": undefined,
+                    "opacity": 1,
                     "paddingHorizontal": 24,
                     "paddingVertical": 5,
                   },
@@ -329,7 +329,7 @@ exports[`Profile renders correctly 1`] = `
                     "color": "#FFFFFF",
                     "fontFamily": "Inter-SemiBold",
                     "fontSize": 16,
-                    "lineHeight": 22,
+                    "lineHeight": 24,
                     "marginLeft": 0,
                     "marginRight": 0,
                   }
diff --git a/src/app/MultichainBeta.tsx b/src/app/MultichainBeta.tsx
index 2f76e466cf5..c016a017fbd 100644
--- a/src/app/MultichainBeta.tsx
+++ b/src/app/MultichainBeta.tsx
@@ -53,7 +53,6 @@ function MultichainBeta() {
         <View style={styles.ctaContainer}>
           <Button
             style={styles.cta}
-            fontStyle={typeScale.labelSemiBoldMedium}
             touchableStyle={styles.ctaTouchable}
             size={BtnSizes.FULL}
             text={t('multichainBeta.primaryCta')}
@@ -64,7 +63,6 @@ function MultichainBeta() {
           />
           <Button
             style={styles.cta}
-            fontStyle={typeScale.labelSemiBoldMedium}
             touchableStyle={styles.ctaTouchable}
             type={BtnTypes.SECONDARY_WHITE_BG}
             size={BtnSizes.FULL}
diff --git a/src/app/__snapshots__/Debug.test.tsx.snap b/src/app/__snapshots__/Debug.test.tsx.snap
index bc27ad60082..4af253cb1cc 100644
--- a/src/app/__snapshots__/Debug.test.tsx.snap
+++ b/src/app/__snapshots__/Debug.test.tsx.snap
@@ -147,12 +147,12 @@ exports[`Debug renders correctly 1`] = `
           [
             {
               "alignItems": "center",
-              "backgroundColor": "#1AB775",
+              "backgroundColor": "#2E3338",
               "flexDirection": "row",
               "height": 48,
               "justifyContent": "center",
               "minWidth": 120,
-              "opacity": undefined,
+              "opacity": 1,
               "paddingHorizontal": 24,
               "paddingVertical": 5,
             },
@@ -167,7 +167,7 @@ exports[`Debug renders correctly 1`] = `
               "color": "#FFFFFF",
               "fontFamily": "Inter-SemiBold",
               "fontSize": 16,
-              "lineHeight": 22,
+              "lineHeight": 24,
               "marginLeft": 0,
               "marginRight": 0,
             }
diff --git a/src/app/__snapshots__/ErrorScreen.test.tsx.snap b/src/app/__snapshots__/ErrorScreen.test.tsx.snap
index 94669a6dda9..d09a20982e5 100644
--- a/src/app/__snapshots__/ErrorScreen.test.tsx.snap
+++ b/src/app/__snapshots__/ErrorScreen.test.tsx.snap
@@ -143,12 +143,12 @@ exports[`ErrorScreen with errorMessage renders correctly 1`] = `
             [
               {
                 "alignItems": "center",
-                "backgroundColor": "#1AB775",
+                "backgroundColor": "#2E3338",
                 "flexDirection": "row",
                 "height": 48,
                 "justifyContent": "center",
                 "minWidth": 120,
-                "opacity": undefined,
+                "opacity": 1,
                 "paddingHorizontal": 24,
                 "paddingVertical": 5,
               },
@@ -164,7 +164,7 @@ exports[`ErrorScreen with errorMessage renders correctly 1`] = `
                 "color": "#FFFFFF",
                 "fontFamily": "Inter-SemiBold",
                 "fontSize": 16,
-                "lineHeight": 22,
+                "lineHeight": 24,
                 "marginLeft": 0,
                 "marginRight": 0,
               }
@@ -322,12 +322,12 @@ exports[`ErrorScreen without errorMessage renders correctly 1`] = `
             [
               {
                 "alignItems": "center",
-                "backgroundColor": "#1AB775",
+                "backgroundColor": "#2E3338",
                 "flexDirection": "row",
                 "height": 48,
                 "justifyContent": "center",
                 "minWidth": 120,
-                "opacity": undefined,
+                "opacity": 1,
                 "paddingHorizontal": 24,
                 "paddingVertical": 5,
               },
@@ -343,7 +343,7 @@ exports[`ErrorScreen without errorMessage renders correctly 1`] = `
                 "color": "#FFFFFF",
                 "fontFamily": "Inter-SemiBold",
                 "fontSize": 16,
-                "lineHeight": 22,
+                "lineHeight": 24,
                 "marginLeft": 0,
                 "marginRight": 0,
               }
diff --git a/src/backup/__snapshots__/BackupPhrase.test.tsx.snap b/src/backup/__snapshots__/BackupPhrase.test.tsx.snap
index 0a88c0db9d8..dde682828da 100644
--- a/src/backup/__snapshots__/BackupPhrase.test.tsx.snap
+++ b/src/backup/__snapshots__/BackupPhrase.test.tsx.snap
@@ -682,7 +682,7 @@ exports[`BackupPhrase renders correctly with backup not completed 1`] = `
               "color": "#666666",
               "fontFamily": "Inter-SemiBold",
               "fontSize": 16,
-              "lineHeight": 22,
+              "lineHeight": 24,
               "marginLeft": 0,
               "marginRight": 0,
             }
diff --git a/src/components/Button.tsx b/src/components/Button.tsx
index c62d50bff05..5c503d215ee 100644
--- a/src/components/Button.tsx
+++ b/src/components/Button.tsx
@@ -1,17 +1,9 @@
 import { debounce } from 'lodash'
 import React, { ReactNode, useCallback } from 'react'
-import {
-  ActivityIndicator,
-  StyleProp,
-  StyleSheet,
-  Text,
-  TextStyle,
-  View,
-  ViewStyle,
-} from 'react-native'
+import { ActivityIndicator, StyleProp, StyleSheet, Text, View, ViewStyle } from 'react-native'
 import Touchable from 'src/components/Touchable'
 import colors, { Colors } from 'src/styles/colors'
-import fontStyles from 'src/styles/fonts'
+import { typeScale } from 'src/styles/fonts'
 import { vibrateInformative } from 'src/styles/hapticFeedback'
 
 const BUTTON_TAP_DEBOUNCE_TIME = 300 // milliseconds
@@ -51,7 +43,6 @@ export interface ButtonProps {
   testID?: string
   touchableStyle?: StyleProp<ViewStyle>
   iconMargin?: number
-  fontStyle?: TextStyle
 }
 
 export default React.memo(function Button(props: ButtonProps) {
@@ -70,7 +61,6 @@ export default React.memo(function Button(props: ButtonProps) {
     loadingColor,
     touchableStyle,
     iconMargin = 4,
-    fontStyle = fontStyles.regular600,
   } = props
 
   // Debounce onPress event so that it is called once on trigger and
@@ -117,7 +107,7 @@ export default React.memo(function Button(props: ButtonProps) {
                 maxFontSizeMultiplier={1}
                 accessibilityLabel={accessibilityLabel}
                 style={{
-                  ...fontStyle, // this has to be before color because the legacy font styles default to colors.dark, which will end up overriding the button type based colors
+                  ...styles.fontStyle,
                   color: textColor,
                   marginLeft: icon && iconPositionLeft ? iconMargin : 0,
                   marginRight: icon && !iconPositionLeft ? iconMargin : 0,
@@ -159,6 +149,9 @@ const styles = StyleSheet.create({
     height: 48,
     flexGrow: 1,
   },
+  fontStyle: {
+    ...typeScale.labelSemiBoldMedium,
+  },
 })
 
 function getColors(type: BtnTypes, disabled: boolean | undefined) {
@@ -169,7 +162,8 @@ function getColors(type: BtnTypes, disabled: boolean | undefined) {
   switch (type) {
     case BtnTypes.PRIMARY:
       textColor = colors.white
-      backgroundColor = disabled ? colors.primaryDisabled : colors.primary
+      backgroundColor = colors.black
+      opacity = disabled ? 0.25 : 1.0
       break
     case BtnTypes.SECONDARY:
       textColor = disabled ? colors.gray4 : colors.black
@@ -193,6 +187,7 @@ function getColors(type: BtnTypes, disabled: boolean | undefined) {
       textColor = colors.black
       backgroundColor = colors.gray1
       borderColor = colors.gray2
+      opacity = disabled ? 0.5 : 1.0
       break
   }
 
diff --git a/src/components/__snapshots__/Button.test.tsx.snap b/src/components/__snapshots__/Button.test.tsx.snap
index cb76f1bc585..56a7fb86f4a 100644
--- a/src/components/__snapshots__/Button.test.tsx.snap
+++ b/src/components/__snapshots__/Button.test.tsx.snap
@@ -81,7 +81,7 @@ exports[`Button when type is SECONDARY renders 1`] = `
             "color": "#2E3338",
             "fontFamily": "Inter-SemiBold",
             "fontSize": 16,
-            "lineHeight": 22,
+            "lineHeight": 24,
             "marginLeft": 0,
             "marginRight": 0,
           }
@@ -155,12 +155,12 @@ exports[`Button when type not given defaults to primary 1`] = `
         [
           {
             "alignItems": "center",
-            "backgroundColor": "#1AB775",
+            "backgroundColor": "#2E3338",
             "flexDirection": "row",
             "height": 48,
             "justifyContent": "center",
             "minWidth": 120,
-            "opacity": undefined,
+            "opacity": 1,
             "paddingHorizontal": 24,
             "paddingVertical": 5,
           },
@@ -175,7 +175,7 @@ exports[`Button when type not given defaults to primary 1`] = `
             "color": "#FFFFFF",
             "fontFamily": "Inter-SemiBold",
             "fontSize": 16,
-            "lineHeight": 22,
+            "lineHeight": 24,
             "marginLeft": 0,
             "marginRight": 0,
           }
diff --git a/src/components/__snapshots__/FullscreenCTA.test.tsx.snap b/src/components/__snapshots__/FullscreenCTA.test.tsx.snap
index d1b5698860a..c19e40406d7 100644
--- a/src/components/__snapshots__/FullscreenCTA.test.tsx.snap
+++ b/src/components/__snapshots__/FullscreenCTA.test.tsx.snap
@@ -143,12 +143,12 @@ exports[`FullscreenCTA renders correctly 1`] = `
             [
               {
                 "alignItems": "center",
-                "backgroundColor": "#1AB775",
+                "backgroundColor": "#2E3338",
                 "flexDirection": "row",
                 "height": 48,
                 "justifyContent": "center",
                 "minWidth": 120,
-                "opacity": undefined,
+                "opacity": 1,
                 "paddingHorizontal": 24,
                 "paddingVertical": 5,
               },
@@ -164,7 +164,7 @@ exports[`FullscreenCTA renders correctly 1`] = `
                 "color": "#FFFFFF",
                 "fontFamily": "Inter-SemiBold",
                 "fontSize": 16,
-                "lineHeight": 22,
+                "lineHeight": 24,
                 "marginLeft": 0,
                 "marginRight": 0,
               }
diff --git a/src/fiatExchanges/__snapshots__/CashInSuccess.test.tsx.snap b/src/fiatExchanges/__snapshots__/CashInSuccess.test.tsx.snap
index 07b85073368..43acaf7c731 100644
--- a/src/fiatExchanges/__snapshots__/CashInSuccess.test.tsx.snap
+++ b/src/fiatExchanges/__snapshots__/CashInSuccess.test.tsx.snap
@@ -135,12 +135,12 @@ exports[`CashinInSuccess renders correctly with a provider 1`] = `
             [
               {
                 "alignItems": "center",
-                "backgroundColor": "#1AB775",
+                "backgroundColor": "#2E3338",
                 "flexDirection": "row",
                 "height": 48,
                 "justifyContent": "center",
                 "minWidth": 120,
-                "opacity": undefined,
+                "opacity": 1,
                 "paddingHorizontal": 24,
                 "paddingVertical": 5,
               },
@@ -157,7 +157,7 @@ exports[`CashinInSuccess renders correctly with a provider 1`] = `
                 "color": "#FFFFFF",
                 "fontFamily": "Inter-SemiBold",
                 "fontSize": 16,
-                "lineHeight": 22,
+                "lineHeight": 24,
                 "marginLeft": 0,
                 "marginRight": 0,
               }
@@ -307,12 +307,12 @@ exports[`CashinInSuccess renders correctly without a provider 1`] = `
             [
               {
                 "alignItems": "center",
-                "backgroundColor": "#1AB775",
+                "backgroundColor": "#2E3338",
                 "flexDirection": "row",
                 "height": 48,
                 "justifyContent": "center",
                 "minWidth": 120,
-                "opacity": undefined,
+                "opacity": 1,
                 "paddingHorizontal": 24,
                 "paddingVertical": 5,
               },
@@ -329,7 +329,7 @@ exports[`CashinInSuccess renders correctly without a provider 1`] = `
                 "color": "#FFFFFF",
                 "fontFamily": "Inter-SemiBold",
                 "fontSize": 16,
-                "lineHeight": 22,
+                "lineHeight": 24,
                 "marginLeft": 0,
                 "marginRight": 0,
               }
diff --git a/src/fiatExchanges/__snapshots__/FiatExchangeAmount.test.tsx.snap b/src/fiatExchanges/__snapshots__/FiatExchangeAmount.test.tsx.snap
index d432118199b..d5c7c385909 100644
--- a/src/fiatExchanges/__snapshots__/FiatExchangeAmount.test.tsx.snap
+++ b/src/fiatExchanges/__snapshots__/FiatExchangeAmount.test.tsx.snap
@@ -171,12 +171,12 @@ exports[`FiatExchangeAmount cashIn renders correctly with EUR as app currency 1`
           [
             {
               "alignItems": "center",
-              "backgroundColor": "#1AB77580",
+              "backgroundColor": "#2E3338",
               "flexDirection": "row",
               "flexGrow": 1,
               "height": 48,
               "justifyContent": "center",
-              "opacity": undefined,
+              "opacity": 0.25,
               "paddingHorizontal": 24,
               "paddingVertical": 5,
             },
@@ -193,7 +193,7 @@ exports[`FiatExchangeAmount cashIn renders correctly with EUR as app currency 1`
               "color": "#FFFFFF",
               "fontFamily": "Inter-SemiBold",
               "fontSize": 16,
-              "lineHeight": 22,
+              "lineHeight": 24,
               "marginLeft": 0,
               "marginRight": 0,
             }
@@ -394,12 +394,12 @@ exports[`FiatExchangeAmount cashIn renders correctly with USD as app currency 1`
           [
             {
               "alignItems": "center",
-              "backgroundColor": "#1AB77580",
+              "backgroundColor": "#2E3338",
               "flexDirection": "row",
               "flexGrow": 1,
               "height": 48,
               "justifyContent": "center",
-              "opacity": undefined,
+              "opacity": 0.25,
               "paddingHorizontal": 24,
               "paddingVertical": 5,
             },
@@ -416,7 +416,7 @@ exports[`FiatExchangeAmount cashIn renders correctly with USD as app currency 1`
               "color": "#FFFFFF",
               "fontFamily": "Inter-SemiBold",
               "fontSize": 16,
-              "lineHeight": 22,
+              "lineHeight": 24,
               "marginLeft": 0,
               "marginRight": 0,
             }
diff --git a/src/fiatExchanges/__snapshots__/SimplexScreen.test.tsx.snap b/src/fiatExchanges/__snapshots__/SimplexScreen.test.tsx.snap
index 1f63c523fb4..267723256f1 100644
--- a/src/fiatExchanges/__snapshots__/SimplexScreen.test.tsx.snap
+++ b/src/fiatExchanges/__snapshots__/SimplexScreen.test.tsx.snap
@@ -562,12 +562,12 @@ exports[`SimplexScreen renders correctly 1`] = `
             [
               {
                 "alignItems": "center",
-                "backgroundColor": "#1AB77580",
+                "backgroundColor": "#2E3338",
                 "flexDirection": "row",
                 "flexGrow": 1,
                 "height": 48,
                 "justifyContent": "center",
-                "opacity": undefined,
+                "opacity": 0.25,
                 "paddingHorizontal": 24,
                 "paddingVertical": 5,
               },
@@ -1149,12 +1149,12 @@ exports[`SimplexScreen renders correctly 2`] = `
             [
               {
                 "alignItems": "center",
-                "backgroundColor": "#1AB77580",
+                "backgroundColor": "#2E3338",
                 "flexDirection": "row",
                 "flexGrow": 1,
                 "height": 48,
                 "justifyContent": "center",
-                "opacity": undefined,
+                "opacity": 0.25,
                 "paddingHorizontal": 24,
                 "paddingVertical": 5,
               },
@@ -1169,7 +1169,7 @@ exports[`SimplexScreen renders correctly 2`] = `
                 "color": "#FFFFFF",
                 "fontFamily": "Inter-SemiBold",
                 "fontSize": 16,
-                "lineHeight": 22,
+                "lineHeight": 24,
                 "marginLeft": 0,
                 "marginRight": 0,
               }
diff --git a/src/points/PointsHome.tsx b/src/points/PointsHome.tsx
index 35375325d66..b264532cdf3 100644
--- a/src/points/PointsHome.tsx
+++ b/src/points/PointsHome.tsx
@@ -145,7 +145,6 @@ export default function PointsHome({ route, navigation }: Props) {
                 onPress={onPressActivity}
                 text={t('points.activity')}
                 type={BtnTypes.GRAY_WITH_BORDER}
-                fontStyle={typeScale.labelXSmall}
                 size={BtnSizes.FULL}
                 touchableStyle={styles.buttonStyle}
               />
diff --git a/src/send/EnterAmount.tsx b/src/send/EnterAmount.tsx
index c9fdc798041..bf2c072dc8b 100644
--- a/src/send/EnterAmount.tsx
+++ b/src/send/EnterAmount.tsx
@@ -98,7 +98,6 @@ export const SendProceed = ({
       text={t('review')}
       style={styles.reviewButton}
       size={BtnSizes.FULL}
-      fontStyle={styles.reviewButtonText}
       disabled={disabled}
       testID="SendEnterAmount/ReviewButton"
     />
@@ -650,9 +649,6 @@ const styles = StyleSheet.create({
   reviewButton: {
     paddingVertical: Spacing.Thick24,
   },
-  reviewButtonText: {
-    ...typeScale.labelSemiBoldMedium,
-  },
   warning: {
     marginBottom: Spacing.Regular16,
     paddingHorizontal: Spacing.Regular16,
diff --git a/src/send/__snapshots__/SendConfirmation.test.tsx.snap b/src/send/__snapshots__/SendConfirmation.test.tsx.snap
index 552c82bef98..43041609ae1 100644
--- a/src/send/__snapshots__/SendConfirmation.test.tsx.snap
+++ b/src/send/__snapshots__/SendConfirmation.test.tsx.snap
@@ -711,12 +711,12 @@ exports[`SendConfirmation renders correctly 1`] = `
               [
                 {
                   "alignItems": "center",
-                  "backgroundColor": "#1AB775",
+                  "backgroundColor": "#2E3338",
                   "flexDirection": "row",
                   "flexGrow": 1,
                   "height": 48,
                   "justifyContent": "center",
-                  "opacity": undefined,
+                  "opacity": 1,
                   "paddingHorizontal": 24,
                   "paddingVertical": 5,
                 },
@@ -733,7 +733,7 @@ exports[`SendConfirmation renders correctly 1`] = `
                   "color": "#FFFFFF",
                   "fontFamily": "Inter-SemiBold",
                   "fontSize": 16,
-                  "lineHeight": 22,
+                  "lineHeight": 24,
                   "marginLeft": 0,
                   "marginRight": 0,
                 }
diff --git a/src/send/__snapshots__/ValidateRecipientAccount.test.tsx.snap b/src/send/__snapshots__/ValidateRecipientAccount.test.tsx.snap
index e929b823b3a..ec246e110c1 100644
--- a/src/send/__snapshots__/ValidateRecipientAccount.test.tsx.snap
+++ b/src/send/__snapshots__/ValidateRecipientAccount.test.tsx.snap
@@ -188,12 +188,12 @@ exports[`ValidateRecipientAccount renders correctly when full validation require
                 [
                   {
                     "alignItems": "center",
-                    "backgroundColor": "#1AB77580",
+                    "backgroundColor": "#2E3338",
                     "flexDirection": "row",
                     "height": 48,
                     "justifyContent": "center",
                     "minWidth": 120,
-                    "opacity": undefined,
+                    "opacity": 0.25,
                     "paddingHorizontal": 24,
                     "paddingVertical": 5,
                   },
@@ -209,7 +209,7 @@ exports[`ValidateRecipientAccount renders correctly when full validation require
                     "color": "#FFFFFF",
                     "fontFamily": "Inter-SemiBold",
                     "fontSize": 16,
-                    "lineHeight": 22,
+                    "lineHeight": 24,
                     "marginLeft": 0,
                     "marginRight": 0,
                   }
@@ -689,12 +689,12 @@ exports[`ValidateRecipientAccount renders correctly when partial validation requ
                 [
                   {
                     "alignItems": "center",
-                    "backgroundColor": "#1AB77580",
+                    "backgroundColor": "#2E3338",
                     "flexDirection": "row",
                     "height": 48,
                     "justifyContent": "center",
                     "minWidth": 120,
-                    "opacity": undefined,
+                    "opacity": 0.25,
                     "paddingHorizontal": 24,
                     "paddingVertical": 5,
                   },
@@ -710,7 +710,7 @@ exports[`ValidateRecipientAccount renders correctly when partial validation requ
                     "color": "#FFFFFF",
                     "fontFamily": "Inter-SemiBold",
                     "fontSize": 16,
-                    "lineHeight": 22,
+                    "lineHeight": 24,
                     "marginLeft": 0,
                     "marginRight": 0,
                   }
diff --git a/src/tokens/TokenDetails.tsx b/src/tokens/TokenDetails.tsx
index 5741d8cddea..0cf63fbdb40 100644
--- a/src/tokens/TokenDetails.tsx
+++ b/src/tokens/TokenDetails.tsx
@@ -289,7 +289,6 @@ function Actions({
           size={BtnSizes.FULL}
           touchableStyle={styles.actionTouchable}
           testID={`TokenDetails/Action/${action.name}`}
-          fontStyle={typeScale.labelMedium}
         />
       ))}
     </View>