export default function WelcomeScreen() {
  //declare variables
  const [firstName, onChangeFirstName] = React.useState('');
  const [lastName, onChangeLastName] = React.useState('');
  const [phoneNumber, onChangePhoneNumber] = React.useState('');
  const [message, onChangeMessage] = React.useState('');

  return (
    <KeyboardAvoidingView
      style={styles.container}
      behavior={Platform.OS === "ios" ? "padding" : "height"}>
      <ScrollView indicatorStyle="white" keyboardDismissMode="on-drag">
        <Text style={styles.headerText}>Welcome to Little Lemon</Text>
        <Text style={styles.regularText}>
          Little Lemon is a charming neighborhood bistro that serves simple food
          and classic cocktails in a lively but casual environment. We would
          love to hear more about your experience with us!
        </Text>
        <TextInput
          style={styles.input}
          placeholder="First Name"
          onChangeText={onChangeFirstName}
          value={firstName}
          placeholderTextColor="grey"
        />
        ...
      </ScrollView>
    </KeyboardAvoidingView>
  );
}