import { createNativeStackNavigator } from "@react-navigation/native-stack";
import { createBottomTabNavigator } from "@react-navigation/bottom-tabs";
import { NavigationContainer } from "@react-navigation/native";
import { useNavigation } from "@react-navigation/native";
import React from "react";
import { View, Text, StyleSheet, TouchableOpacity, Linking} from "react-native";


const Formulario = () => {
    const currNav = useNavigation()
    return (
        <View>
            <Text
                style={{
                    fontSize: 30,
                    textAlign: "center",
                    marginTop: "20%"
                }}
            
            >Llenar formulario EPA y DRNA</Text>
    
            <TouchableOpacity style={styles.button}
            onPress={() => currNav.navigate("Drna")}>
                    <Text style={styles.text}>Formulario DRNA</Text>
            </TouchableOpacity>
            <TouchableOpacity style={styles.button}
            onPress={() => {
                            Linking.openURL("https://echo.epa.gov/denuncie-violaciones-ambientales");
                        }}>
                <Text style={styles.text}>Formulario EPA</Text>
            </TouchableOpacity>
        </View>
    )
}

export default Formulario

const styles = StyleSheet.create({
    button: {
      width:250,
      alignSelf: 'center',
      alignItems: 'center',
      justifyContent: 'center',
      paddingVertical: 12,
      paddingHorizontal: 32,
      borderRadius: 4,
      elevation: 3,
      backgroundColor: '#009688',
      marginTop: "5%"
    },
    text: {
      fontSize: 16,
      lineHeight: 21,
      fontWeight: 'bold',
      letterSpacing: 0.25,
      color: 'white',
    }
  })