line up CTA button with menu item

Expensify · Aug 25, 2022 · c4217b7 · c4217b7
1 parent e9c4bfb
commit c4217b7
Show file tree

Hide file tree

Showing 9 changed files with 14 additions and 10 deletions.
diff --git a/src/pages/ReimbursementAccount/BankAccountStep.js b/src/pages/ReimbursementAccount/BankAccountStep.js
@@ -228,7 +228,7 @@ class BankAccountStep extends React.Component {
                             onPress={() => BankAccounts.setBankAccountSubStep(CONST.BANK_ACCOUNT.SETUP_TYPE.PLAID)}
                             disabled={this.props.isPlaidDisabled || !validated}
                             style={[styles.mt5, styles.buttonCTA]}
-                            iconStyles={[styles.mr5]}
+                            iconStyles={[styles.buttonCTAIcon]}
                             shouldShowRightIcon
                             success
                             large

diff --git a/src/pages/ReimbursementAccount/ValidationStep.js b/src/pages/ReimbursementAccount/ValidationStep.js
@@ -245,7 +245,7 @@ class ValidationStep extends React.Component {
                             onPress={Report.navigateToConciergeChat}
                             icon={Expensicons.ChatBubble}
                             style={[styles.mt4, styles.buttonCTA]}
-                            iconStyles={[styles.mr5]}
+                            iconStyles={[styles.buttonCTAIcon]}
                             shouldShowRightIcon
                             large
                             success

diff --git a/src/pages/settings/Payments/PaymentMethodList.js b/src/pages/settings/Payments/PaymentMethodList.js
@@ -157,7 +157,7 @@ class PaymentMethodList extends Component {
             text: this.props.translate('paymentMethodList.addPaymentMethod'),
             icon: Expensicons.CreditCard,
             style: [styles.buttonCTA],
-            iconStyles: [styles.mr4],
+            iconStyles: [styles.buttonCTAIcon],
             onPress: e => this.props.onPress(e),
             isDisabled: this.props.isLoadingPayments,
             shouldShowRightIcon: true,

diff --git a/src/pages/workspace/WorkspaceBankAccountPage.js b/src/pages/workspace/WorkspaceBankAccountPage.js
@@ -123,7 +123,7 @@ class WorkspaceBankAccountPage extends React.Component {
                             onPress={this.navigateToBankAccountRoute}
                             icon={Expensicons.Bank}
                             style={[styles.mt2, styles.buttonCTA]}
-                            iconStyles={[styles.mr5]}
+                            iconStyles={[styles.buttonCTAIcon]}
                             shouldShowRightIcon
                             large
                             success

diff --git a/src/pages/workspace/bills/WorkspaceBillsNoVBAView.js b/src/pages/workspace/bills/WorkspaceBillsNoVBAView.js
@@ -35,7 +35,7 @@ const WorkspaceBillsNoVBAView = props => (
                 onPress={() => Navigation.navigate(ROUTES.getWorkspaceBankAccountRoute(props.policyID))}
                 icon={Expensicons.Bank}
                 style={[styles.mt4]}
-                iconStyles={[styles.mr5]}
+                iconStyles={[styles.buttonCTAIcon]}
                 shouldShowRightIcon
                 large
                 success

diff --git a/src/pages/workspace/invoices/WorkspaceInvoicesNoVBAView.js b/src/pages/workspace/invoices/WorkspaceInvoicesNoVBAView.js
@@ -35,7 +35,7 @@ const WorkspaceInvoicesNoVBAView = props => (
                 onPress={() => Navigation.navigate(ROUTES.getWorkspaceBankAccountRoute(props.policyID))}
                 icon={Expensicons.Bank}
                 style={[styles.mt4]}
-                iconStyles={[styles.mr5]}
+                iconStyles={[styles.buttonCTAIcon]}
                 shouldShowRightIcon
                 large
                 success

diff --git a/src/pages/workspace/reimburse/WorkspaceReimburseView.js b/src/pages/workspace/reimburse/WorkspaceReimburseView.js
@@ -204,7 +204,7 @@ class WorkspaceReimburseView extends React.Component {
                             onPress={() => Navigation.navigate(ROUTES.getWorkspaceBankAccountRoute(this.props.policyID))}
                             icon={Expensicons.Bank}
                             style={[styles.mt4]}
-                            iconStyles={[styles.mr5]}
+                            iconStyles={[styles.buttonCTAIcon]}
                             shouldShowRightIcon
                             large
                             success

diff --git a/src/pages/workspace/travel/WorkspaceTravelNoVBAView.js b/src/pages/workspace/travel/WorkspaceTravelNoVBAView.js
@@ -32,7 +32,7 @@ const WorkspaceTravelNoVBAView = props => (
                 onPress={() => Navigation.navigate(ROUTES.getWorkspaceBankAccountRoute(props.policyID))}
                 icon={Expensicons.Bank}
                 style={[styles.mt4]}
-                iconStyles={[styles.mr5]}
+                iconStyles={[styles.buttonCTAIcon]}
                 shouldShowRightIcon
                 large
                 success

diff --git a/src/styles/styles.js b/src/styles/styles.js
@@ -381,9 +381,9 @@ const styles = {
         borderRadius: variables.componentBorderRadius,
         height: variables.componentSizeLarge,
         paddingTop: 8,
-        paddingRight: 12,
+        paddingRight: 14,
         paddingBottom: 8,
-        paddingLeft: 12,
+        paddingLeft: 14,
         backgroundColor: themeColors.buttonDefaultBG,
     },
 
@@ -461,6 +461,10 @@ const styles = {
         ...spacing.mh4,
     },
 
+    buttonCTAIcon: {
+        marginRight: 22,
+    },
+
     buttonConfirm: {
         margin: 20,
     },