deming/components/shop/seckill/item.vue
2020-06-11 09:34:23 +08:00

63 lines
1.3 KiB
Vue

<template>
<view class="item">
<image class="head"></image>
<text class="title">商品名</text>
<view class="price">
<text>99</text>
<text>299</text>
</view>
<view class="info">
<text>剩余21件</text>
<text>立即购买</text>
</view>
</view>
</template>
<script>
export default {
name:"item"
}
</script>
<style lang="scss" scoped>
.item{
width: 210rpx;
.head{
width: 210rpx;
height: 131rpx;
border-radius: 6rpx;
}
.title{
font-size: 26rpx;
color: #333;
margin-top: 16rpx;
}
.price{
display: flex;
align-items: center;
justify-content: space-between;
margin-top: 19rpx;
>text:first-child{
font-size: 26rpx;
color: #FF3131;
}
>text:last-child{
font-size: 24rpx;
color: #999;
}
}
.info{
display: flex;
align-items: center;
justify-content: space-between;
font-size: 22rpx;
margin-top: 19rpx;
>text:first-child{
color: #666;
}
>text:last-child{
color: #FDD360;
}
}
}
</style>