From 4d3fd4d8d3dd5311b0e64aaaeb1cff9381797eff Mon Sep 17 00:00:00 2001
From: Vinicius Souza <dev@viniciussouza.me>
Date: Fri, 25 Oct 2024 14:58:27 -0300
Subject: [PATCH] feat: create exercise card component

---
 src/components/ExerciseCard.tsx | 35 +++++++++++++++++++++++++++++++++
 1 file changed, 35 insertions(+)
 create mode 100644 src/components/ExerciseCard.tsx

diff --git a/src/components/ExerciseCard.tsx b/src/components/ExerciseCard.tsx
new file mode 100644
index 0000000..10f2983
--- /dev/null
+++ b/src/components/ExerciseCard.tsx
@@ -0,0 +1,35 @@
+import { TouchableOpacity, TouchableOpacityProps } from 'react-native';
+import { Heading, HStack, Icon, Image, Text, VStack } from '@gluestack-ui/themed';
+import { ChevronRight } from 'lucide-react-native';
+
+type Props = TouchableOpacityProps;
+
+export function ExerciseCard({ ...others }: Props) {
+  return (
+    <TouchableOpacity {...others}>
+      <HStack bg="$gray500" alignItems="center" p="$2" pr="$4" rounded="$md" mb="$3">
+        <Image
+          source={{ uri: 'https://i.pravatar.cc/200' }}
+          alt="imagem do exercício"
+          h="$16"
+          w="$16"
+          rounded="$md"
+          mr="$4"
+          resizeMode="cover"
+        />
+
+        <VStack flex={1}>
+          <Heading color="white" fontSize="$lg">
+            Puxada Frontal
+          </Heading>
+
+          <Text fontSize="$sm" color="$gray200" mt="$1" numberOfLines={2}>
+            3 séries de 12 repetições with a really big line
+          </Text>
+        </VStack>
+
+        <Icon as={ChevronRight} color="$gray300" />
+      </HStack>
+    </TouchableOpacity>
+  );
+}