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 68b02515..72cb381e 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 2b043083..0f13a2d1 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 c6e5505c..167a54cf 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,