修改商品搜索列表样式

master
liaoanqi 4 years ago
parent bc616d3a6a
commit ca1656da87

@ -1,9 +1,9 @@
.prod-items { .prod-items {
width: 360rpx; width: 43%;
float: left; /* float: left; */
background: #fff; background: #fff;
padding-bottom: 20rpx; margin-bottom: 40rpx;
box-sizing: border-box; box-sizing: border-box;
} }
@ -16,7 +16,7 @@ prod:nth-child(2n) .prod-items {
} }
.hot-imagecont .hotsaleimg { .hot-imagecont .hotsaleimg {
width:345rpx; width:100%;
height:345rpx; height:345rpx;
} }
@ -26,6 +26,7 @@ height:345rpx;
font-size: 28rpx; font-size: 28rpx;
display: -webkit-box; display: -webkit-box;
word-break: break-all; word-break: break-all;
padding: 0 20rpx;
overflow: hidden; overflow: hidden;
text-overflow: ellipsis; text-overflow: ellipsis;
display: -webkit-box; display: -webkit-box;
@ -47,6 +48,7 @@ height:345rpx;
.prod-items .hot-text .prod-info { .prod-items .hot-text .prod-info {
font-size: 20rpx; font-size: 20rpx;
color: #777; color: #777;
padding: 0 20rpx;
margin-top: 8rpx; margin-top: 8rpx;
} }
@ -59,6 +61,7 @@ height:345rpx;
.prod-items .hot-text .prod-text-info .price { .prod-items .hot-text .prod-text-info .price {
color: #eb2444; color: #eb2444;
padding-left: 20rpx;
} }
.deadline-price{ .deadline-price{
font-size: 22rpx; font-size: 22rpx;

@ -22,6 +22,12 @@ page {
background: #f4f4f4; background: #f4f4f4;
} }
.prod-list {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
}
/* 空 */ /* 空 */
.empty { .empty {
display: block; display: block;

@ -113,22 +113,32 @@ page {
.prod-show { .prod-show {
background: #fff; background: #fff;
margin-top: 160rpx; padding-top: 240rpx;
} }
.prod-show .prod-items { .prod-show .prod-items {
width: 375rpx; /* width: 375rpx; */
float: left; float: left;
background: #fff; background: #fff;
padding-bottom: 20rpx; padding-bottom: 20rpx;
box-sizing: border-box; box-sizing: border-box;
} }
.prod-items {
margin: 0 20rpx;
}
.hotsale-item-cont {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
}
/* 纵向列表 */ /* 纵向列表 */
.prod-list .cont-item { .prod-list .cont-item {
padding: 0 20rpx 20rpx 20rpx; padding: 0 20rpx 20rpx 20rpx;
margin-top: 180rpx; margin-top: 230rpx;
} }
.prod-list .cont-item .show-item .more-prod-pic { .prod-list .cont-item .show-item .more-prod-pic {

@ -6,7 +6,7 @@
<view class="fixed-box"> <view class="fixed-box">
<view class="search-bar"> <view class="search-bar">
<view class="search-box"> <view class="search-box">
<input class="sear-input" :value="prodName" @input="getSearchContent" confirm-type="search" @confirm="toSearchConfirm"></input> <input placeholder="输入关键字搜索" class="sear-input" :value="prodName" @input="getSearchContent" confirm-type="search" @confirm="toSearchConfirm"></input>
<image src="/static/images/icon/search.png" class="search-img"></image> <image src="/static/images/icon/search.png" class="search-img"></image>
</view> </view>
<view class="search-list-img" @tap="changeShowType"> <view class="search-list-img" @tap="changeShowType">
@ -54,7 +54,6 @@
</view> </view>
<view v-if="!searchProdList.length" :class="['empty',showType==1? 'empty-top':'']"></view> <view v-if="!searchProdList.length" :class="['empty',showType==1? 'empty-top':'']"></view>
</view> </view>
</template> </template>

Loading…
Cancel
Save