|
|
|
@charset "UTF-8";
|
|
|
|
/**
|
|
|
|
* 这里是uni-app内置的常用样式变量
|
|
|
|
*
|
|
|
|
* uni-app 官方扩展插件及插件市场(https://ext.dcloud.net.cn)上很多三方插件均使用了这些样式变量
|
|
|
|
* 如果你是插件开发者,建议你使用scss预处理,并在插件代码中直接使用这些变量(无需 import 这个文件),方便用户通过搭积木的方式开发整体风格一致的App
|
|
|
|
*
|
|
|
|
*/
|
|
|
|
/**
|
|
|
|
* 如果你是App开发者(插件使用者),你可以通过修改这些变量来定制自己的插件主题,实现自定义主题功能
|
|
|
|
*
|
|
|
|
* 如果你的项目同样使用了scss预处理,你也可以直接在你的 scss 代码中使用如下变量,同时无需 import 这个文件
|
|
|
|
*/
|
|
|
|
/* 颜色变量 */
|
|
|
|
/* 行为相关颜色 */
|
|
|
|
/* 文字基本颜色 */
|
|
|
|
/* 背景颜色 */
|
|
|
|
/* 边框颜色 */
|
|
|
|
/* 尺寸变量 */
|
|
|
|
/* 文字尺寸 */
|
|
|
|
/* 图片尺寸 */
|
|
|
|
/* Border Radius */
|
|
|
|
/* 水平间距 */
|
|
|
|
/* 垂直间距 */
|
|
|
|
/* 透明度 */
|
|
|
|
/* 文章场景相关 */
|
|
|
|
/* 字体大小 */
|
|
|
|
.font12 {
|
|
|
|
font-size: 12px;
|
|
|
|
}
|
|
|
|
.font13 {
|
|
|
|
font-size: 13px;
|
|
|
|
}
|
|
|
|
.font14 {
|
|
|
|
font-size: 14px;
|
|
|
|
}
|
|
|
|
.font15 {
|
|
|
|
font-size: 15px;
|
|
|
|
}
|
|
|
|
.font16 {
|
|
|
|
font-size: 16px;
|
|
|
|
}
|
|
|
|
.font18 {
|
|
|
|
font-size: 18px;
|
|
|
|
}
|
|
|
|
.font20 {
|
|
|
|
font-size: 20px;
|
|
|
|
}
|
|
|
|
.font24 {
|
|
|
|
font-size: 24px;
|
|
|
|
}
|
|
|
|
.font28 {
|
|
|
|
font-size: 28px;
|
|
|
|
}
|
|
|
|
.fontwig6 {
|
|
|
|
font-weight: 600;
|
|
|
|
}
|
|
|
|
/* 字体间距 */
|
|
|
|
.fontspec {
|
|
|
|
letter-spacing: 1px;
|
|
|
|
}
|
|
|
|
/* 字体行间距 */
|
|
|
|
.linehet {
|
|
|
|
line-height: 20px;
|
|
|
|
}
|
|
|
|
/* 字体位置 */
|
|
|
|
.fotlt {
|
|
|
|
text-align: left;
|
|
|
|
}
|
|
|
|
.fotrt {
|
|
|
|
text-align: right;
|
|
|
|
}
|
|
|
|
.fotct {
|
|
|
|
text-align: center;
|
|
|
|
}
|
|
|
|
.margle {
|
|
|
|
margin-left: 6px;
|
|
|
|
}
|
|
|
|
.marglerig {
|
|
|
|
margin-right: 5px;
|
|
|
|
}
|
|
|
|
.verc {
|
|
|
|
vertical-align: middle;
|
|
|
|
}
|
|
|
|
.versub {
|
|
|
|
vertical-align: sub;
|
|
|
|
}
|
|
|
|
.text1 {
|
|
|
|
overflow: hidden;
|
|
|
|
display: -webkit-box;
|
|
|
|
-webkit-line-clamp: 1;
|
|
|
|
-webkit-box-orient: vertical;
|
|
|
|
text-overflow: ellipsis;
|
|
|
|
}
|
|
|
|
.text2 {
|
|
|
|
overflow: hidden;
|
|
|
|
display: -webkit-box;
|
|
|
|
-webkit-line-clamp: 2;
|
|
|
|
-webkit-box-orient: vertical;
|
|
|
|
text-overflow: ellipsis;
|
|
|
|
}
|
|
|
|
/* 字体颜色 */
|
|
|
|
.fcor333 {
|
|
|
|
color: #333333;
|
|
|
|
}
|
|
|
|
.fcorfff {
|
|
|
|
color: #ffffff;
|
|
|
|
}
|
|
|
|
.fcor666 {
|
|
|
|
color: #666666;
|
|
|
|
}
|
|
|
|
.fcor999 {
|
|
|
|
color: #b2b2b2;
|
|
|
|
}
|
|
|
|
.fcor089 {
|
|
|
|
color: #089bf5;
|
|
|
|
}
|
|
|
|
.fcoreb5 {
|
|
|
|
color: #eb5823;
|
|
|
|
}
|
|
|
|
.fcorred {
|
|
|
|
color: red;
|
|
|
|
}
|
|
|
|
.fcor41c {
|
|
|
|
color: #41cda2;
|
|
|
|
}
|
|
|
|
/* 背景颜色 */
|
|
|
|
.backcor9 {
|
|
|
|
background-color: #f6f6f6;
|
|
|
|
}
|
|
|
|
.backcor9 {
|
|
|
|
background-color: #f6f6f6;
|
|
|
|
}
|
|
|
|
.backcorf06 {
|
|
|
|
background-color: #f06c7a;
|
|
|
|
}
|
|
|
|
.backcor89 {
|
|
|
|
background-color: #089bf5;
|
|
|
|
}
|
|
|
|
.backcorfff {
|
|
|
|
background-color: white;
|
|
|
|
}
|
|
|
|
.backshare {
|
|
|
|
background: transparent;
|
|
|
|
}
|
|
|
|
/* 页面布局 */
|
|
|
|
.width90 {
|
|
|
|
width: 90%;
|
|
|
|
margin-left: 5%;
|
|
|
|
}
|
|
|
|
.width80 {
|
|
|
|
width: 80%;
|
|
|
|
margin-left: 10%;
|
|
|
|
}
|
|
|
|
.width70 {
|
|
|
|
width: 70%;
|
|
|
|
}
|
|
|
|
.width15 {
|
|
|
|
width: 15%;
|
|
|
|
}
|
|
|
|
.width50 {
|
|
|
|
width: 50%;
|
|
|
|
}
|
|
|
|
.width60 {
|
|
|
|
width: 65%;
|
|
|
|
margin-left: 5%;
|
|
|
|
}
|
|
|
|
.width30 {
|
|
|
|
width: 30%;
|
|
|
|
}
|
|
|
|
.width95 {
|
|
|
|
width: 95%;
|
|
|
|
}
|
|
|
|
.width100 {
|
|
|
|
width: 100%;
|
|
|
|
}
|
|
|
|
.bor-botm1 {
|
|
|
|
border-bottom: 1px solid #f4f4f4;
|
|
|
|
}
|
|
|
|
/* 高40px */
|
|
|
|
.height45 {
|
|
|
|
height: 45px;
|
|
|
|
}
|
|
|
|
.height40 {
|
|
|
|
height: 40px;
|
|
|
|
}
|
|
|
|
.height22 {
|
|
|
|
height: 22px;
|
|
|
|
}
|
|
|
|
.height100 {
|
|
|
|
height: 100%;
|
|
|
|
}
|
|
|
|
.height10 {
|
|
|
|
height: 10px;
|
|
|
|
}
|
|
|
|
.height60 {
|
|
|
|
height: 60px;
|
|
|
|
}
|
|
|
|
.height30 {
|
|
|
|
height: 30px;
|
|
|
|
line-height: 30px;
|
|
|
|
}
|
|
|
|
.height40 {
|
|
|
|
height: 40px;
|
|
|
|
line-height: 40px;
|
|
|
|
}
|
|
|
|
.height20 {
|
|
|
|
height: 20px;
|
|
|
|
line-height: 20px;
|
|
|
|
}
|
|
|
|
.height50 {
|
|
|
|
height: 50px;
|
|
|
|
line-height: 50px;
|
|
|
|
}
|
|
|
|
/* 向上下外间距 */
|
|
|
|
.mart90 {
|
|
|
|
margin-top: 90px;
|
|
|
|
}
|
|
|
|
.mart60 {
|
|
|
|
margin-top: 60px;
|
|
|
|
}
|
|
|
|
.mart50 {
|
|
|
|
margin-top: 50px;
|
|
|
|
}
|
|
|
|
.mart40 {
|
|
|
|
margin-top: 40px;
|
|
|
|
}
|
|
|
|
.mart30 {
|
|
|
|
margin-top: 30px;
|
|
|
|
}
|
|
|
|
.mart15 {
|
|
|
|
margin-top: 15px;
|
|
|
|
}
|
|
|
|
.mart20 {
|
|
|
|
margin-top: 20px;
|
|
|
|
}
|
|
|
|
.mart10 {
|
|
|
|
margin-top: 10px;
|
|
|
|
}
|
|
|
|
.mart5 {
|
|
|
|
margin-top: 5px;
|
|
|
|
}
|
|
|
|
.marb65 {
|
|
|
|
margin-bottom: 65px;
|
|
|
|
}
|
|
|
|
.marb50 {
|
|
|
|
margin-bottom: 50px;
|
|
|
|
}
|
|
|
|
.marb40 {
|
|
|
|
margin-bottom: 40px;
|
|
|
|
}
|
|
|
|
.marb30 {
|
|
|
|
margin-bottom: 30px;
|
|
|
|
}
|
|
|
|
.marb20 {
|
|
|
|
margin-bottom: 20px;
|
|
|
|
}
|
|
|
|
.marb10 {
|
|
|
|
margin-bottom: 10px;
|
|
|
|
}
|
|
|
|
.marb5 {
|
|
|
|
margin-bottom: 5px;
|
|
|
|
}
|
|
|
|
/* 向上下内间距 */
|
|
|
|
.paddtop10 {
|
|
|
|
padding-top: 10px;
|
|
|
|
}
|
|
|
|
.paading10 {
|
|
|
|
padding: 10px;
|
|
|
|
}
|
|
|
|
.paddtop13 {
|
|
|
|
padding-top: 13px;
|
|
|
|
}
|
|
|
|
.paddleft10 {
|
|
|
|
padding-left: 10px;
|
|
|
|
}
|
|
|
|
.padleft15 {
|
|
|
|
padding-left: 15px;
|
|
|
|
}
|
|
|
|
.paddtright10 {
|
|
|
|
padding-right: 10px;
|
|
|
|
}
|
|
|
|
.paddbotm10 {
|
|
|
|
padding-bottom: 10px;
|
|
|
|
}
|
|
|
|
/* 左悬浮 */
|
|
|
|
.flleft {
|
|
|
|
float: left;
|
|
|
|
}
|
|
|
|
/* 右悬浮 */
|
|
|
|
.flright {
|
|
|
|
float: right;
|
|
|
|
}
|
|
|
|
/* button样式 */
|
|
|
|
.btnw70 {
|
|
|
|
width: 70%;
|
|
|
|
color: white;
|
|
|
|
margin-top: 40px;
|
|
|
|
background-color: #089bf5;
|
|
|
|
-webkit-border-radius: 6px;
|
|
|
|
border-radius: 6px;
|
|
|
|
}
|
|
|
|
/* 下滑线 */
|
|
|
|
.line1 {
|
|
|
|
height: 1px;
|
|
|
|
background-color: #f4f4f4;
|
|
|
|
}
|
|
|
|
.line10 {
|
|
|
|
height: 10px;
|
|
|
|
background-color: #f4f4f4;
|
|
|
|
}
|
|
|
|
.line1089 {
|
|
|
|
height: 10px;
|
|
|
|
background-color: #089bf5;
|
|
|
|
}
|
|
|
|
/* 展示样式 */
|
|
|
|
.displ {
|
|
|
|
display: inline-block;
|
|
|
|
}
|
|
|
|
page {
|
|
|
|
position: relative;
|
|
|
|
background-color: #fff;
|
|
|
|
}
|
|
|
|
@font-face {
|
|
|
|
font-family: 'HMfont-home';
|
|
|
|
src: url("data:application/x-font-woff2;charset=utf-8;base64,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
|
|
|
|
}
|
|
|
|
button::after {
|
|
|
|
border: none;
|
|
|
|
}
|
|
|
|
.pullDown-effects {
|
|
|
|
position: fixed;
|
|
|
|
top: 0;
|
|
|
|
z-index: 9;
|
|
|
|
width: 100%;
|
|
|
|
height: 36vw;
|
|
|
|
}
|
|
|
|
.pullDown-effects image {
|
|
|
|
width: 100%;
|
|
|
|
height: 36vw;
|
|
|
|
}
|
|
|
|
.status {
|
|
|
|
width: 100%;
|
|
|
|
height: 0;
|
|
|
|
position: fixed;
|
|
|
|
z-index: 10;
|
|
|
|
background-color: #fff;
|
|
|
|
top: 0;
|
|
|
|
}
|
|
|
|
.header {
|
|
|
|
width: 92%;
|
|
|
|
padding: 0 4%;
|
|
|
|
height: 100rpx;
|
|
|
|
display: -webkit-box;
|
|
|
|
display: -webkit-flex;
|
|
|
|
display: flex;
|
|
|
|
-webkit-box-align: center;
|
|
|
|
-webkit-align-items: center;
|
|
|
|
align-items: center;
|
|
|
|
position: fixed;
|
|
|
|
top: 0;
|
|
|
|
z-index: 10;
|
|
|
|
background-color: #fff;
|
|
|
|
}
|
|
|
|
.header .addr {
|
|
|
|
width: 120rpx;
|
|
|
|
height: 60rpx;
|
|
|
|
-webkit-flex-shrink: 0;
|
|
|
|
flex-shrink: 0;
|
|
|
|
display: -webkit-box;
|
|
|
|
display: -webkit-flex;
|
|
|
|
display: flex;
|
|
|
|
-webkit-box-align: center;
|
|
|
|
-webkit-align-items: center;
|
|
|
|
align-items: center;
|
|
|
|
font-size: 28rpx;
|
|
|
|
}
|
|
|
|
.header .addr .icon {
|
|
|
|
height: 60rpx;
|
|
|
|
margin-right: 5rpx;
|
|
|
|
display: -webkit-box;
|
|
|
|
display: -webkit-flex;
|
|
|
|
display: flex;
|
|
|
|
-webkit-box-align: center;
|
|
|
|
-webkit-align-items: center;
|
|
|
|
align-items: center;
|
|
|
|
font-size: 42rpx;
|
|
|
|
color: #ffc50a;
|
|
|
|
}
|
|
|
|
.header .input-box {
|
|
|
|
width: 100%;
|
|
|
|
height: 60rpx;
|
|
|
|
background-color: #f5f5f5;
|
|
|
|
-webkit-border-radius: 30rpx;
|
|
|
|
border-radius: 30rpx;
|
|
|
|
position: relative;
|
|
|
|
display: -webkit-box;
|
|
|
|
display: -webkit-flex;
|
|
|
|
display: flex;
|
|
|
|
-webkit-box-align: center;
|
|
|
|
-webkit-align-items: center;
|
|
|
|
align-items: center;
|
|
|
|
}
|
|
|
|
.header .input-box .icon {
|
|
|
|
display: -webkit-box;
|
|
|
|
display: -webkit-flex;
|
|
|
|
display: flex;
|
|
|
|
-webkit-box-align: center;
|
|
|
|
-webkit-align-items: center;
|
|
|
|
align-items: center;
|
|
|
|
position: absolute;
|
|
|
|
top: 0;
|
|
|
|
right: 0;
|
|
|
|
width: 60rpx;
|
|
|
|
height: 60rpx;
|
|
|
|
font-size: 34rpx;
|
|
|
|
color: #c0c0c0;
|
|
|
|
}
|
|
|
|
.header .input-box input {
|
|
|
|
padding-left: 28rpx;
|
|
|
|
height: 28rpx;
|
|
|
|
font-size: 28rpx;
|
|
|
|
}
|
|
|
|
.header .icon-btn {
|
|
|
|
width: 60rpx;
|
|
|
|
height: 60rpx;
|
|
|
|
-webkit-flex-shrink: 0;
|
|
|
|
flex-shrink: 0;
|
|
|
|
display: -webkit-box;
|
|
|
|
display: -webkit-flex;
|
|
|
|
display: flex;
|
|
|
|
}
|
|
|
|
.header .icon-btn .icon {
|
|
|
|
width: 60rpx;
|
|
|
|
height: 60rpx;
|
|
|
|
display: -webkit-box;
|
|
|
|
display: -webkit-flex;
|
|
|
|
display: flex;
|
|
|
|
-webkit-box-pack: center;
|
|
|
|
-webkit-justify-content: center;
|
|
|
|
justify-content: center;
|
|
|
|
-webkit-box-align: center;
|
|
|
|
-webkit-align-items: center;
|
|
|
|
align-items: center;
|
|
|
|
font-size: 42rpx;
|
|
|
|
background-color: transparent;
|
|
|
|
}
|
|
|
|
.place {
|
|
|
|
background-color: #ffffff;
|
|
|
|
height: 100rpx;
|
|
|
|
}
|
|
|
|
.swiper {
|
|
|
|
width: 100%;
|
|
|
|
margin-top: 10rpx;
|
|
|
|
display: -webkit-box;
|
|
|
|
display: -webkit-flex;
|
|
|
|
display: flex;
|
|
|
|
-webkit-box-pack: center;
|
|
|
|
-webkit-justify-content: center;
|
|
|
|
justify-content: center;
|
|
|
|
}
|
|
|
|
.swiper .swiper-box {
|
|
|
|
width: 92%;
|
|
|
|
height: 150px;
|
|
|
|
overflow: hidden;
|
|
|
|
-webkit-border-radius: 15rpx;
|
|
|
|
border-radius: 15rpx;
|
|
|
|
-webkit-box-shadow: 0rpx 8rpx 25rpx rgba(0, 0, 0, 0.2);
|
|
|
|
box-shadow: 0rpx 8rpx 25rpx rgba(0, 0, 0, 0.2);
|
|
|
|
position: relative;
|
|
|
|
z-index: 1;
|
|
|
|
}
|
|
|
|
.swiper .swiper-box swiper {
|
|
|
|
width: 100%;
|
|
|
|
height: 150px;
|
|
|
|
}
|
|
|
|
.swiper .swiper-box swiper swiper-item image {
|
|
|
|
width: 100%;
|
|
|
|
height: 150px;
|
|
|
|
}
|
|
|
|
.swiper .swiper-box .indicator {
|
|
|
|
position: absolute;
|
|
|
|
bottom: 20rpx;
|
|
|
|
left: 20rpx;
|
|
|
|
background-color: rgba(255, 255, 255, 0.4);
|
|
|
|
width: 150rpx;
|
|
|
|
height: 5rpx;
|
|
|
|
-webkit-border-radius: 3rpx;
|
|
|
|
border-radius: 3rpx;
|
|
|
|
overflow: hidden;
|
|
|
|
display: -webkit-box;
|
|
|
|
display: -webkit-flex;
|
|
|
|
display: flex;
|
|
|
|
}
|
|
|
|
.swiper .swiper-box .indicator .dots {
|
|
|
|
width: 0rpx;
|
|
|
|
background-color: white;
|
|
|
|
-webkit-transition: all 0.3s ease-out;
|
|
|
|
transition: all 0.3s ease-out;
|
|
|
|
}
|
|
|
|
.swiper .swiper-box .indicator .dots.on {
|
|
|
|
width: 33.33333%;
|
|
|
|
}
|
|
|
|
.category-list {
|
|
|
|
width: 92%;
|
|
|
|
margin: 0 4%;
|
|
|
|
padding: 0 0 30rpx 0;
|
|
|
|
border-bottom: solid 2rpx #f6f6f6;
|
|
|
|
display: -webkit-box;
|
|
|
|
display: -webkit-flex;
|
|
|
|
display: flex;
|
|
|
|
-webkit-box-pack: justify;
|
|
|
|
-webkit-justify-content: space-between;
|
|
|
|
justify-content: space-between;
|
|
|
|
-webkit-flex-wrap: wrap;
|
|
|
|
flex-wrap: wrap;
|
|
|
|
}
|
|
|
|
.category-list .category {
|
|
|
|
width: 25%;
|
|
|
|
margin-top: 50rpx;
|
|
|
|
display: -webkit-box;
|
|
|
|
display: -webkit-flex;
|
|
|
|
display: flex;
|
|
|
|
-webkit-flex-wrap: wrap;
|
|
|
|
flex-wrap: wrap;
|
|
|
|
}
|
|
|
|
.category-list .category .img {
|
|
|
|
width: 100%;
|
|
|
|
display: -webkit-box;
|
|
|
|
display: -webkit-flex;
|
|
|
|
display: flex;
|
|
|
|
-webkit-box-pack: center;
|
|
|
|
-webkit-justify-content: center;
|
|
|
|
justify-content: center;
|
|
|
|
}
|
|
|
|
.category-list .category .img image {
|
|
|
|
width: 9vw;
|
|
|
|
height: 9vw;
|
|
|
|
}
|
|
|
|
.category-list .category .text {
|
|
|
|
margin-top: 16rpx;
|
|
|
|
width: 100%;
|
|
|
|
display: -webkit-box;
|
|
|
|
display: -webkit-flex;
|
|
|
|
display: flex;
|
|
|
|
-webkit-box-pack: center;
|
|
|
|
-webkit-justify-content: center;
|
|
|
|
justify-content: center;
|
|
|
|
font-size: 24rpx;
|
|
|
|
color: #3c3c3c;
|
|
|
|
}
|
|
|
|
.banner {
|
|
|
|
width: 92%;
|
|
|
|
margin: 40rpx 4%;
|
|
|
|
}
|
|
|
|
.banner image {
|
|
|
|
width: 100%;
|
|
|
|
height: 20vw;
|
|
|
|
-webkit-border-radius: 10vw;
|
|
|
|
border-radius: 10vw;
|
|
|
|
}
|
|
|
|
.promotion {
|
|
|
|
width: 92%;
|
|
|
|
margin: 0 4%;
|
|
|
|
}
|
|
|
|
.promotion .text {
|
|
|
|
width: 100%;
|
|
|
|
height: 60rpx;
|
|
|
|
font-size: 34rpx;
|
|
|
|
font-weight: 600;
|
|
|
|
margin-top: -10rpx;
|
|
|
|
}
|
|
|
|
.promotion .list {
|
|
|
|
width: 100%;
|
|
|
|
display: -webkit-box;
|
|
|
|
display: -webkit-flex;
|
|
|
|
display: flex;
|
|
|
|
-webkit-box-pack: justify;
|
|
|
|
-webkit-justify-content: space-between;
|
|
|
|
justify-content: space-between;
|
|
|
|
}
|
|
|
|
.promotion .list .column {
|
|
|
|
width: 43%;
|
|
|
|
padding: 15rpx 3%;
|
|
|
|
background-color: #ebf9f9;
|
|
|
|
-webkit-border-radius: 10rpx;
|
|
|
|
border-radius: 10rpx;
|
|
|
|
overflow: hidden;
|
|
|
|
display: -webkit-box;
|
|
|
|
display: -webkit-flex;
|
|
|
|
display: flex;
|
|
|
|
-webkit-box-pack: justify;
|
|
|
|
-webkit-justify-content: space-between;
|
|
|
|
justify-content: space-between;
|
|
|
|
-webkit-flex-wrap: wrap;
|
|
|
|
flex-wrap: wrap;
|
|
|
|
}
|
|
|
|
.promotion .list .column .top {
|
|
|
|
width: 100%;
|
|
|
|
height: 40rpx;
|
|
|
|
display: -webkit-box;
|
|
|
|
display: -webkit-flex;
|
|
|
|
display: flex;
|
|
|
|
-webkit-box-align: center;
|
|
|
|
-webkit-align-items: center;
|
|
|
|
align-items: center;
|
|
|
|
margin-bottom: 5rpx;
|
|
|
|
}
|
|
|
|
.promotion .list .column .top .title {
|
|
|
|
font-size: 30rpx;
|
|
|
|
}
|
|
|
|
.promotion .list .column .top .countdown {
|
|
|
|
margin-left: 20rpx;
|
|
|
|
display: -webkit-box;
|
|
|
|
display: -webkit-flex;
|
|
|
|
display: flex;
|
|
|
|
height: 40rpx;
|
|
|
|
display: flex;
|
|
|
|
-webkit-box-align: center;
|
|
|
|
-webkit-align-items: center;
|
|
|
|
align-items: center;
|
|
|
|
font-size: 20rpx;
|
|
|
|
}
|
|
|
|
.promotion .list .column .top .countdown view {
|
|
|
|
height: 30rpx;
|
|
|
|
background-color: #f06c7a;
|
|
|
|
display: -webkit-box;
|
|
|
|
display: -webkit-flex;
|
|
|
|
display: flex;
|
|
|
|
-webkit-box-pack: center;
|
|
|
|
-webkit-justify-content: center;
|
|
|
|
justify-content: center;
|
|
|
|
-webkit-box-align: center;
|
|
|
|
-webkit-align-items: center;
|
|
|
|
align-items: center;
|
|
|
|
color: #fff;
|
|
|
|
-webkit-border-radius: 4rpx;
|
|
|
|
border-radius: 4rpx;
|
|
|
|
margin: 0 4rpx;
|
|
|
|
padding: 0 2rpx;
|
|
|
|
}
|
|
|
|
.promotion .list .column .left {
|
|
|
|
width: 50%;
|
|
|
|
height: 18.86vw;
|
|
|
|
display: -webkit-box;
|
|
|
|
display: -webkit-flex;
|
|
|
|
display: flex;
|
|
|
|
-webkit-flex-wrap: wrap;
|
|
|
|
flex-wrap: wrap;
|
|
|
|
-webkit-align-content: space-between;
|
|
|
|
align-content: space-between;
|
|
|
|
}
|
|
|
|
.promotion .list .column .left .ad {
|
|
|
|
margin-top: 5rpx;
|
|
|
|
width: 100%;
|
|
|
|
font-size: 22rpx;
|
|
|
|
color: #acb0b0;
|
|
|
|
}
|
|
|
|
.promotion .list .column .left .into {
|
|
|
|
width: 100%;
|
|
|
|
font-size: 24rpx;
|
|
|
|
color: #aaa;
|
|
|
|
margin-bottom: 5rpx;
|
|
|
|
}
|
|
|
|
.promotion .list .column .right {
|
|
|
|
width: 18.86vw;
|
|
|
|
height: 18.86vw;
|
|
|
|
}
|
|
|
|
.promotion .list .column .right image {
|
|
|
|
width: 18.86vw;
|
|
|
|
height: 18.86vw;
|
|
|
|
}
|
|
|
|
.goods-list .title {
|
|
|
|
width: 100%;
|
|
|
|
display: -webkit-box;
|
|
|
|
display: -webkit-flex;
|
|
|
|
display: flex;
|
|
|
|
-webkit-box-pack: center;
|
|
|
|
-webkit-justify-content: center;
|
|
|
|
justify-content: center;
|
|
|
|
-webkit-box-align: center;
|
|
|
|
-webkit-align-items: center;
|
|
|
|
align-items: center;
|
|
|
|
height: 80rpx;
|
|
|
|
color: #f47825;
|
|
|
|
font-size: 40rpx;
|
|
|
|
margin-top: 20rpx;
|
|
|
|
margin-bottom: 10px;
|
|
|
|
}
|
|
|
|
.goods-list .title image {
|
|
|
|
width: 30rpx;
|
|
|
|
height: 30rpx;
|
|
|
|
}
|
|
|
|
.goods-list .loading-text {
|
|
|
|
width: 100%;
|
|
|
|
display: -webkit-box;
|
|
|
|
display: -webkit-flex;
|
|
|
|
display: flex;
|
|
|
|
-webkit-box-pack: center;
|
|
|
|
-webkit-justify-content: center;
|
|
|
|
justify-content: center;
|
|
|
|
-webkit-box-align: center;
|
|
|
|
-webkit-align-items: center;
|
|
|
|
align-items: center;
|
|
|
|
height: 60rpx;
|
|
|
|
color: #979797;
|
|
|
|
font-size: 24rpx;
|
|
|
|
}
|
|
|
|
.goods-list .product-list {
|
|
|
|
width: 92%;
|
|
|
|
padding: 0 4% 3vw 4%;
|
|
|
|
display: -webkit-box;
|
|
|
|
display: -webkit-flex;
|
|
|
|
display: flex;
|
|
|
|
-webkit-box-pack: justify;
|
|
|
|
-webkit-justify-content: space-between;
|
|
|
|
justify-content: space-between;
|
|
|
|
-webkit-flex-wrap: wrap;
|
|
|
|
flex-wrap: wrap;
|
|
|
|
}
|
|
|
|
.goods-list .product-list .product {
|
|
|
|
width: 48%;
|
|
|
|
-webkit-border-radius: 20rpx;
|
|
|
|
border-radius: 20rpx;
|
|
|
|
background-color: #fff;
|
|
|
|
margin: 0 0 15rpx 0;
|
|
|
|
-webkit-box-shadow: 0rpx 5rpx 25rpx rgba(0, 0, 0, 0.1);
|
|
|
|
box-shadow: 0rpx 5rpx 25rpx rgba(0, 0, 0, 0.1);
|
|
|
|
}
|
|
|
|
.goods-list .product-list .product image {
|
|
|
|
width: 100%;
|
|
|
|
-webkit-border-radius: 20rpx 20rpx 0 0;
|
|
|
|
border-radius: 20rpx 20rpx 0 0;
|
|
|
|
}
|
|
|
|
.goods-list .product-list .product .name {
|
|
|
|
width: 92%;
|
|
|
|
padding: 10rpx 4%;
|
|
|
|
display: -webkit-box;
|
|
|
|
-webkit-box-orient: vertical;
|
|
|
|
-webkit-line-clamp: 2;
|
|
|
|
text-align: justify;
|
|
|
|
overflow: hidden;
|
|
|
|
font-size: 30rpx;
|
|
|
|
}
|
|
|
|
.goods-list .product-list .product .info {
|
|
|
|
display: -webkit-box;
|
|
|
|
display: -webkit-flex;
|
|
|
|
display: flex;
|
|
|
|
-webkit-box-pack: justify;
|
|
|
|
-webkit-justify-content: space-between;
|
|
|
|
justify-content: space-between;
|
|
|
|
-webkit-box-align: end;
|
|
|
|
-webkit-align-items: flex-end;
|
|
|
|
align-items: flex-end;
|
|
|
|
width: 92%;
|
|
|
|
padding: 10rpx 4% 10rpx 4%;
|
|
|
|
}
|
|
|
|
.goods-list .product-list .product .info .price {
|
|
|
|
color: #e65339;
|
|
|
|
font-size: 30rpx;
|
|
|
|
font-weight: 600;
|
|
|
|
}
|
|
|
|
.goods-list .product-list .product .info .slogan {
|
|
|
|
color: #807c87;
|
|
|
|
font-size: 24rpx;
|
|
|
|
text-decoration: line-through;
|
|
|
|
margin-right: 50px;
|
|
|
|
}
|
|
|
|
|