From 36c8af69946419159aedd321394f23a4e45851fc Mon Sep 17 00:00:00 2001
From: Trae AI <trae@example.com>
Date: Sat, 27 Dec 2025 12:05:01 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BF=AE=E5=A4=8D=E6=90=9C=E7=B4=A2=E6=A1=86?=
 =?UTF-8?q?=E9=9A=90=E8=97=8F=E6=97=B6=E5=95=86=E5=93=81=E5=88=97=E8=A1=A8?=
 =?UTF-8?q?=E6=9C=AA=E5=AE=8C=E5=85=A8=E5=BE=80=E4=B8=8A=E6=8B=89=E5=92=8C?=
 =?UTF-8?q?=E5=95=86=E5=93=81=E4=BF=A1=E6=81=AF=E8=A2=AB=E9=9A=94=E6=96=AD?=
 =?UTF-8?q?=E7=9A=84=E9=97=AE=E9=A2=98?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 pages/index/index.wxss | 45 ++++++++++++++++++++++++------------------
 1 file changed, 26 insertions(+), 19 deletions(-)

diff --git a/pages/index/index.wxss b/pages/index/index.wxss
index b7e2098..f356f3e 100644
--- a/pages/index/index.wxss
+++ b/pages/index/index.wxss
@@ -26,7 +26,7 @@ page {
   left: 0;
   right: 0;
   z-index: 1000;
-  background: linear-gradient(135deg, #6a11cb 0%, #2575fc 100%);
+  background: transparent; /* 透明背景，与页面背景保持一致 */
   transition: all 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94);
   transform: translateY(0);
   will-change: transform; /* iOS性能优化 */
@@ -84,30 +84,36 @@ page {
 
 /* 商品列表添加顶部内边距 */
 .goods-list {
-  padding-top: 240rpx; /* 与搜索区域高度匹配 */
+  padding-top: 260rpx; /* 增加内边距，确保商品不被筛选区域遮挡 */
   transition: padding-top 0.3s ease;
+  min-height: calc(100vh - 260rpx); /* 最小高度，确保占满屏幕 */
 }
 
 /* 当搜索框隐藏时调整内边距 */
 .top-section-container.top-hidden ~ .goods-list {
-  padding-top: 100rpx; /* 减少内边距 */
+  padding-top: 0; /* 完全移除内边距，让商品列表紧贴筛选区域 */
+  min-height: calc(100vh - 0rpx); /* 调整最小高度 */
 }
 
 /* 品种筛选区域调整 */
 .category-section {
   position: fixed;
-  top: 200rpx; /* 根据搜索区域高度调整 */
+  top: 180rpx; /* 根据搜索区域高度调整 */
   left: 0;
   right: 0;
   z-index: 999;
   background: white;
   transition: top 0.3s ease;
-  padding: 20rpx 0;
+  padding: 16rpx 0;
   border-bottom: 2rpx solid #f0f0f0;
+  box-shadow: 0 2rpx 8rpx rgba(0, 0, 0, 0.1); /* 添加阴影，与搜索框风格一致 */
+  height: 80rpx; /* 固定高度，避免内容变化导致跳动 */
+  box-sizing: border-box;
 }
 
 .top-section-container.top-hidden ~ .category-section {
-  top: 60rpx; /* 搜索区域隐藏后上移 */
+  top: 0; /* 搜索区域隐藏后直接固定在顶部 */
+  position: fixed; /* 保持固定定位，确保始终在顶部 */
 }
 
 /* iOS专用修复 */
@@ -130,13 +136,16 @@ page {
 
 /* 确保滚动视图有正确的容器高度 */
 .goods-section {
-  height: 100vh;
+  height: auto;
+  min-height: calc(100vh - 60rpx); /* 最小高度，确保占满屏幕 */
   position: relative;
+  background: linear-gradient(180deg, #f8f8f8 0%, #f0f0f0 50%, #e8e8e8 100%); /* 与页面背景保持一致 */
 }
 
 .goods-list {
-  height: 100%;
+  height: auto; /* 自动高度，适应内容 */
   box-sizing: border-box;
+  background: linear-gradient(180deg, #f8f8f8 0%, #f0f0f0 50%, #e8e8e8 100%); /* 与页面背景保持一致 */
 }
 
 /* 标题样式 */
@@ -1145,20 +1154,12 @@ wx-button:not([size=mini]) {
   }
 }
 
-/* 商品区域样式 */
-.goods-section {
-  background-color: #f8f8f8;
-  padding: 16rpx;
-  margin: 0;
-  flex: 7;
-  overflow-y: auto;
-  width: 100%;
-  box-sizing: border-box;
-}
+
 
 .goods-list-container {
-  padding: 0;
+  padding: 0 20rpx;
   padding-bottom: 20rpx;
+  min-height: calc(100% - 40rpx);
 }
 
 /* 瀑布流容器 */
@@ -1205,6 +1206,9 @@ wx-button:not([size=mini]) {
   overflow: hidden;
   box-shadow: 0 2rpx 12rpx rgba(0, 0, 0, 0.08);
   transition: all 0.3s ease;
+  display: flex;
+  flex-direction: column;
+  /* 移除固定最小高度，让卡片高度根据内容自动调整 */
 }
 
 .product-card:active {
@@ -1257,6 +1261,9 @@ wx-button:not([size=mini]) {
 /* 商品信息区域 */
 .product-info {
   padding: 16rpx;
+  flex: 1; /* 自动拉伸，占据剩余空间 */
+  display: flex;
+  flex-direction: column;
 }
 
 /* 商品标题 */