.parking-lock { height: calc(100vh - 88rpx); background-color: #F6F6FF; padding-top: 10rpx; &-pay { margin-bottom: 30rpx; } .parking-lock-title { font-size: 46rpx; color: #292929; text-align: center; padding-top: 31rpx; line-height: 65rpx; font-family: PingFangSC-Regular, PingFang SC; font-weight: 400; } .parking-lock-tips { width: calc(100% - 72rpx); font-size: 30rpx; color: #777777; text-align: center; margin: 10rpx auto; line-height: 47rpx; } .parking-lock-info { width: calc(100% - 72rpx); margin: 30rpx auto; background-color: #fff; border-radius: 15rpx; padding: 39rpx 41rpx; .parking-lock-info-item { display: flex; margin-bottom: 16rpx; &:last-child { margin-bottom: 0; } view { font-size: 28rpx; &:first-child { width: 30%; color: #2A2A2A; font-weight: 500; } &:last-child { color: #6E6E6E; } } .weight { color: #2A2A2A!important; font-weight: 500; } .really-money { color: #FA7319!important; } } } .parking-lock-pay-btn { width: calc(100% - 72rpx); margin: 0 auto; button { width: 100%; height: 100rpx; line-height: 100rpx; background-color: #008CFF; border: none; color: #fff; box-shadow: 0px 7px 13px 0px rgba(16, 153, 250, 0.31); font-size: 28rpx; font-weight: 500; } } .parking-lock-begin-box { width: 441rpx; height: 441rpx; line-height: 441rpx; background: #31A2FF; background: linear-gradient(270deg, rgba(49,162,255,0.1) 20%, rgba(49,162,255,1) 100%); border-radius: 50%; text-align: center; margin: 0 auto; // animation: spin 3s linear infinite; .parking-lock-begin-bg { display: inline-block; width: 420rpx; height: 420rpx; line-height: 420rpx; vertical-align: middle; border: solid 12rpx #fff; background: linear-gradient(346deg, #008CFF 0%, #95CFFF 100%); border-radius: 50%; image { width: 194rpx; height: 239rpx; vertical-align: middle; } } } .parking-lock-begin-info { text-align: center; font-size: 50rpx; color: #008CFF; margin-top: 57rpx; } .parking-lock-loading-box { width: 441rpx; height: 441rpx; line-height: 441rpx; background: #31A2FF; background: linear-gradient(0deg, rgba(49,162,255,0.1) 20%, rgba(49,162,255,1) 100%); border-radius: 50%; text-align: center; margin: 0 auto; animation: spin 3s linear infinite; .parking-lock-loading-bg { display: inline-block; width: 420rpx; height: 420rpx; line-height: 420rpx; vertical-align: middle; border: solid 12rpx #fff; background: linear-gradient(346deg, #008CFF 0%, #95CFFF 100%); border-radius: 50%; image { width: 194rpx; height: 239rpx; vertical-align: middle; } } } .parking-lock-loading-info { text-align: center; font-size: 50rpx; color: #008CFF; margin-top: 57rpx; } .parking-lock-success { .parking-lock-success-box { width: 441rpx; height: 441rpx; margin: 0 auto; image { width: 100%; height: 100%; } } .parking-lock-success-info { color: #4CCD8A; font-size: 50rpx; text-align: center; margin: 56rpx 0 202rpx; } .parking-lock-success-button { width: calc(100% - 80rpx); margin: 0 auto; button { width: 100%; height: 100rpx; line-height: 100rpx; background-color: #008CFF; font-size: 28rpx; color: #fff; } } } } .pay-way { display: flex; justify-content: space-between; width: calc(100% - 34rpx); border-top: solid 1px #979797; margin: 23rpx auto; padding: 38rpx 86rpx; .pay-way-item { text-align: center; font-size: 30rpx; color: #5F5F5F; image { width: 143rpx; height: 143rpx; } } } .pay-way-close-btn { width: calc(100% - 34rpx); margin: 0 auto 68rpx; border: none; background-color: #3397FA; color: #fff; border-radius: 10rpx; } @keyframes rotate { 0%{ transform: rotate(0); } 50% { transform:rotate(200deg); } 100% { transform: rotate(0); } } @keyframes spin { from { transform: rotate(0); } to{ transform: rotate(359deg); } } .loadingSelect{ text-align: center; margin-top: 20rpx; } .spinner { margin: auto; width: 50px; height: 60px; text-align: center; font-size: 10px; } .spinner > view { background-color: #6495ED; height: 100%; width: 10rpx; margin-right: 2rpx; display: inline-block; -webkit-animation: stretchdelay 1.2s infinite ease-in-out; animation: stretchdelay 1.2s infinite ease-in-out; } .spinner .rect2 { -webkit-animation-delay: -1.1s; animation-delay: -1.1s; } .spinner .rect3 { -webkit-animation-delay: -1.0s; animation-delay: -1.0s; } .spinner .rect4 { -webkit-animation-delay: -0.9s; animation-delay: -0.9s; } .spinner .rect5 { -webkit-animation-delay: -0.8s; animation-delay: -0.8s; } @-webkit-keyframes stretchdelay { 0%, 40%, 100% { -webkit-transform: scaleY(0.4) } 20% { -webkit-transform: scaleY(1.0) } } @keyframes stretchdelay { 0%, 40%, 100% { transform: scaleY(0.4); -webkit-transform: scaleY(0.4); } 20% { transform: scaleY(1.0); -webkit-transform: scaleY(1.0); } } .new-plate-number{ margin-bottom: 70rpx; } .message-input-wrap{ margin: 0 -40rpx; } .message-input-wrap /deep/ .u-input ~ uni-view:last-of-type .u-char-item{ background-color: #E8FFE8; } .really-license-txt{ color: #008CFF; } .really-license-txt1{ color: #008CFF; margin: 20rpx; } .popup-vehicleNo-title{ font-size: 48rpx; text-align: center; padding-top: 20rpx; } .popup-vehicleNo-center{ width: 95%; height: 2rpx; border-top: solid rgb(146, 146, 146) 2rpx; margin: 30rpx 20rpx 50rpx 20rpx; } .popup-vehicleNo-select{ text-align: center; color: #777777; } .vehicleNo-btn{ display: flex; margin: 40rpx 0; } .parking-lock-pay-attention{ margin: 50rpx; line-height: 48rpx; color: #777777; }