From a3e8e2e68affb7264e64efb9df032c326dc95907 Mon Sep 17 00:00:00 2001
From: aimane-chnaif <aiman.chnaif@gmail.com>
Date: Fri, 5 Aug 2022 10:33:31 -0600
Subject: [PATCH] fix page size changing after use wrong 2fa and clicking on
 Save button

---
 .../SignInPageLayout/SignInPageContent.js     | 82 ++++++++++---------
 1 file changed, 45 insertions(+), 37 deletions(-)

diff --git a/src/pages/signin/SignInPageLayout/SignInPageContent.js b/src/pages/signin/SignInPageLayout/SignInPageContent.js
index 4006d65a0093..522bccdcc13f 100755
--- a/src/pages/signin/SignInPageLayout/SignInPageContent.js
+++ b/src/pages/signin/SignInPageLayout/SignInPageContent.js
@@ -37,54 +37,62 @@ const SignInPageContent = props => (
         showsVerticalScrollIndicator={false}
         style={[
             styles.h100,
-            styles.alignSelfCenter,
+            !props.isSmallScreenWidth && styles.alignSelfCenter,
             !props.isSmallScreenWidth && styles.signInPageWideLeftContainer,
         ]}
         contentContainerStyle={[
             scrollViewContentContainerStyles,
+            styles.alignItemsCenter,
             !props.isSmallScreenWidth && styles.ph6,
         ]}
     >
-        <SignInPageForm style={[
-            styles.flex1,
-            styles.alignSelfStretch,
-            props.isSmallScreenWidth && styles.signInPageNarrowContentContainer,
-            props.isSmallScreenWidth ? styles.ph5 : styles.ph4,
-        ]}
-        >
-            <LoginKeyboardAvoidingView
-                behavior="position"
-                contentContainerStyle={[
-                    props.isSmallScreenWidth ? styles.signInPageNarrowContentMargin : {},
-                    !props.isMediumScreenWidth ? styles.signInPageWideLeftContentMargin : {},
-                    styles.mb3,
-                    StyleUtils.getModalPaddingStyles({
-                        shouldAddBottomSafeAreaPadding: true,
-                        modalContainerStylePaddingBottom: 20,
-                        safeAreaPaddingBottom: props.insets.bottom,
-                    }),
-                ]}
+        <View style={[styles.flex1, styles.flexRow]}>
+            <View style={[
+                styles.flex1,
+                props.isSmallScreenWidth && styles.signInPageNarrowContentContainer,
+            ]}
             >
-                <View style={[
-                    styles.componentHeightLarge,
-                    ...(props.isSmallScreenWidth ? [styles.mb2] : [styles.mt6, styles.mb5]),
+                <SignInPageForm style={[
+                    styles.flex1,
+                    styles.alignSelfStretch,
+                    props.isSmallScreenWidth ? styles.ph5 : styles.ph4,
                 ]}
                 >
-                    <ExpensifyCashLogo
-                        width={variables.componentSizeLarge}
-                        height={variables.componentSizeLarge}
-                    />
+                    <LoginKeyboardAvoidingView
+                        behavior="position"
+                        contentContainerStyle={[
+                            props.isSmallScreenWidth ? styles.signInPageNarrowContentMargin : {},
+                            !props.isMediumScreenWidth ? styles.signInPageWideLeftContentMargin : {},
+                            styles.mb3,
+                            StyleUtils.getModalPaddingStyles({
+                                shouldAddBottomSafeAreaPadding: true,
+                                modalContainerStylePaddingBottom: 20,
+                                safeAreaPaddingBottom: props.insets.bottom,
+                            }),
+                        ]}
+                    >
+                        <View style={[
+                            styles.componentHeightLarge,
+                            ...(props.isSmallScreenWidth ? [styles.mb2] : [styles.mt6, styles.mb5]),
+                        ]}
+                        >
+                            <ExpensifyCashLogo
+                                width={variables.componentSizeLarge}
+                                height={variables.componentSizeLarge}
+                            />
+                        </View>
+                        {props.shouldShowWelcomeText && (
+                            <Text style={[styles.mv5, styles.textLabel, styles.h3]}>
+                                {props.welcomeText}
+                            </Text>
+                        )}
+                        {props.children}
+                    </LoginKeyboardAvoidingView>
+                </SignInPageForm>
+                <View style={[styles.mb5, styles.alignSelfCenter, styles.ph5]}>
+                    <TermsAndLicenses />
                 </View>
-                {props.shouldShowWelcomeText && (
-                    <Text style={[styles.mv5, styles.textLabel, styles.h3]}>
-                        {props.welcomeText}
-                    </Text>
-                )}
-                {props.children}
-            </LoginKeyboardAvoidingView>
-        </SignInPageForm>
-        <View style={[styles.mb5, styles.alignSelfCenter, props.isSmallScreenWidth && styles.signInPageNarrowContentContainer, styles.ph5]}>
-            <TermsAndLicenses />
+            </View>
         </View>
     </ScrollView>
 );