moved EtaCard
This commit is contained in:
54
frontend/src/components/EtaCard.tsx
Normal file
54
frontend/src/components/EtaCard.tsx
Normal file
@@ -0,0 +1,54 @@
|
|||||||
|
import { View, Text, StyleSheet } from 'react-native';
|
||||||
|
import { Colors } from '../constants/theme';
|
||||||
|
|
||||||
|
type EtaCardProps = {
|
||||||
|
minutes?: number;
|
||||||
|
status?: string;
|
||||||
|
};
|
||||||
|
|
||||||
|
export default function EtaCard({
|
||||||
|
minutes = 12,
|
||||||
|
status = 'En Camino',
|
||||||
|
}: EtaCardProps) {
|
||||||
|
|
||||||
|
const theme = Colors.light;
|
||||||
|
|
||||||
|
return (
|
||||||
|
<View style={[styles.card, { backgroundColor: theme.backgroundElement }]}>
|
||||||
|
|
||||||
|
<Text style={[styles.label, { color: theme.textSecondary }]}>
|
||||||
|
ETA estimado
|
||||||
|
</Text>
|
||||||
|
|
||||||
|
<Text style={[styles.time, { color: theme.text }]}>
|
||||||
|
{minutes} min
|
||||||
|
</Text>
|
||||||
|
|
||||||
|
<Text style={[styles.status, { color: theme.textSecondary }]}>
|
||||||
|
{status}
|
||||||
|
</Text>
|
||||||
|
|
||||||
|
</View>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
const styles = StyleSheet.create({
|
||||||
|
card: {
|
||||||
|
margin: 15,
|
||||||
|
padding: 20,
|
||||||
|
borderRadius: 16,
|
||||||
|
},
|
||||||
|
label: {
|
||||||
|
fontSize: 12,
|
||||||
|
marginBottom: 6,
|
||||||
|
},
|
||||||
|
time: {
|
||||||
|
fontSize: 32,
|
||||||
|
fontWeight: 'bold',
|
||||||
|
marginBottom: 6,
|
||||||
|
},
|
||||||
|
status: {
|
||||||
|
fontSize: 14,
|
||||||
|
fontWeight: '600',
|
||||||
|
},
|
||||||
|
});
|
||||||
Reference in New Issue
Block a user