feat(frontend): 饮食首页菜篮/导航/趋势暖灶主题化

cfc-frontend/pages/diet/index.vue

@@ -26,8 +26,8 @@
       <!-- 食材推荐器 -->
       <view class="card">
         <view class="card-header">
-          <view class="card-dot"></view>
-          <text class="card-title">今日食材推荐</text>
+          <view class="card-basket-icon"><text class="card-basket-emoji">🧺</text></view>
+          <text class="card-title">今日菜篮</text>
         </view>
         <view class="card-body">
           <view class="action-bar">
@@ -409,14 +409,13 @@ export default {
   align-items: center;
   padding: 28rpx 28rpx 0;
 }
-.card-dot {
-  width: 8rpx;
-  height: 32rpx;
-  border-radius: 4rpx;
-  background: linear-gradient(180deg, #FF8C42, #FFB366);
-  margin-right: 16rpx;
-  flex-shrink: 0;
+.card-basket-icon {
+  width: 64rpx; height: 64rpx; border-radius: 18rpx;
+  background: linear-gradient(135deg, #FF8C42, #FFB366);
+  display: flex; align-items: center; justify-content: center;
+  margin-right: 16rpx; flex-shrink: 0;
 }
+.card-basket-emoji { font-size: 32rpx; }
 .card-title {
   font-size: 30rpx;
   font-weight: 600;
@@ -445,9 +444,8 @@ export default {
 .action-btn-primary {
   background: #FF8C42;
 }
-.action-btn-accent {
-  background: #FFF0E0;
-}
+.action-btn-accent { background: linear-gradient(135deg, #10B981, #34D399); }
+.action-btn-text-accent { color: #FFFFFF; }
 .action-btn-disabled {
   opacity: 0.4;
 }
@@ -468,6 +466,7 @@ export default {
 .ingredient-list {
   margin-top: 8rpx;
 }
+.ingredient-item:active { background: #FFF9F0; }
 .ingredient-item {
   display: flex;
   align-items: center;
@@ -563,21 +562,13 @@ export default {
   justify-content: center;
   margin-bottom: 12rpx;
 }
-.nav-icon-green {
-  background: linear-gradient(135deg, #E8F5E9, #C8E6C9);
-}
-.nav-icon-blue {
-  background: linear-gradient(135deg, #E3F2FD, #BBDEFB);
-}
-.nav-icon-orange {
-  background: linear-gradient(135deg, #FFF3E0, #FFE0B2);
-}
-.nav-icon-purple {
-  background: linear-gradient(135deg, #F3E5F5, #E1BEE7);
-}
-.nav-icon-red {
-  background: linear-gradient(135deg, #FBE9E7, #FFCCBC);
-}
+.nav-icon-green { background: linear-gradient(135deg, #FFF1E6, #FFE0C0); }
+.nav-icon-blue  { background: linear-gradient(135deg, #FFF7ED, #FFEEDD); }
+.nav-icon-orange{ background: linear-gradient(135deg, #FF8C42, #FFB366); }
+.nav-icon-purple{ background: linear-gradient(135deg, #FFE8D6, #FFD4B0); }
+.nav-icon-red   { background: linear-gradient(135deg, #E8F8F1, #C8F0E0); }
+.nav-item:active .nav-icon-wrap { transform: scale(0.92); }
+.nav-icon-wrap { transition: transform 0.15s ease; }
 .nav-icon {
   font-size: 36rpx;
 }
@@ -602,7 +593,7 @@ export default {
 .trend-divider {
   width: 1rpx;
   height: 60rpx;
-  background: #F0F0F0;
+  background: #FDE8D0;
 }
 .trend-num {
   font-size: 48rpx;