Gestion dynamique de l'affichage du défi

This commit is contained in:
2024-12-12 19:33:44 +01:00
parent 291e7ff8a7
commit ac20baad23
4 changed files with 56 additions and 26 deletions

View File

@ -0,0 +1,30 @@
import { Challenge } from "@/utils/features/challenges/challengesSlice"
import { FontAwesome6 } from "@expo/vector-icons"
import { View } from "react-native"
import { Button, Surface, Text } from "react-native-paper"
export default function ChallengeCard({ challenge }: { challenge: Challenge }) {
return (
<Surface elevation={2} style={{ flex: 1, margin: 20, borderRadius: 20 }}>
<View style={{ padding: 10 }}>
<Text variant='headlineMedium' style={{ textAlign: 'center' }}>{challenge.title}</Text>
</View>
<View style={{ flexGrow: 1 }}>
<Surface elevation={5} mode='flat' style={{ flexGrow: 1, padding: 15 }}>
<Text variant='bodyLarge' style={{ flexGrow: 1 }}>{challenge.description}</Text>
<Text variant='titleMedium'>
Récompense : {challenge.reward} <FontAwesome6 name='coins' />
</Text>
</Surface>
</View>
<View style={{ flexWrap: 'wrap', flexDirection: 'row', justifyContent: 'space-around', padding: 15 }}>
<Button mode='outlined' icon='cancel'>
Passer
</Button>
<Button mode='contained' icon='check'>
Terminer
</Button>
</View>
</Surface>
)
}