feat: 优化首页、个人中心页面 UI

packages/app/src/components/DateSelector.vue

@@ -14,7 +14,7 @@
         >
           <text class="weekday">{{ item.isToday ? '今天' : item.weekday }}</text>
           <text class="day">{{ getDayNumber(item.date) }}</text>
-          <text class="month">{{ getMonthNumber(item.date) }}月</text>
+          <text v-if="variant !== 'soft' || getDayNumber(item.date) === '1'" class="month">{{ getMonthNumber(item.date) }}月</text>
         </view>
       </view>
     </scroll-view>
@@ -28,7 +28,7 @@ import { getDateRange } from '../utils/format'
 
 interface Props {
   modelValue: string
-  variant?: 'default' | 'booking'
+  variant?: 'default' | 'booking' | 'soft'
 }
 
 const props = defineProps<Props>()
@@ -168,4 +168,24 @@ const variant = computed(() => props.variant ?? 'default')
     }
   }
 }
+
+.date-selector.date-selector--soft {
+  padding: 8rpx 0 24rpx;
+  background: #fbf9f6;
+  border-bottom: none;
+  .track { padding: 0 32rpx; gap: 12rpx; }
+  .date-item {
+    min-width: 0; width: 86rpx; height: 116rpx; padding: 0;
+    box-sizing: border-box; border-radius: 24rpx;
+    background: transparent; gap: 12rpx;
+    .weekday { font-size: 22rpx; color: #8b817b; }
+    .day { font-size: 34rpx; font-weight: 400; color: #514943; }
+    &.active {
+      background: #eee3dc;
+      .weekday, .day { color: #705b4f; }
+      .day { font-weight: 500; }
+    }
+    &.today:not(.active) .weekday { color: #617d73; font-weight: 400; }
+  }
+}
 </style>