Skip to content

J
junlebao-milk-20240619
Commit 119dba0e authored by haiyoucuv's avatar haiyoucuv
Browse files
Options

init

parent 6fa5939e
Hide whitespace changes
Inline Side-by-side
Showing with 116 additions and 41 deletions
miniprogram/app.less
View file @ 119dba0e
......@@ -7,4 +7,8 @@
justify-content: space-between;
padding: 200rpx 0;
box-sizing: border-box;
}
}
.common_view_hover {
transform: scale(0.95);
}
\ No newline at end of file
miniprogram/pages/activity/activity.less
View file @ 119dba0e
......@@ -12,24 +12,32 @@
position: absolute;
.act_swiper {
margin: 421rpx auto 0;
margin: 390rpx auto 0;
//position: absolute;
//left: 39.5rpx;
//top: 421rpx;
//top: 390rpx;
width: 671rpx;
height: 411rpx;
width: 750rpx;
height: 473rpx;
border: 2rpx solid #c5da92;
border-radius: 25rpx;
background-image: url("https://yun.duiba.com.cn/polaris/%E5%9B%BE%E5%B1%82%20541.3c7ff6d4bed9f88be00c52551b05b54d94d1fd95.png");
background-size: 100% 100%;
.act_swiper_item {
display: flex;
align-items: center;
justify-content: center;
// 阴影 距离3px 扩展0% 大小31px 颜色#96a376
box-shadow: 3rpx 0 31rpx #96a376;
.swiper_item_img{
width: 671rpx;
height: 411rpx;
border: 2rpx solid #c5da92;
border-radius: 25rpx;
// 阴影 距离3px 扩展0% 大小31px 颜色#96a376
box-shadow: 3rpx 0 31rpx #96a376;
}
}
}
.act_prod_list {
margin: 48rpx auto 0;
......@@ -45,6 +53,7 @@
flex-wrap: wrap;
padding-left: 27rpx;
padding-bottom: 30rpx;
}
.act_prod_item {
......@@ -53,6 +62,63 @@
background-image: url("https://yun.duiba.com.cn/polaris/prodBg.7c5f65092f2ed3c582891a1be9bb105da4b4bd26.png");
background-size: 100% 100%;
margin: 5rpx 15rpx 35rpx;
position: relative;
.prod_item_prompt {
position: absolute;
right: 20rpx;
top: 5rpx;
font-size: 30rpx;
color: #ffffff;
}
.prod_item_introduce {
position: absolute;
width: 306rpx;
left: 8rpx;
top: 372rpx;
font-size: 20rpx;
color: #594321;
letter-spacing: -0.07em;
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
}
.prod_item_img {
position: absolute;
width: 260rpx;
height: 198rpx;
left: 31rpx;
top: 67rpx;
}
.prod_item_logo {
position: absolute;
width: 102rpx;
height: 57rpx;
left: 11rpx;
top: 299rpx;
}
.prod_item_btn {
position: absolute;
left: 174rpx;
top: 305rpx;
width: 131rpx;
height: 44rpx;
background-image: url("//yun.duiba.com.cn/polaris/%E6%9F%A5%E7%9C%8B%E6%9B%B4%E5%A4%9A.d91a28ca453f502e76cef243558241e9cc988ba3.png");
background-size: 100% 100%;
}
.prod_item_btn_hover{
transform: scale(0.9);
}
}
}
\ No newline at end of file
miniprogram/pages/activity/activity.ts
View file @ 119dba0e
......@@ -5,38 +5,30 @@ Page({
* 页面的初始数据
*/
data: {
banner:[
"https://yun.duiba.com.cn/polaris/%E5%9B%BE%E5%B1%82%20541.3c7ff6d4bed9f88be00c52551b05b54d94d1fd95.png",
"//yun.duiba.com.cn/polaris/%E5%96%9D%E9%B2%9C%E5%A5%B6.5815326bdfc25045c0a8ee71beb10c13b0147acd.png",
"//yun.duiba.com.cn/polaris/%E9%B2%9C%E7%89%9B%E5%A5%B6.fd352be87520d04261ba36348022c36836e4c819.png"
],
prodList: [
{
img: "",
introduce: "",
prompt: "",
logo: "",
img: "//yun.duiba.com.cn/polaris/%E5%96%9D%E9%B2%9C%E5%A5%B6.5815326bdfc25045c0a8ee71beb10c13b0147acd.png",
introduce: "更多的鲜活营养，更好喝的鲜甜口感，更优质的牧场奶源，更安全的品质保障",
prompt: "200g加赠50g",
logo: "//yun.duiba.com.cn/polaris/%E5%96%9D%E9%B2%9C%E5%A5%B6logo.bbf9439b1063adc9690344c58db26a1fa2d746f8.png",
},
{
img: "",
introduce: "",
prompt: "",
logo: "",
img: "//yun.duiba.com.cn/polaris/%E9%B2%9C%E7%89%9B%E5%A5%B6.fd352be87520d04261ba36348022c36836e4c819.png",
introduce: "更多的鲜活营养，更好喝的鲜甜口感，更优质的牧场奶源，更安全的品质保障更多的鲜活营养，更好喝的鲜甜口感，更优质的牧场奶源，更安全的品质保障",
prompt: "200毫升",
logo: "//yun.duiba.com.cn/polaris/%E9%B2%9C%E7%89%9B%E5%A5%B6logo.7ee8ec3fc21f699756f54512835ffd8d50a18bed.png",
},
{
img: "",
introduce: "",
prompt: "",
logo: "",
},
{
img: "",
introduce: "",
prompt: "",
logo: "",
},
{
img: "",
introduce: "",
prompt: "",
logo: "",
},
]
].concat(new Array(2 + ~~(Math.random() * 10)).fill({
img: "//yun.duiba.com.cn/polaris/%E9%B2%9C%E7%89%9B%E5%A5%B6.fd352be87520d04261ba36348022c36836e4c819.png",
introduce: "更多的鲜活营养，更好喝的鲜甜口感，更优质的牧场奶源，更安全的品质保障更多的鲜活营养，更好喝的鲜甜口感，更优质的牧场奶源，更安全的品质保障",
prompt: "200毫升",
logo: "//yun.duiba.com.cn/polaris/%E9%B2%9C%E7%89%9B%E5%A5%B6logo.7ee8ec3fc21f699756f54512835ffd8d50a18bed.png",
}))
},
......
miniprogram/pages/activity/activity.wxml
View file @ 119dba0e
<!--pages/activity/activity.wxml-->
<view class="act_root">
<view class="act_swiper"/>
<swiper class="act_swiper" autoplay >
<swiper-item class="act_swiper_item" wx:for="{{banner}}">
<image class="swiper_item_img" src="{{item}}" lazy-load />
</swiper-item>
</swiper>
<view class="act_prod_list">
<view class="act_prod_item" wx:for="{{prodList}}">
<view class="prod_item_prompt">{{item.prompt}}</view>
<view class="prod_item_introduce">{{item.introduce}}</view>
<image class="prod_item_img" src="{{item.img}}" mode="aspectFit" lazy-load />
<image class="prod_item_logo" src="{{item.logo}}" mode="aspectFit" lazy-load />
<view
class="prod_item_btn"
hover-class="common_view_hover"
hover-start-time="0"
hover-stay-time="0"
/>
</view>
</view>
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment