447 lines
6.7 KiB
Plaintext
447 lines
6.7 KiB
Plaintext
/* pages/index/index.wxss */
|
|
page {
|
|
background-color: #f5f5f5;
|
|
}
|
|
.top-all{
|
|
background-color: #ffffff;
|
|
border-radius: 0px 0px 40rpx 40rpx;
|
|
padding-bottom: 15rpx;
|
|
}
|
|
.top {
|
|
width: 750rpx;
|
|
padding: 40rpx 0rpx 0;
|
|
}
|
|
|
|
.title {
|
|
font-size: 36rpx;
|
|
color: #ffffff;
|
|
line-height: 90rpx;
|
|
height: 90rpx;
|
|
text-align: center;
|
|
}
|
|
.topCont{
|
|
width: 690rpx;
|
|
padding: 0 30rpx;
|
|
margin-top: 20rpx;
|
|
}
|
|
.address{
|
|
width: 290rpx;
|
|
height: 56rpx;
|
|
}
|
|
.address-icon{
|
|
width: 23rpx;
|
|
height: 34rpx;
|
|
}
|
|
.address-name{
|
|
font-size: 32rpx;
|
|
color: #ffffff;
|
|
width: 220rpx;
|
|
}
|
|
.address-right{
|
|
width: 19rpx;
|
|
height: 10rpx;
|
|
}
|
|
.top-search {
|
|
height: 56rpx;
|
|
display: flex;
|
|
justify-content: space-between;
|
|
align-items: center;
|
|
width: 380rpx;
|
|
}
|
|
|
|
.search {
|
|
width:260rpx;
|
|
font-size: 24rpx;
|
|
display: flex;
|
|
align-items: center;
|
|
height: 56rpx;
|
|
background-color: #f3f4f8;
|
|
border-radius: 28rpx;
|
|
padding: 0 30rpx;
|
|
}
|
|
|
|
.search image {
|
|
width: 32rpx;
|
|
height: 32rpx;
|
|
margin-right:10rpx;
|
|
}
|
|
|
|
.search input {
|
|
width:200rpx;
|
|
}
|
|
|
|
.sear {
|
|
font-size: 24rpx;
|
|
color: #fff;
|
|
width: 50rpx;
|
|
text-align: right;
|
|
}
|
|
|
|
.banner{height: 302rpx;margin: 0 auto;margin-top: 30rpx;}
|
|
.banner swiper-item{text-align: center;}
|
|
.banner image{width: 654rpx !important;height: 300rpx !important;margin: 0 auto;background: #eee;border-radius: 10rpx;overflow: hidden}
|
|
|
|
.bannner {
|
|
width: 690rpx;
|
|
height: 280rpx;
|
|
border-radius: 20rpx;
|
|
margin:30rpx auto;
|
|
}
|
|
|
|
.bannner image {
|
|
width: 690rpx;
|
|
height: 280rpx;
|
|
border-radius: 20rpx;
|
|
}
|
|
|
|
/* 默认指示点的样式 */
|
|
.bannner .wx-swiper-dot {
|
|
width: 10rpx;
|
|
height: 10rpx;
|
|
background-color: #ffddcc;
|
|
}
|
|
|
|
/* 选中指示点的样式 */
|
|
.bannner .wx-swiper-dot.wx-swiper-dot-active {
|
|
width: 43rpx;
|
|
height: 10rpx;
|
|
background-color: #ffffff;
|
|
border-radius: 5rpx;
|
|
}
|
|
|
|
.jg{
|
|
width: 690rpx;
|
|
margin: 0 auto;
|
|
}
|
|
.jg::after{
|
|
display: block;
|
|
content: '';
|
|
clear: both;
|
|
}
|
|
.jg-cont{
|
|
margin-bottom:40rpx;
|
|
float: left;
|
|
width: 100rpx;
|
|
margin-right: 96rpx;
|
|
}
|
|
.jg-cont:nth-child(4n){
|
|
margin-right: 0;
|
|
}
|
|
.jg-cont image{
|
|
width: 100rpx;
|
|
height: 100rpx;
|
|
border-radius: 50%;
|
|
}
|
|
.jg-name{
|
|
width: 100rpx;
|
|
font-size: 24rpx;
|
|
color: #333333;
|
|
text-align: center;
|
|
}
|
|
|
|
.zone{
|
|
width:690rpx;
|
|
padding: 30rpx;
|
|
background-color: #ffffff;
|
|
border-radius: 40rpx;
|
|
margin-top: 30rpx;
|
|
}
|
|
.zone-l{
|
|
width: 280rpx;
|
|
height: 390rpx;
|
|
background-color: #fff7f6;
|
|
border-radius: 10rpx;
|
|
}
|
|
.zone-name{
|
|
font-size: 40rpx;
|
|
line-height: 65rpx;
|
|
}
|
|
.zone-name__1{
|
|
text-align: center;
|
|
font-weight: bold;
|
|
-webkit-line-clamp: 2;
|
|
background-image: -webkit-linear-gradient(left, #fd7503,#ff291e);
|
|
background-clip: text;
|
|
-webkit-background-clip: text;
|
|
-webkit-text-fill-color: transparent;
|
|
}
|
|
.zone-tips{
|
|
font-size: 28rpx;
|
|
letter-spacing: 1rpx;
|
|
color: #999999;
|
|
}
|
|
.zone-icon{
|
|
margin-top: 20rpx;
|
|
font-size: 24rpx;
|
|
letter-spacing: 1rpx;
|
|
color: #ffffff;
|
|
width: 80rpx;
|
|
height: 36rpx;
|
|
border-radius: 18rpx;
|
|
}
|
|
.zone-icon__1{
|
|
background-color: #fd7503;
|
|
margin: 20rpx auto 30rpx;
|
|
}
|
|
.zone-icon image{
|
|
width: 9rpx;
|
|
height: 11rpx;
|
|
margin-left: 10rpx;
|
|
}
|
|
|
|
.zone-l>image{
|
|
width: 240rpx;
|
|
height: 190rpx;
|
|
margin-left: 20rpx;
|
|
}
|
|
.zone-r{
|
|
width: 380rpx;
|
|
}
|
|
|
|
.zone-2{
|
|
width: 380rpx;
|
|
height: 180rpx;
|
|
border-radius: 10rpx;
|
|
}
|
|
.zone-name__2{
|
|
color: #04a47e;
|
|
padding-left: 30rpx;
|
|
}
|
|
.zone-name__3{
|
|
color: #e79928;
|
|
padding-left: 30rpx;
|
|
}
|
|
.zone-icon__2{
|
|
background-color: #04a47e;
|
|
margin-left: 40rpx;
|
|
}
|
|
.zone-icon__3{
|
|
background-color: #e79928;
|
|
margin-left: 40rpx;
|
|
}
|
|
.zone-tips__2{
|
|
padding-left: 40rpx;
|
|
}
|
|
.zone-2>image{
|
|
margin-top: 45rpx;
|
|
width: 135rpx;
|
|
height: 135rpx;
|
|
}
|
|
|
|
.goods{
|
|
width: 690rpx;
|
|
background-image: linear-gradient(180deg,
|
|
#ffffff 0%,
|
|
#f5f5f5 44%,
|
|
#f5f5f5 100%);
|
|
border-radius: 40rpx 40rpx 0px 0px;
|
|
margin-top: 30rpx;
|
|
padding: 30rpx;
|
|
}
|
|
.type-all{
|
|
width: 690rpx;
|
|
overflow-x: scroll;
|
|
}
|
|
.type-all::-webkit-scrollbar {
|
|
display: none;
|
|
}
|
|
.type{
|
|
margin-right: 40rpx;
|
|
}
|
|
.type view{
|
|
width: 142rpx;
|
|
text-align: center;
|
|
}
|
|
.type-name{
|
|
font-size: 32rpx;
|
|
color: #333333;
|
|
}
|
|
.type-label{
|
|
font-size: 24rpx;
|
|
color: #999999;
|
|
margin-top: 15rpx;
|
|
}
|
|
.type-active .type-name{
|
|
color: #ee7b1e;
|
|
}
|
|
.type-active .type-label{
|
|
color: #ffffff;
|
|
width: 120rpx;
|
|
height: 42rpx;
|
|
background-image: linear-gradient(135deg,
|
|
#fd9603 0%,
|
|
#ee7b1e 100%);
|
|
border-radius: 21rpx;
|
|
line-height: 42rpx;
|
|
text-align: center;
|
|
margin:10rpx auto 0;
|
|
}
|
|
|
|
.cont-all{
|
|
width: 690rpx;
|
|
margin:0 auto 30rpx;
|
|
}
|
|
.cont-all::after{
|
|
display: block;
|
|
content: '';
|
|
clear: both;
|
|
}
|
|
.cont{
|
|
float: left;
|
|
width: 330rpx;
|
|
background-color: #ffffff;
|
|
border-radius: 10rpx;
|
|
margin: 0 30rpx 30rpx 0;
|
|
}
|
|
.cont:nth-child(2n){
|
|
margin-right: 0;
|
|
}
|
|
.goods-img{
|
|
width: 330rpx;
|
|
height: 330rpx;
|
|
}
|
|
.goods-name{
|
|
width: 280rpx;
|
|
padding:0 25rpx;
|
|
font-size: 32rpx;
|
|
color: #333333;
|
|
margin-top: 25rpx;
|
|
}
|
|
.goods-price{
|
|
margin: 0 auto;
|
|
padding: 18rpx 10rpx;
|
|
border-bottom: 1rpx solid #e5e5e5;
|
|
}
|
|
.price{
|
|
font-size: 36rpx;
|
|
color: #ee7b1e;
|
|
}
|
|
.price-text1{
|
|
font-size: 28rpx;
|
|
}
|
|
.price-text2{
|
|
font-size: 24rpx;
|
|
color: #999999;
|
|
text-decoration: line-through;
|
|
}
|
|
.goods-sales{
|
|
font-size: 24rpx;
|
|
color: #999999;
|
|
line-height: 62rpx;
|
|
padding:0 25rpx;
|
|
}
|
|
|
|
.empty{
|
|
text-align: center;
|
|
margin: 250rpx auto;
|
|
font-size: 28rpx;
|
|
letter-spacing: 3rpx;
|
|
color: #bababa;
|
|
}
|
|
|
|
.fx{
|
|
width: 715rpx;
|
|
height: 270rpx;
|
|
margin: 0 auto;
|
|
}
|
|
.fx image{
|
|
width: 100%;
|
|
height: 100%;
|
|
}
|
|
|
|
.fl{
|
|
width:690rpx;
|
|
padding: 30rpx;
|
|
background-color: #ffffff;
|
|
border-radius: 40rpx;
|
|
}
|
|
.fl view{
|
|
width: 330rpx;
|
|
height: 180rpx;
|
|
background-color: #fb492f;
|
|
border-radius: 10rpx;
|
|
}
|
|
.fl view image{
|
|
width: 100%;
|
|
height: 100%;
|
|
}
|
|
|
|
/* 促销专区 */
|
|
.cx{
|
|
width: 750rpx;
|
|
background-color: #ffffff;
|
|
border-radius: 40rpx;
|
|
margin-top: 30rpx;
|
|
padding-bottom: 15rpx;
|
|
height: 350rpx;
|
|
/* border: red solid 1rpx;*/
|
|
}
|
|
.cx-top{
|
|
border-radius: 40rpx 40rpx 0 0;
|
|
width: 750rpx;
|
|
height: 85rpx;
|
|
padding: 15rpx 30rpx 0;
|
|
box-sizing: border-box;
|
|
}
|
|
.cx-topl{
|
|
height: 70rpx;
|
|
font-size: 40rpx;
|
|
}
|
|
.cx-topl1{
|
|
color: #ff291e;
|
|
}
|
|
.cx-topl2{
|
|
color: #333333;
|
|
}
|
|
.cx-topl3{
|
|
display: inline-block;
|
|
width: 120rpx;
|
|
height: 40rpx;
|
|
background-color: #ff5502;
|
|
border-radius: 20rpx 0rpx 20rpx 0rpx;
|
|
text-align: center;
|
|
font-size: 24rpx;
|
|
color: #ffffff;
|
|
line-height: 40rpx;
|
|
margin-left: 20rpx;
|
|
}
|
|
.cx-topr{
|
|
height: 70rpx;
|
|
font-size: 24rpx;
|
|
color: #ee7b1e;
|
|
}
|
|
.cx-topr image{
|
|
width: 36rpx;
|
|
height: 36rpx;
|
|
margin-left: 10rpx;
|
|
}
|
|
|
|
|
|
.cx-goods{
|
|
|
|
margin-top: 15rpx;
|
|
padding: 0 30rpx;
|
|
float: left;
|
|
|
|
}
|
|
.cg{
|
|
|
|
width: 230rpx;
|
|
|
|
}
|
|
.cg-img image{
|
|
width: 180rpx;
|
|
height: 180rpx;
|
|
}
|
|
.cg-name{
|
|
font-size: 32rpx;
|
|
color: #ff291e;
|
|
line-height: 80rpx;
|
|
text-align: center;
|
|
}
|
|
.cg-name text{
|
|
color: #999999;
|
|
text-decoration: line-through;
|
|
font-size:28rpx;
|
|
margin-left: 15rpx;
|
|
} |