zhuangcheng/wechat-shop
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: 首页样式

Browse Source
This commit is contained in:
zc 2025-11-24 14:00:44 +08:00
parent 581c7d8532
commit a0b212a5a5
2 changed files with 11 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
miniprogram/pages/home/index.scss
View File

@ -183,18 +183,24 @@ $theme-color: #06CD31;
// 猜你喜欢 // 猜你喜欢
.recommendation { .recommendation {
.product-list { .product-list {
display: grid; column-count: 2;
grid-template-columns: repeat(2, 1fr); column-gap: 30rpx;
gap: 30rpx;
.product-item { .product-item {
background: $white; background: $white;
padding: 8rpx; padding: 8rpx;
border-radius: 16rpx; border-radius: 16rpx;
break-inside: avoid;
margin-bottom: 30rpx;
display: inline-block;
width: 100%;
box-sizing: border-box;
.item-image { .item-image {
width: 100%; width: 100%;
height: 300rpx; height: auto;
min-height: 200rpx;
background: #bbb; background: #bbb;
border-radius: 16rpx; border-radius: 16rpx;
display: block;
} }
.item-name { .item-name {
display: block; display: block;

2
miniprogram/pages/home/index.wxml
View File

@ -52,7 +52,7 @@
<view class="recommendation home-page-block-gap"> <view class="recommendation home-page-block-gap">
<view class="product-list"> <view class="product-list">
<view class="product-item" wx:for="{{recommendedProducts}}" wx:key="id" bindtap="onGoCommodity" data-id="{{item.id}}"> <view class="product-item" wx:for="{{recommendedProducts}}" wx:key="id" bindtap="onGoCommodity" data-id="{{item.id}}">
<image class="item-image" src="{{item.image}}" /> <image class="item-image" src="{{item.image}}" mode="widthFix" />
<text class="item-name">{{item.name}}</text> <text class="item-name">{{item.name}}</text>
<!-- <view class="item-tags" wx:if="{{item.tags}}"> <!-- <view class="item-tags" wx:if="{{item.tags}}">
<text class="tag" wx:for="{{item.tags}}" wx:key="*this">{{item}}</text> <text class="tag" wx:for="{{item.tags}}" wx:key="*this">{{item}}</text>