101 lines
2.3 KiB
TypeScript
101 lines
2.3 KiB
TypeScript
import React from 'react';
|
|
import {StyleSheet, View} from 'react-native';
|
|
import {Button, Text, Surface} from 'react-native-paper';
|
|
import type {HomeScreenProps} from '../types/navigation';
|
|
import {DTColors} from '../theme';
|
|
|
|
export function HomeScreen({navigation}: HomeScreenProps) {
|
|
return (
|
|
<View style={styles.container}>
|
|
<Surface style={styles.header} elevation={0}>
|
|
<Text variant="displaySmall" style={styles.title}>
|
|
DANGEROUS THINGS
|
|
</Text>
|
|
<Text variant="headlineSmall" style={styles.subtitle}>
|
|
NFC IDENTIFIER
|
|
</Text>
|
|
</Surface>
|
|
|
|
<View style={styles.content}>
|
|
<Text variant="bodyLarge" style={styles.description}>
|
|
Scan any NFC transponder to find compatible Dangerous Things implants.
|
|
</Text>
|
|
|
|
<Button
|
|
mode="outlined"
|
|
onPress={() => navigation.navigate('Scan')}
|
|
style={styles.scanButton}
|
|
labelStyle={styles.scanButtonLabel}
|
|
contentStyle={styles.scanButtonContent}>
|
|
START SCAN
|
|
</Button>
|
|
</View>
|
|
|
|
<View style={styles.footer}>
|
|
<Text variant="bodySmall" style={styles.footerText}>
|
|
dngr.us
|
|
</Text>
|
|
</View>
|
|
</View>
|
|
);
|
|
}
|
|
|
|
const styles = StyleSheet.create({
|
|
container: {
|
|
flex: 1,
|
|
backgroundColor: DTColors.dark,
|
|
padding: 24,
|
|
},
|
|
header: {
|
|
alignItems: 'center',
|
|
paddingTop: 60,
|
|
paddingBottom: 40,
|
|
backgroundColor: 'transparent',
|
|
},
|
|
title: {
|
|
color: DTColors.modeNormal,
|
|
fontWeight: '700',
|
|
letterSpacing: 2,
|
|
},
|
|
subtitle: {
|
|
color: DTColors.modeEmphasis,
|
|
marginTop: 8,
|
|
letterSpacing: 4,
|
|
},
|
|
content: {
|
|
flex: 1,
|
|
justifyContent: 'center',
|
|
alignItems: 'center',
|
|
},
|
|
description: {
|
|
color: DTColors.light,
|
|
textAlign: 'center',
|
|
marginBottom: 48,
|
|
opacity: 0.9,
|
|
paddingHorizontal: 20,
|
|
},
|
|
scanButton: {
|
|
borderColor: DTColors.modeNormal,
|
|
borderWidth: 2,
|
|
borderRadius: 4,
|
|
},
|
|
scanButtonLabel: {
|
|
color: DTColors.modeNormal,
|
|
fontSize: 18,
|
|
fontWeight: '600',
|
|
letterSpacing: 2,
|
|
},
|
|
scanButtonContent: {
|
|
paddingVertical: 12,
|
|
paddingHorizontal: 32,
|
|
},
|
|
footer: {
|
|
alignItems: 'center',
|
|
paddingBottom: 20,
|
|
},
|
|
footerText: {
|
|
color: DTColors.modeNormal,
|
|
opacity: 0.6,
|
|
},
|
|
});
|