import * as React from 'react';
import { Pressable, View, Text, Image, StyleSheet, ImageBackground } from 'react-native';
import { createStackNavigator } from '@react-navigation/stack';

const Stack = createStackNavigator();
const styles = StyleSheet.create({
  viewStyleVertical : { alignItems: 'center', justifyContent: 'center', margin: '10%' },
  viewStyleHorizon : { flex: 1, flexDirection: 'row', justifyContent: 'space-between'},
  pressableStyle : {flex: 1, flexDirection: 'row', justifyContent: 'space-between', backgroundColor:'lavender', paddingHorizontal:20, 
  paddingVertical:10, borderColor:'thistle', borderWidth:2, borderRadius:5, marginHorizontal: 10, marginTop: 10},
  image: { flex: 1, resizeMode: "cover", justifyContent: "center"},
  container : {flex: 1},
  textBox : {flex: 1, marginTop: 20, backgroundColor:'white', borderColor:'black', borderWidth:2, borderRadius:5, 
  marginHorizontal: 10, paddingVertical:10, paddingHorizontal: 50, alignItems: 'flex-start'}
});

const Unfound = (props) => {
    const dataFile = props.data
    const navigation = dataFile['navi']
    return (
        <View style={styles.container}>
            <ImageBackground source={require('C:/Coding/cs242-assignment3/GitView/assets/ice.jpg')} style={styles.image}>
            <View style={styles.viewStyleVertical}>
                <Text style={{ fontSize: 30 }}> Error! Check log to see details </Text>
                <Image style={{width: 200, height: 200}} source={require('C:/Coding/cs242-assignment3/GitView/assets/warn.png')} />
                <Pressable  style={styles.pressableStyle} onPress={() => navigation.navigate('Home')}> 
                <Text> Go back to Home Page </Text>
                </Pressable>
            </View>
            </ImageBackground>
        </View>
    )
}

export default Unfound;