基本成型

miniprogram/pages/shop/shop.wxss

@@ -0,0 +1,150 @@
+::-webkit-scrollbar {
+    width: 0;
+    height: 0;
+    color: transparent;
+  }
+/* 页面容器样式 */
+.container {
+    padding: 16rpx;
+    background-color: #f5f5f5;
+    min-height: 100vh;
+    padding-bottom: 14vh;
+  }
+  
+  /* 页面标题 */
+  .page-title {
+    font-size: 36rpx;
+    font-weight: bold;
+    color: #333;
+    margin: 24rpx 0;
+    padding-left: 12rpx;
+    border-left: 6rpx solid #46bb9e;
+  }
+  
+  /* 商品列表 */
+  .product-list {
+    display: flex;
+    flex-direction: column;
+    gap: 24rpx;
+  }
+  
+  /* 商品卡片样式 */
+  .product-card {
+    background-color: #fff;
+    border-radius: 20rpx;
+    overflow: hidden;
+    box-shadow: 0 4rpx 12rpx rgba(0, 0, 0, 0.05);
+    transition: all 0.3s ease;
+  }
+  
+  .product-card:hover {
+    transform: translateY(-4rpx);
+    box-shadow: 0 10rpx 20rpx rgba(0, 0, 0, 0.08);
+  }
+  
+  /* 商品图片容器 */
+  .product-image-container {
+    position: relative;
+    width: 100%;
+  }
+  
+  /* 商品图片 */
+  .product-image {
+    width: 100%;
+    height: auto;
+    display: block;
+  }
+  
+  /* 折扣标签 */
+  .discount-tag {
+    position: absolute;
+    top: 16rpx;
+    left: 16rpx;
+    background-color: #ff4d4f;
+    color: #fff;
+    font-size: 24rpx;
+    padding: 4rpx 12rpx;
+    border-radius: 4rpx;
+    font-weight: bold;
+  }
+  
+  /* 销量标签 */
+  .sales-tag {
+    position: absolute;
+    bottom: 16rpx;
+    left: 16rpx;
+    background-color: rgba(0, 0, 0, 0.6);
+    color: #fff;
+    font-size: 24rpx;
+    padding: 4rpx 12rpx;
+    border-radius: 16rpx;
+    display: flex;
+    align-items: center;
+    gap: 8rpx;
+  }
+  
+  /* 商品信息区域 */
+  .product-info {
+    padding: 24rpx;
+  }
+  
+  /* 商品名称 */
+  .product-name {
+    font-size: 32rpx;
+    font-weight: bold;
+    color: #333;
+    margin-bottom: 12rpx;
+    line-height: 1.4;
+  }
+  
+  /* 商品描述 */
+  .product-desc {
+    font-size: 26rpx;
+    color: #666;
+    margin-bottom: 20rpx;
+    line-height: 1.4;
+    display: -webkit-box;
+    -webkit-box-orient: vertical;
+    -webkit-line-clamp: 2;
+    overflow: hidden;
+  }
+  
+  /* 价格容器 */
+  .price-container {
+    display: flex;
+    align-items: center;
+    margin-bottom: 24rpx;
+  }
+  
+  /* 当前价格 */
+  .current-price {
+    font-size: 34rpx;
+    color: #46bb9e;
+    font-weight: bold;
+    margin-right: 16rpx;
+  }
+  
+  /* 原价 */
+  .original-price {
+    font-size: 26rpx;
+    color: #999;
+    text-decoration: line-through;
+  }
+  
+  /* 购买按钮 */
+  .buy-btn {
+    width: 100%;
+    background-color: #51bdb6;
+    color: #fff;
+    font-size: 30rpx;
+    padding: 20rpx 0;
+    border-radius: 10rpx;
+    border: none;
+    transition: background-color 0.3s ease;
+  }
+  
+  
+  .buy-btn::after {
+    border: none;
+  }
+