fix: Workspace Invitepage styles

Expensify · Oct 15, 2021 · f66dd56 · f66dd56
1 parent 739cc4e
commit f66dd56
Show file tree

Hide file tree

Showing 3 changed files with 11 additions and 4 deletions.
diff --git a/src/components/FormAlertWithSubmitButton.js b/src/components/FormAlertWithSubmitButton.js
@@ -34,13 +34,17 @@ const propTypes = {
     /** Whether message is in html format */
     isMessageHtml: PropTypes.bool,
 
+    /** Styles for container element */
+    containerStyles: PropTypes.arrayOf(PropTypes.object),
+
     ...withLocalizePropTypes,
 };
 
 const defaultProps = {
     message: '',
     isDisabled: false,
     isMessageHtml: false,
+    containerStyles: [],
 };
 
 const FormAlertWithSubmitButton = ({
@@ -52,6 +56,7 @@ const FormAlertWithSubmitButton = ({
     onFixTheErrorsLinkPressed,
     message,
     isMessageHtml,
+    containerStyles,
 }) => {
     /**
      * @returns {React.Component}
@@ -96,7 +101,7 @@ const FormAlertWithSubmitButton = ({
     }
 
     return (
-        <View style={[styles.mh5, styles.mb5, styles.flex1, styles.justifyContentEnd]}>
+        <View style={[styles.mh5, styles.mb5, styles.flex1, styles.justifyContentEnd, ...containerStyles]}>
             {isAlertVisible && (
                 <View style={[styles.flexRow, styles.alignItemsCenter, styles.mb3]}>
                     <Icon src={Exclamation} fill={colors.red} />

diff --git a/src/pages/workspace/WorkspaceInvitePage.js b/src/pages/workspace/WorkspaceInvitePage.js
@@ -257,7 +257,7 @@ class WorkspaceInvitePage extends React.Component {
                             shouldShowBackButton
                             onBackButtonPress={() => Navigation.goBack()}
                         />
-                        <View style={styles.flex1}>
+                        <View style={[styles.flex1]}>
                             <FullScreenLoadingIndicator visible={!didScreenTransitionEnd} />
                             {didScreenTransitionEnd && (
                                 <OptionsSelector
@@ -293,14 +293,15 @@ class WorkspaceInvitePage extends React.Component {
                             )}
                         </View>
                         <View style={[styles.flexShrink0]}>
-                            <View style={[styles.ph5, styles.pv3, styles.pb3, styles.flexGrow1, styles.flexShrink0]}>
+                            <View style={[styles.ph5, styles.pv3]}>
                                 <ExpensiTextInput
                                     label={this.props.translate('workspace.invite.personalMessagePrompt')}
                                     autoCompleteType="off"
                                     autoCorrect={false}
                                     numberOfLines={3}
                                     textAlignVertical="top"
                                     multiline
+                                    containerStyles={[styles.workspaceInviteWelcome]}
                                     value={this.state.welcomeNote}
                                     placeholder={this.getWelcomeNotePlaceholder()}
                                     onChangeText={text => this.setState({welcomeNote: text})}
@@ -313,6 +314,7 @@ class WorkspaceInvitePage extends React.Component {
                                 onSubmit={this.inviteUser}
                                 onFixTheErrorsLinkPressed={() => {}}
                                 message={this.props.policy.alertMessage}
+                                containerStyles={[styles.flex0, styles.flexShrink0, styles.flexBasisAuto]}
                             />
                         </View>
                     </KeyboardAvoidingView>

diff --git a/src/styles/styles.js b/src/styles/styles.js
@@ -1958,7 +1958,7 @@ const styles = {
     },
 
     workspaceInviteWelcome: {
-        height: 150,
+        minHeight: 100,
     },
 
     peopleRow: {