import React from 'react'; import {View, StyleSheet, Text, TouchableWithoutFeedback} from 'react-native'; import Icon from 'react-native-vector-icons/Feather'; import {StackNavigationProp} from '@react-navigation/stack'; import {RootStackParamList} from 'App/App'; import Header from '../components/Header'; import {useTranslation} from 'react-i18next'; import {BottomMenu} from '../components/BottomMenu'; const styles = StyleSheet.create({ container: { flex: 1, padding: 16, paddingTop: 8, backgroundColor: '#ffffff', }, header: { fontSize: 18, padding: 5, paddingTop: 64, paddingBottom: 50, color: '#595959', fontFamily: 'Ubuntu-R', lineHeight: 26, }, arrowRightIcon: { right: 16, top: 16, fontSize: 20, color: '#2c2c2c', position: 'absolute', }, buttonSymptoms: { borderRadius: 8, backgroundColor: '#91e6d3', padding: 20, marginBottom: 32, fontFamily: 'Ubuntu-R', }, buttonSymptomsTitle: { color: '#2c2c2c', letterSpacing: 1.5, textTransform: 'uppercase', fontSize: 14, marginBottom: 8, fontFamily: 'Ubuntu-M', justifyContent: 'space-between', }, buttonTested: { borderRadius: 8, backgroundColor: '#91e6d3', padding: 20, fontFamily: 'Ubuntu-R', }, buttonTestedTitle: { color: '#2c2c2c', letterSpacing: 1.5, textTransform: 'uppercase', fontSize: 14, marginBottom: 8, fontFamily: 'Ubuntu-M', }, }); type EndangermentScreenNavigationProp = StackNavigationProp< RootStackParamList, 'Endangerment' >; export const Endangerment: React.FC<{ navigation: EndangermentScreenNavigationProp; }> = ({navigation}) => { const {t} = useTranslation(); return ( <View style={styles.container}> <Header navigationButton={{ title: t('global.cancel'), fn: (): void => navigation.goBack(), }} /> <Text style={styles.header}>{t('endangerment.info')}</Text> <TouchableWithoutFeedback onPress={(): void => navigation.navigate('SymptomInfo')}> <View style={styles.buttonSymptoms}> <Text style={styles.buttonSymptomsTitle}> {t('endangerment.symptomsTitle')} </Text> <Icon name="arrow-right" size={18} style={styles.arrowRightIcon} /> <Text>{t('endangerment.symptomsText')}</Text> </View> </TouchableWithoutFeedback> <TouchableWithoutFeedback onPress={(): void => navigation.navigate('AlphaPositiveResult')}> <View style={styles.buttonTested}> <Text style={styles.buttonTestedTitle}> {t('endangerment.positiveResultTitle')} </Text> <Icon name="arrow-right" size={18} style={styles.arrowRightIcon} /> <Text>{t('endangerment.positiveResultText')}</Text> </View> </TouchableWithoutFeedback> <BottomMenu navigation={navigation} activate="Infected?"></BottomMenu> </View> ); }; export default Endangerment;