Files
sykl-hy/pages/mall/submit/index.wxss

286 lines
4.5 KiB
Plaintext

page {
background-color: #f5f6f8;
padding: 30rpx;
box-sizing: border-box;
}
/* 地址 */
.address {
background-color: #FFFFFF;
border-radius: 20rpx;
overflow: hidden;
position: relative;
}
.address-arrow {
position: absolute;
right: 30rpx;
top: 80rpx;
width: 38rpx;
height: 38rpx;
}
.address-cont {
padding: 30rpx 30rpx 0;
box-sizing: border-box;
}
.address-area {
color: #585866;
font-size: 28rpx;
}
.address-text {
font-weight: 600;
padding: 10px 0;
}
.address-name text {
color: #585866;
padding-left: 30rpx;
}
.address-img {
width: 100%;
}
.address-add {
width: 100%;
text-align: center;
padding: 30rpx 30rpx 0;
box-sizing: border-box;
}
.address-go {
display: inline-block;
font-size: 28rpx;
line-height: 68rpx;
border-radius: 10rpx;
color: #df723a;
}
/* 商品 */
.good {
background-color: #FFFFFF;
border-radius: 20rpx;
overflow: hidden;
margin: 30rpx 0;
position: relative;
padding: 30rpx;
}
.good-img {
width: 160rpx;
height: 160rpx;
}
.good-cont {
position: absolute;
left: 0;
top: 0;
width: 100%;
padding: 30rpx 30rpx 0 220rpx;
box-sizing: border-box;
}
.good-name {
font-size: 30rpx;
}
.good-price {
color: #df723a;
}
.good-price text {
font-size: 26rpx;
padding-left: 10rpx;
}
.label-integral {
color: #6c78f8;
font-weight: 600;
}
.good-tips {
margin: 10rpx 0 25rpx;
color: #585866;
font-size: 28rpx;
}
/* 规格 */
.label {
background-color: #FFFFFF;
border-radius: 20rpx;
overflow: hidden;
box-sizing: border-box;
}
.label-item {
display: flex;
line-height: 100rpx;
color: #585866;
font-size: 30rpx;
padding: 0 30rpx;
box-sizing: border-box;
border-bottom: 2rpx solid rgb(243, 243, 243);
}
.label-item:last-child {
border: none;
}
.label-name {
flex: 1;
}
.label-price {
text-align: right;
line-height: 90rpx;
font-size: 30rpx;
font-weight: 600;
padding: 0 30rpx 5rpx;
box-sizing: border-box;
}
.label-price text {
font-size: 34rpx;
padding: 0 10rpx;
}
.label-number {
display: flex;
margin-top: 25rpx;
}
.number-btn {
background-color: #f1f1f1;
width: 48rpx;
height: 48rpx;
line-height: 46rpx;
text-align: center;
}
.number-input {
width: 80rpx;
text-align: center;
}
/* 底部 */
.footer {
width: 100%;
height: 60px;
background-color: #FFFFFF;
position: fixed;
left: 0;
bottom: 0;
z-index: 9;
padding: 8px 30rpx;
box-sizing: border-box;
display: flex;
}
.number {
flex: 1;
line-height: 44px;
color: #6c78f8;
}
.number text {
padding: 0 5rpx;
font-weight: 600;
font-size: 38rpx;
}
.btn {
height: 36px;
line-height: 36px;
background-color: #6c78f8;
text-align: center;
color: #FFFFFF;
border-radius: 60rpx;
font-size: 28rpx;
padding: 0 30rpx !important;
width: auto !important;
margin-top: 8rpx;
}
/* 兑换弹出 */
.exchangePop {
position: fixed;
width: 100%;
height: 100%;
background-color: rgba(0, 0, 0, .5);
left: 0;
top: 0;
display: none;
z-index: 9;
}
.exchangePop.active {
display: block;
}
.exchangeCont {
left: 10%;
top: 50%;
width: 80%;
margin-top: -200rpx;
position: fixed;
z-index: 100;
background-color: #FFFFFF;
border-radius: 20rpx;
overflow: hidden;
text-align: center;
padding: 40rpx;
display: none;
box-sizing: border-box;
}
.exchangeCont.active {
display: block;
}
.exchange-title {
text-align: center;
color: #2b2b2b;
font-weight: 600;
font-size: 34rpx;
}
.exchange-number {
font-size: 28rpx;
margin: 30rpx 0;
}
.exchange-number text {
color: #f31d23;
font-weight: 600;
padding: 0 5rpx;
}
.exchange-img {
display: block;
width: 80rpx;
height: 80rpx;
margin: 10rpx auto;
}
.exchange-btn {
display: flex;
}
.exchange-item {
line-height: 78rpx;
flex: 2;
text-align: center;
margin: 0 15rpx;
border: 2rpx solid #000;
border-radius: 50rpx;
background-color: #FFFFFF;
}
.exchange-item:last-child {
background-color: #f31d23;
color: #FFFFFF;
border-color: #f31d23;
}