feat: 优化营养记录和卡路里环图组件，增加毛玻璃背景和动画效果

components/NutritionRecordCard.tsx

@@ -139,7 +139,7 @@ export function NutritionRecordCard({
               {record.imageUrl ? (
                 <Image source={{ uri: record.imageUrl }} style={styles.foodImage} />
               ) : (
-                <Ionicons name="restaurant" size={24} color={textSecondaryColor} />
+                <Ionicons name="restaurant" size={28} color={textSecondaryColor} />
               )}
             </View>
 
@@ -172,7 +172,6 @@ export function NutritionRecordCard({
             <View style={styles.rightSection}>
               {/* 热量显示 */}
               <View style={styles.caloriesContainer}>
-                <View style={styles.caloriesDot} />
                 <ThemedText style={[styles.caloriesText]}>
                   {record.estimatedCalories ? `${Math.round(record.estimatedCalories)} kcal` : '- kcal'}
                 </ThemedText>
@@ -185,14 +184,6 @@ export function NutritionRecordCard({
                 </ThemedText>
               </View>
 
-              {/* 更多操作按钮 */}
-              <TouchableOpacity
-                ref={popoverRef}
-                style={styles.moreButton}
-                onPress={() => setShowPopover(true)}
-              >
-                <Ionicons name="ellipsis-horizontal" size={16} color={textSecondaryColor} />
-              </TouchableOpacity>
             </View>
           </View>
         </TouchableOpacity>
@@ -204,21 +195,22 @@ export function NutritionRecordCard({
 
 const styles = StyleSheet.create({
   container: {
-    marginBottom: 12,
+    marginBottom: 16,
     // iOS 阴影效果 - 更自然的阴影
     shadowColor: '#000000',
-    shadowOffset: { width: 0, height: 1 },
-    shadowOpacity: 0.08,
-    shadowRadius: 4,
+    shadowOffset: { width: 0, height: 2 },
+    shadowOpacity: 0.1,
+    shadowRadius: 8,
     // Android 阴影效果
-    elevation: 2,
+    elevation: 3,
   },
   card: {
     flex: 1,
-    height: 80,
+    minHeight: 100,
     backgroundColor: '#FFFFFF',
-    borderRadius: 12,
-    padding: 12,
+    borderRadius: 16,
+    paddingHorizontal: 16,
+    paddingVertical: 14,
   },
   mainContent: {
     flex: 1,
@@ -226,10 +218,10 @@ const styles = StyleSheet.create({
     alignItems: 'center',
   },
   foodImageContainer: {
-    width: 32,
-    height: 32,
-    borderRadius: 8,
-    marginRight: 12,
+    width: 48,
+    height: 48,
+    borderRadius: 12,
+    marginRight: 16,
     overflow: 'hidden',
   },
   foodImage: {
@@ -244,68 +236,64 @@ const styles = StyleSheet.create({
   },
   foodInfoContainer: {
     flex: 1,
-    justifyContent: 'flex-start',
-
+    justifyContent: 'center',
+    gap: 4,
   },
   foodName: {
-    fontSize: 14,
+    fontSize: 16,
     fontWeight: '600',
     color: '#333333',
-    marginTop: 2,
+    lineHeight: 20,
   },
   mealTime: {
-    fontSize: 10,
+    fontSize: 12,
     fontWeight: '400',
     color: '#999999',
+    lineHeight: 16,
   },
   nutritionContainer: {
     flexDirection: 'row',
     alignItems: 'center',
-    gap: 20,
+    gap: 16,
+    marginTop: 2,
   },
   nutritionItem: {
     flexDirection: 'row',
     alignItems: 'center',
-    gap: 2,
+    gap: 4,
   },
   nutritionIcon: {
-    fontSize: 12,
+    fontSize: 14,
   },
   nutritionValue: {
-    fontSize: 11,
+    fontSize: 13,
     fontWeight: '500',
     color: '#666666',
   },
   rightSection: {
     alignItems: 'flex-end',
-    justifyContent: 'space-between',
-    height: 48,
+    justifyContent: 'center',
+    gap: 8,
+    minHeight: 60,
   },
   caloriesContainer: {
     flexDirection: 'row',
     alignItems: 'center',
-    marginBottom: 4,
-  },
-  caloriesDot: {
-    width: 6,
-    height: 6,
-    borderRadius: 3,
-    backgroundColor: '#333333',
-    marginRight: 6,
   },
   caloriesText: {
-    fontSize: 12,
-    color: '#473c3cff',
-    fontWeight: '500',
+    fontSize: 14,
+    color: '#333333',
+    fontWeight: '600',
   },
   mealTypeBadge: {
-    paddingHorizontal: 8,
-    borderRadius: 10,
-    marginBottom: 4,
+    paddingHorizontal: 10,
+    paddingVertical: 4,
+    borderRadius: 12,
+    backgroundColor: 'rgba(0,0,0,0.05)',
   },
   mealTypeText: {
-    fontSize: 10,
-    fontWeight: '500',
+    fontSize: 12,
+    fontWeight: '600',
   },
   moreButton: {
     padding: 2,