nurseWeChatAppletUI/pages/integral/integral.scss

520 lines
8.7 KiB
SCSS
Raw Normal View History

2023-03-06 11:41:01 +08:00
.app {
2023-03-06 16:36:02 +08:00
padding-bottom:10rpx ;
2023-03-06 11:41:01 +08:00
.masks {
z-index: 999;
}
2023-03-07 17:19:34 +08:00
.noorder {
margin-top: 20%;
}
2023-03-06 11:41:01 +08:00
.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;
}
}
.close {
width: 31rpx;
height: 31rpx;
position: absolute;
top: 2%;
right: 2%;
z-index: 999;
}
::v-deep .r-canvas {
2023-03-06 14:31:36 +08:00
width: 600rpx !important;
2023-03-06 11:41:01 +08:00
height: 1100rpx !important;
margin: 0 auto;
z-index: -1;
}
::v-deep .r-canvas-component {
2023-03-06 14:31:36 +08:00
width: 760rpx !important;
2023-03-06 11:41:01 +08:00
height: 1100rpx !important;
margin: 0 auto;
z-index: -1;
}
::v-deep .u-mode-center-box {
background: none !important;
}
2023-03-06 15:23:30 +08:00
::v-deep .u-icon--right{
2023-03-06 14:31:36 +08:00
background-color: #fff;
border-radius: 50%;
2023-03-06 15:23:30 +08:00
padding: 6rpx;
// width: 40rpx !important;
// height: 40rpx !important;
2023-03-06 14:31:36 +08:00
}
2023-03-06 15:23:30 +08:00
::v-deep .u-iconfont {
// position: absolute !important;
// left:50% !important;
// top:50% !important;
// transform: translate(-50%,-50%) !important;
2023-03-06 14:31:36 +08:00
}
::v-deep .u-close--top-right{
top:0 !important;
right:20rpx !important;
}
2023-03-06 11:41:01 +08:00
.yaoqbtn {
color: #fff;
position: absolute;
bottom: 0;
text-align: center;
2023-03-06 14:31:36 +08:00
line-height: 60rpx;
left: 60rpx;
width: 200rpx;
height: 60rpx;
2023-03-06 11:41:01 +08:00
background: linear-gradient(90deg, #85C8AE 0%, #03AD6B 59%);
border-radius: 36rpx;
}
.yaoqbtn2 {
color: #fff;
position: absolute;
text-align: center;
2023-03-06 14:31:36 +08:00
line-height: 60rpx;
2023-03-06 11:41:01 +08:00
bottom: 0;
2023-03-06 14:31:36 +08:00
right: 60rpx;
width: 200rpx;
height: 60rpx;
2023-03-06 11:41:01 +08:00
background: linear-gradient(90deg, #64B0F9 0%, #436BF6 59%);
border-radius: 36rpx;
}
.yaoqing {
height: 1200rpx;
}
.PurchasePage {
position: fixed;
bottom: 0;
2023-03-06 16:14:50 +08:00
height: 960rpx;
2023-03-06 11:41:01 +08:00
width: 100%;
background: #FFFFFF;
border-radius: 30rpx 30rpx 0px 0px;
font-size: 36rpx;
padding-bottom: 20rpx;
z-index: 10;
.bodys {
background-color: #FFFFFF;
width: 96%;
margin: 10rpx auto 0;
border-radius: 20rpx;
padding: 15rpx 0 20rpx;
position: relative;
.addressinfo {
font-size: 32rpx;
line-height: 65rpx;
margin-left: 90rpx;
image {
width: 40rpx;
height: 50rpx;
position: absolute;
top: 50%;
left: 20rpx;
transform: translateY(-50%);
}
.address {
padding-top: 10rpx;
width: 92%;
font-size: 30rpx;
word-break: break-all;
line-height: 45rpx;
}
.namephone {
width: 70%;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
}
.picture2 {
position: absolute;
top: 50%;
right: 20rpx;
transform: translateY(-50%);
image {
width: 18rpx;
height: 18rpx;
color: #FFFFFF;
margin-left: 20rpx;
}
}
}
}
.topcontent {
width: 96%;
margin: 0 auto;
padding-bottom: 15rpx;
position: relative;
.goodsStock {
font-size: 24rpx;
position: absolute;
top: 75%;
right: 10rpx;
}
.prices {
position: absolute;
top: 70%;
left: 35%;
.price {
color: #D43953;
}
}
.title {
font-size: 36rpx;
position: absolute;
top: 3%;
left: 35%;
font-weight: 600;
width: 58%;
// height: 85rpx;
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 3;
word-break: break-all;
}
.image {
width: 200rpx;
height: 200rpx;
margin: 15rpx 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;
position: absolute;
bottom: 30rpx;
left: 20%;
}
.centercontent {
font-size: 32rpx;
background-color: #FFFFFF;
margin-top: 10rpx;
padding-top: 20rpx;
border-radius: 20rpx;
.header {
margin-bottom: 20rpx;
margin-left: 17rpx;
}
.productmodel {
border: 4rpx solid #FFFFFF;
}
.Productmodel {
background: #ECF1FA;
border: 4rpx solid #4C7BC9;
color: #4C7BC9;
}
.productmodel,
.Productmodel {
background-color: #F6F6F6;
height: 300rpx;
text-align: center;
width: 30%;
font-size: 24rpx;
border-radius: 10rpx;
margin: 5rpx 1.5% 10rpx;
padding: 0 0 10rpx;
view {
background-color: #F6F6F6;
margin: 10rpx auto;
width: 98%;
// height: 90rpx;
border-radius: 10rpx;
font-size: 24rpx;
text-overflow: -o-ellipsis-lastline;
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 2;
line-clamp: 2;
-webkit-box-orient: vertical;
}
image {
border-radius: 10rpx;
width: 100%;
height: 200rpx;
}
}
}
}
.mask {
position: fixed;
bottom: 0;
height: 600rpx;
width: 100%;
background-color: #fff;
z-index: 10;
.maskitems {
color: #fff;
width: 90%;
margin: 60rpx auto 0;
.item {
background: #557BC2;
width: 100%;
margin: 0 auto 20rpx;
height: 150rpx;
position: relative;
font-size: 26rpx;
.btn {
text-align: center;
width: 120rpx;
height: 50rpx;
background: #FFFFFF;
border-radius: 22rpx;
position: absolute;
right: 30rpx;
top: 58rpx;
line-height: 50rpx;
font-size: 28rpx;
color: #557BC2;
}
.text {
position: absolute;
left: 150rpx;
top: 90rpx;
}
.titletext {
position: absolute;
left: 150rpx;
top: 48rpx;
}
image {
margin: 49rpx 0 0 43rpx;
width: 66rpx;
height: 66rpx;
}
}
}
.title {
padding-top: 10rpx;
font-size: 38rpx;
font-weight: 600;
text-align: center;
width: 100%;
}
}
.items {
margin-top: 30rpx;
.item {
width: 92%;
margin: 0 auto 12rpx;
background-color: #FFFFFF;
height: 220rpx;
position: relative;
.text {
font-size: 24rpx;
position: absolute;
left: 220rpx;
top: 90rpx;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis
}
.btn {
position: absolute;
right: 40rpx;
top: 140rpx;
width: 150rpx;
height: 50rpx;
background: #557BC2;
border-radius: 22rpx;
color: #fff;
text-align: center;
font-size: 28rpx;
color: #FFFFFF;
line-height: 50rpx;
}
.jifen {
position: absolute;
left: 220rpx;
top: 140rpx;
font-size: 26rpx;
color: #666666;
}
.title {
width: 460rpx;
font-size: 34rpx;
font-weight: 600;
position: absolute;
left: 220rpx;
top: 25rpx;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis
}
image {
margin: 15rpx 0 0 15rpx;
width: 180rpx;
height: 180rpx;
}
}
}
.titles {
margin: 38rpx 0 0 31rpx;
font-size: 30rpx;
}
.vacancies {
width: 92%;
height: 330rpx;
margin: 0 auto;
position: relative;
color: #fff;
.bottombutton {
position: absolute;
top: 230rpx;
left: 50%;
font-size: 32rpx;
color: #557BC2;
line-height: 72rpx;
text-align: center;
transform: translateX(-50%);
width: 440rpx;
height: 72rpx;
background: #FFFFFF;
border-radius: 36rpx;
}
.centertext {
position: absolute;
top: 160rpx;
width: 100%;
text-align: center;
font-size: 28rpx;
opacity: 0.8;
}
.title {
position: absolute;
left: 50%;
font-size: 70rpx;
top: 90rpx;
transform: translateX(-50%);
}
.righttext {
position: absolute;
top: 32rpx;
right: 31rpx;
font-size: 24rpx;
line-height: 28rpx;
width: 130rpx;
height: 28rpx;
image {
position: absolute;
left: 0;
width: 28rpx;
height: 28rpx;
}
view {
opacity: 0.6;
position: absolute;
right: 0;
}
}
.lefttext {
position: absolute;
top: 32rpx;
left: 33rpx;
font-size: 30rpx;
line-height: 33rpx;
}
image {
width: 100%;
height: 100%;
}
}
}