From 9c03fa0d64370c44e74cda55d097d112728833e9 Mon Sep 17 00:00:00 2001
From: tapframe <nayifveliya99@gmail.com>
Date: Sat, 21 Jun 2025 16:25:00 +0530
Subject: [PATCH] Refactor CatalogSection and related components for improved
 button styling and layout consistency

This update modifies the CatalogSection, ThisWeekSection, and home CatalogSection components by enhancing button styles, including updated background colors, text visibility, and padding. The button text has been changed to "View All" with a new icon for better clarity. Additionally, margin adjustments have been made to ensure a more cohesive layout across sections.
---
 src/components/discover/CatalogSection.tsx | 16 +++++++++-------
 src/components/home/CatalogSection.tsx     |  1 +
 src/components/home/ThisWeekSection.tsx    |  1 +
 3 files changed, 11 insertions(+), 7 deletions(-)

diff --git a/src/components/discover/CatalogSection.tsx b/src/components/discover/CatalogSection.tsx
index 68b025154..72cb381e4 100644
--- a/src/components/discover/CatalogSection.tsx
+++ b/src/components/discover/CatalogSection.tsx
@@ -64,11 +64,11 @@ const CatalogSection = ({ catalog, selectedCategory }: CatalogSectionProps) => {
         </View>
         <TouchableOpacity
           onPress={handleSeeMorePress}
-          style={styles.seeAllButton}
+          style={[styles.seeAllButton, { backgroundColor: 'rgba(255,255,255,0.1)' }]}
           activeOpacity={0.6}
         >
-          <Text style={[styles.seeAllText, { color: currentTheme.colors.primary }]}>See All</Text>
-          <MaterialIcons name="arrow-forward-ios" color={currentTheme.colors.primary} size={14} />
+          <Text style={[styles.seeAllText, { color: currentTheme.colors.textMuted }]}>View All</Text>
+          <MaterialIcons name="chevron-right" size={20} color={currentTheme.colors.textMuted} />
         </TouchableOpacity>
       </View>
       
@@ -119,13 +119,15 @@ const styles = StyleSheet.create({
   seeAllButton: {
     flexDirection: 'row',
     alignItems: 'center',
-    gap: 4,
-    paddingVertical: 6,
-    paddingHorizontal: 4,
+    paddingVertical: 8,
+    paddingHorizontal: 10,
+    borderRadius: 20,
+    marginRight: -10,
   },
   seeAllText: {
-    fontWeight: '600',
     fontSize: 14,
+    fontWeight: '600',
+    marginRight: 4,
   },
 });
 
diff --git a/src/components/home/CatalogSection.tsx b/src/components/home/CatalogSection.tsx
index 2b0430838..0f13a2d13 100644
--- a/src/components/home/CatalogSection.tsx
+++ b/src/components/home/CatalogSection.tsx
@@ -159,6 +159,7 @@ const styles = StyleSheet.create({
     paddingHorizontal: 10,
     borderRadius: 20,
     backgroundColor: 'rgba(255,255,255,0.1)',
+    marginRight: -10,
   },
   viewAllText: {
     fontSize: 14,
diff --git a/src/components/home/ThisWeekSection.tsx b/src/components/home/ThisWeekSection.tsx
index c6e5505ca..167a54cf3 100644
--- a/src/components/home/ThisWeekSection.tsx
+++ b/src/components/home/ThisWeekSection.tsx
@@ -325,6 +325,7 @@ const styles = StyleSheet.create({
     paddingHorizontal: 10,
     borderRadius: 20,
     backgroundColor: 'rgba(255,255,255,0.1)',
+    marginRight: -10,
   },
   viewAllText: {
     fontSize: 14,