From 2ef267a8973c018349fcef771c6fa97318f148f3 Mon Sep 17 00:00:00 2001
From: lafay <2021211506@stu.hit.edu.cn>
Date: Mon, 30 Mar 2026 18:01:32 +0800
Subject: [PATCH] refactor(TabBar, HomeScreen): update styles for improved UI
 consistency

- Adjusted TabBar styles for better shadow effects and padding.
- Modified HomeScreen layout margins and padding for enhanced spacing.
- Updated font weight for modernTabText to improve text visibility.
- Changed active opacity for tab interactions to enhance user experience.
---
 src/components/business/TabBar.tsx | 27 +++++++++++++++++----------
 src/screens/home/HomeScreen.tsx    |  6 +++---
 2 files changed, 20 insertions(+), 13 deletions(-)

diff --git a/src/components/business/TabBar.tsx b/src/components/business/TabBar.tsx
index ee3ce6d..9db9af7 100644
--- a/src/components/business/TabBar.tsx
+++ b/src/components/business/TabBar.tsx
@@ -135,26 +135,33 @@ function createTabBarStyles(colors: AppColors) {
     modernContainer: {
       flexDirection: 'row',
       backgroundColor: colors.background.paper,
-      borderRadius: borderRadius.xl,
+      borderRadius: borderRadius['2xl'],
       marginHorizontal: spacing.lg,
-      marginVertical: spacing.md,
+      marginVertical: spacing.sm,
       padding: spacing.xs,
       shadowColor: colors.chat.shadow,
-      shadowOffset: { width: 0, height: 2 },
-      shadowOpacity: 0.08,
-      shadowRadius: 8,
-      elevation: 3,
+      shadowOffset: { width: 0, height: 4 },
+      shadowOpacity: 0.1,
+      shadowRadius: 16,
+      elevation: 6,
     },
     modernTab: {
       flex: 1,
       alignItems: 'center',
       justifyContent: 'center',
-      paddingVertical: spacing.sm,
+      paddingVertical: spacing.md,
+      paddingHorizontal: spacing.sm,
       borderRadius: borderRadius.lg,
       position: 'relative',
+      backgroundColor: 'transparent',
     },
     modernTabActive: {
-      backgroundColor: colors.primary.main + '15',
+      backgroundColor: colors.primary.main + '12',
+      shadowColor: colors.primary.main + '20',
+      shadowOffset: { width: 0, height: 2 },
+      shadowOpacity: 0.1,
+      shadowRadius: 8,
+      elevation: 3,
     },
     modernTabContent: {
       flexDirection: 'row',
@@ -165,7 +172,7 @@ function createTabBarStyles(colors: AppColors) {
       marginRight: spacing.xs,
     },
     modernTabText: {
-      fontWeight: '500',
+      fontWeight: '600',
       fontSize: fontSizes.md,
     },
     modernTabTextActive: {
@@ -206,7 +213,7 @@ const TabBar: React.FC<TabBarProps> = ({
             key={index}
             style={[styles.modernTab, isActive && styles.modernTabActive]}
             onPress={() => onTabChange(index)}
-            activeOpacity={0.85}
+            activeOpacity={0.7}
           >
             <View style={styles.modernTabContent}>
               {icon && (
diff --git a/src/screens/home/HomeScreen.tsx b/src/screens/home/HomeScreen.tsx
index 04f815d..7d8a973 100644
--- a/src/screens/home/HomeScreen.tsx
+++ b/src/screens/home/HomeScreen.tsx
@@ -67,7 +67,7 @@ function createHomeStyles(colors: AppColors) {
     },
     searchWrapper: {
       paddingTop: spacing.lg,
-      paddingBottom: spacing.sm,
+      paddingBottom: spacing.xs,
       shadowColor: 'transparent',
       shadowOffset: { width: 0, height: 0 },
       shadowOpacity: 0,
@@ -75,8 +75,8 @@ function createHomeStyles(colors: AppColors) {
       elevation: 0,
     },
     homeTabBar: {
-      marginTop: spacing.xs,
-      marginBottom: spacing.sm,
+      marginTop: spacing.sm,
+      marginBottom: spacing.md,
     },
     viewToggleBtn: {
       width: 44,