NurseStationApp/pages/CommodityDetails/CommodityDetailsstyle.scss
2022-11-11 14:19:07 +08:00

295 lines
4.8 KiB
SCSS

.app {
padding: 0;
.mask {
.information {
width: 70%;
height: 400rpx;
margin: 50% auto;
background: #FFFFFF;
border-radius: 30rpx;
text-align: center;
color: #FFFFFF;
position: relative;
.determine,
.cancel {
width: 200rpx;
height: 70rpx;
border-radius: 26rpx;
font-size: 34rpx;
line-height: 70rpx;
position: absolute;
top: 74%;
}
.determine {
background: #4C7BC9;
right: 36rpx;
}
.cancel {
background: #C5BFBF;
left: 36rpx;
}
.title {
font-size: 42rpx;
margin-top: 40rpx;
color: #000000;
}
image {
width: 100rpx;
height: 100rpx;
margin: 10% 0 0 0;
}
}
}
.mask {
.PurchasePage {
position: fixed;
bottom: 0;
width: 100%;
background: #FFFFFF;
border-radius: 30rpx 30rpx 0px 0px;
font-size: 36rpx;
padding-bottom: 20rpx;
.close {
width: 31rpx;
height: 31rpx;
position: absolute;
top: 2%;
right: 2%;
}
.topcontent {
width: 90%;
margin: 0 auto;
padding-bottom: 24rpx;
border-bottom: 1rpx solid #D8D4D4;
position: relative;
.goodsStock{
font-size: 24rpx;
position: absolute;
top: 73%;
left: 75%;
}
.price {
color: #D43953;
position: absolute;
top: 70%;
left: 37%;
}
.title {
font-size: 36rpx;
position: absolute;
top: 0%;
left: 38%;
font-weight: 600;
width: 58%;
height: 85rpx;
}
.image {
width: 215rpx;
height: 215rpx;
background: rgba(150, 147, 148, 0.21);
margin: 35rpx 0 0 0;
image {
width: 201rpx;
height: 201rpx;
margin: 7rpx 0 0 7rpx;
}
}
}
.buy {
width: 60%;
height: 71rpx;
background: #4C7BC9;
color: #FFFFFF;
text-align: center;
line-height: 71rpx;
border-radius: 26rpx;
margin: 40rpx 0 0 20%;
}
.bottomcontent {
margin-top: 34rpx;
padding-bottom: 35rpx;
.header {
display: inline-block;
vertical-align: middle;
}
.number {
display: inline-block;
position: absolute;
right: 10%;
}
}
.centercontent {
margin-top: 34rpx;
font-size: 36rpx;
.header {
margin-bottom: 20rpx;
}
.productmodel {
font-size: 24rpx;
display: inline-block;
height: 60rpx;
border: 1rpx solid #D8D4D4;
line-height: 60rpx;
border-radius: 25rpx;
text-align: center;
padding: 0 15rpx;
margin: 15rpx 15rpx 0 0;
}
.Productmodel {
font-size: 24rpx;
display: inline-block;
height: 60rpx;
background: #ECF1FA;
border: 1rpx solid #4C7BC9;
line-height: 60rpx;
border-radius: 25rpx;
color: #4C7BC9;
text-align: center;
padding: 0 15rpx;
margin: 15rpx 15rpx 0 0;
}
}
}
}
.Purchasecolumn {
width: 100%;
height: 110rpx;
background: #FFFFFF;
position: fixed;
bottom: 0;
.buy {
width: 263rpx;
height: 80rpx;
background: #4C7BC9;
border-radius: 25rpx;
font-size: 38rpx;
color: #FFFFFF;
line-height: 80rpx;
text-align: center;
position: absolute;
right: 5%;
top: 15rpx;
}
}
.common {
padding-left: 5%;
}
.choice,
.Discount,
.service {
height: 80rpx;
background: #FFFFFF;
box-shadow: 0px 9px 31px 9px rgba(0, 0, 0, 0.03);
font-size: 34rpx;
line-height: 80rpx;
margin-bottom: 15rpx;
position: relative;
image {
width: 17rpx;
height: 26rpx;
position: absolute;
right: 5%;
top: 50%;
transform: translateY(-50%);
}
.content {
width: 65%;
display: inline-block;
position: absolute;
left: 25%;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
color: #000111;
}
.selected {
color: #969394;
display: inline-block;
}
}
.picture {
background: #FFFFFF;
box-shadow: 0px 9px 31px 9px rgba(0, 0, 0, 0.03);
position: relative;
padding-bottom: 110rpx;
.selected {
padding: 20rpx 0 0 5%;
color: #969394;
display: inline-block;
margin-bottom: 20rpx;
}
image {
margin-top: 20rpx;
height: 850rpx;
width: 100%;
}
}
.service {
height: 130rpx;
line-height: 65rpx;
.content {
display: inline-block;
position: absolute;
left: 25%;
}
.selected {
color: #969394;
display: inline-block;
}
}
.Commodity {
background: #FFFFFF;
margin: 15rpx 0 15rpx 0;
box-shadow: 0rpx 9rpx 31rpx 9rpx rgba(0, 0, 0, 0.03);
font-size: 36rpx;
line-height: 60rpx;
.name,
.number {
width: 100%;
display: inline-block;
line-height: 50rpx;
}
.price {
color: #D43953;
line-height: 70rpx;
}
.number {
padding-left: 30rpx;
}
}
}