// Example of Splash, Login and Sign Up in React Native
// https://aboutreact.com/react-native-login-and-signup/

// Import React and Component
import React from 'react';
import { StyleSheet, View, Text, TouchableOpacity, ImageBackground, SafeAreaView } from "react-native";
import { Entypo } from '@expo/vector-icons';

export function AboutUs({ navigation }) {
  //to diable the yellow box warning on the simulator

  return (
    // <SafeAreaView style={{flex: 1, color: 'yellow'}}>
    <View style={styles.container}>

            <ImageBackground source={require('../assets/gamification.jpg')} style={styles.images}>

        <View>
        <Text style={styles.topic}> About Us </Text>
        </View>

        <View style={styles.iconView}>

        <Entypo name="phone" size={50} color="black" />
        </View>
           
      <Text style={styles.heading}>
      What is Lorem Ipsum Lorem Ipsum is simply dummy text of the printing and 
      typesetting industry Lorem Ipsum has been the industry's standard dummy text ever
       since the 1500s when an unknown printer took a galley of type and 
       scrambled it to make a type specimen book it has?
      </Text>
      <Text style={styles.heading}>
      What is Lorem Ipsum Lorem Ipsum is simply dummy text of the printing and 
      typesetting industry Lorem Ipsum has been the industry's standard dummy text ever
       since the 1500s when an unknown printer took a galley of type and 
       scrambled it to make a type specimen book it has?
      </Text>
      <Text style={styles.heading2}>
          125, Galle road, colombo-3. 0775555555
        All Right Reserved.
      </Text>
      </ImageBackground>
    </View>
      // </SafeAreaView>
  );
}

const styles = StyleSheet.create({
  heading: {
    fontSize: 17,
    alignSelf: "center",
    marginTop: 10,
  },
  heading2: {
    fontSize: 15,
    alignSelf: "center",
    marginTop: 10,
  },
  buttonText: {
    color: "#000",
    fontSize: 15,
    marginLeft: 8
  },
  container: {
    
    backgroundColor: 'gray',
    justifyContent:"center"

  },
  topic: {
    textAlign: 'center',
    color: '#333',
    fontWeight: 'bold',
    padding: 10,
    fontSize: 18,
    marginTop:15
  },
  iconView:{
    alignSelf: 'center',
  },
  images:{
    height: '100%',
    justifyContent: 'center'
  }
});

