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.
51 lines
2.5 KiB
51 lines
2.5 KiB
import {ImageBackground, SafeAreaView,Text, TouchableOpacity, View} from "react-native";
|
|
import React from "react";
|
|
import {AntDesign, MaterialCommunityIcons} from "@expo/vector-icons";
|
|
import {Workout} from "@/model/Workout";
|
|
|
|
export default function WorkoutCardComponent() {
|
|
|
|
const exercise = new Workout("Développé couché", 25,"8 Series Workout", 412, "assets/images/Sigma-2.jpg","Intense" );
|
|
|
|
|
|
|
|
return (
|
|
<View>
|
|
<View className="rounded-2xl overflow-hidden shadow-lg h-72">
|
|
|
|
<ImageBackground
|
|
source={require("assets/images/Sigma-2.jpg")}
|
|
className="w-full h-full"
|
|
>
|
|
<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">{exercise.duration} min</Text>
|
|
</View>
|
|
<View className="justify-center ml-0.5">
|
|
<MaterialCommunityIcons name="square-rounded" size={8}color="white" />
|
|
</View>
|
|
<View className="flex-row items-center">
|
|
<Text className="text-white text-sm ml-1">{exercise.calories} kcal</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">{exercise.name}</Text>
|
|
<Text className="text-gray-300 text-sm">{exercise.repetitions}</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-2 right-4 p-4 rounded-full">
|
|
<AntDesign name="play" size={50} color="orange" />
|
|
</TouchableOpacity>
|
|
</ImageBackground>
|
|
</View>
|
|
</View>
|
|
);
|
|
} |