.parking-lock { height: calc(100vh - 88rpx); background-color: #f6f6ff; padding-top: 50rpx; .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; align-items: center; 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: #f00 !important; font-weight: 500; font-size: 34rpx; } .really-money { color: #fa7319 !important; } } } .parking-lock-pay-btn { width: calc(100% - 72rpx); margin: 0 auto 30rpx; 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: -1s; animation-delay: -1s; } .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); } } @keyframes stretchdelay { 0%, 40%, 100% { transform: scaleY(0.4); -webkit-transform: scaleY(0.4); } 20% { transform: scaleY(1); -webkit-transform: scaleY(1); } } .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; }