调整详情页样式

components/match-detail/basketball/basketball-score-table.tsx

@@ -9,7 +9,10 @@ interface BasketballScoreTableProps {
   isDark: boolean;
 }
 
-export function BasketballScoreTable({ data, isDark }: BasketballScoreTableProps) {
+export function BasketballScoreTable({
+  data,
+  isDark,
+}: BasketballScoreTableProps) {
   const { t } = useTranslation();
   const { match } = data;
   const bgColor = isDark ? "#1C1C1E" : "#FFF";
@@ -29,10 +32,10 @@ export function BasketballScoreTable({ data, isDark }: BasketballScoreTableProps
   const headers = [
     t("detail.score_table.team"),
     t("detail.score_table.total"),
-    "Q1",
-    "Q2",
-    "Q3",
-    "Q4",
+    "1",
+    "2",
+    "3",
+    "4",
   ];
 
   const rows = [
@@ -84,7 +87,9 @@ export function BasketballScoreTable({ data, isDark }: BasketballScoreTableProps
               {row.name}
             </ThemedText>
           </View>
-          <ThemedText style={styles.cellText}>{row.total}</ThemedText>
+          <ThemedText style={[styles.cellText, styles.totalText]}>
+            {row.total}
+          </ThemedText>
           <ThemedText style={styles.cellText}>{row.q1}</ThemedText>
           <ThemedText style={styles.cellText}>{row.q2}</ThemedText>
           <ThemedText style={styles.cellText}>{row.q3}</ThemedText>
@@ -97,54 +102,61 @@ export function BasketballScoreTable({ data, isDark }: BasketballScoreTableProps
 
 const styles = StyleSheet.create({
   container: {
-    margin: 16,
-    borderRadius: 12,
-    padding: 16,
+    marginHorizontal: 16,
+    marginBottom: 16,
+    borderRadius: 16,
+    padding: 20,
     elevation: 2,
     shadowColor: "#000",
     shadowOffset: { width: 0, height: 2 },
-    shadowOpacity: 0.1,
-    shadowRadius: 4,
+    shadowOpacity: 0.05,
+    shadowRadius: 8,
   },
   header: {
     flexDirection: "row",
-    paddingBottom: 12,
-    borderBottomWidth: StyleSheet.hairlineWidth,
-    borderBottomColor: "rgba(150,150,150,0.2)",
+    paddingBottom: 16,
+    borderBottomWidth: 1,
+    borderBottomColor: "rgba(150,150,150,0.1)",
   },
   headerText: {
     fontSize: 12,
-    fontWeight: "500",
+    fontWeight: "600",
+    opacity: 0.8,
   },
   row: {
     flexDirection: "row",
     alignItems: "center",
-    paddingVertical: 12,
+    paddingVertical: 14,
   },
   rowBorder: {
-    borderBottomWidth: StyleSheet.hairlineWidth,
+    borderBottomWidth: 1,
     borderBottomColor: "rgba(150,150,150,0.1)",
   },
   teamCell: {
     flex: 3,
     flexDirection: "row",
     alignItems: "center",
-    gap: 8,
+    gap: 10,
   },
   teamLogo: {
-    width: 24,
-    height: 24,
+    width: 28,
+    height: 28,
     resizeMode: "contain",
   },
   teamName: {
     flex: 1,
     fontSize: 14,
-    fontWeight: "500",
+    fontWeight: "700",
   },
   cellText: {
     flex: 1,
     textAlign: "center",
     fontSize: 14,
     fontWeight: "500",
+    opacity: 0.8,
+  },
+  totalText: {
+    fontWeight: "700",
+    opacity: 1,
   },
 });