testing

src/components/JoinedGroupCard.tsx

@@ -4,7 +4,6 @@ import React, { FC } from 'react';
 import { View, Text, StyleSheet, TouchableOpacity } from 'react-native';
 import colors from './colors';
 import { useNavigation } from '@react-navigation/native';
-
 // Update the type to match the full data structure
 interface JoinedGroup {
   id: string;
@@ -80,8 +79,10 @@ export const JoinedGroupCard: FC<JoinedGroupCardProps> = ({ item, onViewPress })
       {/* Financial Info */}
       <View style={styles.infoRow}>
         <View style={styles.infoItem}>
-          <Text style={styles.infoLabel}>Contribution</Text>
-          <Text style={styles.infoValue}>₹{item.contributionAmount.toLocaleString('en-IN')}</Text>
+
+              <Text style={styles.infoLabel}>Contribution</Text>
+              <Text style={styles.infoValue}>₹{item.contributionAmount.toLocaleString('en-IN')}</Text>
+     
         </View>
         <View style={styles.infoItem}>
           <Text style={styles.infoLabel}>Cycle</Text>
@@ -89,25 +90,12 @@ export const JoinedGroupCard: FC<JoinedGroupCardProps> = ({ item, onViewPress })
         </View>
       </View>
 
-      {/* Participants Progress */}
-      <View style={styles.progressContainer}>
-        <View style={styles.progressLabels}>
-          <Text style={styles.participantText}>Participants</Text>
-          <Text style={styles.participantCount}>{item.currentParticipants} / {item.maxParticipants}</Text>
-        </View>
-        <View style={styles.progressBarBackground}>
-          <View style={[styles.progressBarFill, { width: `${progress}%` }]} />
-        </View>
-      </View>
-
       {/* Footer with Dates and View Button */}
       <View style={styles.footer}>
         <Text style={styles.dateText}>
             {formatDate(item.startDate)} - {formatDate(item.endDate)}
         </Text>
-        <TouchableOpacity style={styles.viewButton} onPress={onViewPress}>
-            <Text style={styles.viewButtonText}>View</Text>
-        </TouchableOpacity>
+
       </View>
     </TouchableOpacity>
   );
@@ -115,7 +103,7 @@ export const JoinedGroupCard: FC<JoinedGroupCardProps> = ({ item, onViewPress })
 
 const styles = StyleSheet.create({
   card: {
-    backgroundColor: '#FFFFFF',
+    backgroundColor:colors.pastelOrange,
     borderRadius: 16,
     padding: 20,
     marginBottom: 16,
@@ -123,7 +111,8 @@ const styles = StyleSheet.create({
     shadowOpacity: 0.08,
     shadowRadius: 10,
     shadowOffset: { width: 0, height: 4 },
-    elevation: 3,
+    elevation: 5,
+    marginHorizontal:12
   },
   header: {
     flexDirection: 'row',
@@ -160,8 +149,14 @@ const styles = StyleSheet.create({
     borderBottomWidth: 1,
     borderColor: colors.pastelOrange,
     marginBottom: 16,
+     backgroundColor:colors.white,
+        borderRadius:15,
   },
   infoItem: {
+    padding:5,
+    paddingHorizontal:10,
+ 
+    backgroundColor:colors.white,
     alignItems: 'flex-start',
   },
   infoLabel: {
@@ -207,10 +202,7 @@ const styles = StyleSheet.create({
     flexDirection: 'row',
     justifyContent: 'space-between',
     alignItems: 'center',
-    marginTop: 8,
-    borderTopWidth: 1,
-    borderTopColor: '#F3F4F6',
-    paddingTop: 16,
+
   },
   dateText: {
     fontSize: 14,