You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
Mobile/components/WorkoutCardComponent.tsx

45 lines
2.1 KiB

import {ImageBackground, SafeAreaView,Text, TouchableOpacity, View} from "react-native";
import React from "react";
import {AntDesign} from "@expo/vector-icons";
export default function WorkoutCardComponent() {
return (
<SafeAreaView>
<View>
<View className="rounded-2xl overflow-hidden shadow-lg h-72">
<ImageBackground
source={require("assets/images/Sigma-2.jpg")}
className="w-full h-full"
resizeMode="cover"
>
<View className="flex-row justify-between items-center p-4">
<View className="flex-row space-x-4">
<View className="flex-row items-center">
<Text className="text-white text-sm ml-1">25min</Text>
</View>
<View className="flex-row items-center">
<Text className="text-white text-sm ml-1">412kcal</Text>
</View>
</View>
</View>
<View className="absolute bottom-0 left-0 right-0 p-4 bg-black bg-opacity-50">
<Text className="text-white text-lg font-bold">Faire caca par Terre</Text>
<Text className="text-gray-300 text-sm">8 Series Workout</Text>
<View className="flex-row items-center mt-2">
<Text className="text-white text-xs bg-gray-800 py-1 px-3 rounded-full">
Intense
</Text>
</View>
</View>
<TouchableOpacity className="absolute bottom-4 right-4 p-4 rounded-full">
<AntDesign name="play" size={24} color="white" />
</TouchableOpacity>
</ImageBackground>
</View>
</View>
</SafeAreaView>
);
}