You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
 

284 lines
2.8 KiB

/* pages/user/completeData/index.wxss */
page{
width: 100%;
height: 100vh;
}
.page-box{
width: 100%;
height: 100%;
position: relative;
}
.bg-img-box{
width: 100%;
height: 100%;
position: absolute;
top: 0;
left: 0;
}
.bg-img-box image{
width: 100%;
height: 100%;
}
.mail-box{
width: 687rpx;
position: absolute;
top: 0;
left: 50%;
-webkit-transform: translateX(-50%);
transform: translateX(-50%);
}
.mail-box .mail-img-box{
position: absolute;
}
.mail-top,.mail-bottom{
z-index: 3;
}
.mail-top{
z-index: 4;
top: 10rpx;
/* top: 314rpx; */
}
.top-move{
-webkit-animation: topMove 2s ease;
animation: topMove 2s ease;
-webkit-animation-fill-mode: forwards;
animation-fill-mode: forwards;
}
.mail-top image{
width: 687rpx;
height: 445rpx;
}
.mail-center image{
width: 684rpx;
height: 648rpx;
-webkit-transform: scale(0.99);
transform: scale(0.99);
}
.mail-center{
top: 316rpx;
}
.mail-bottom image{
width: 687rpx;
height: 432rpx;
}
.mail-bottom{
top: 616rpx;
}
.btm-move{
-webkit-animation: btmMove 1.5s ease;
animation: btmMove 1.5s ease;
-webkit-animation-fill-mode: forwards;
animation-fill-mode: forwards;
}
@-webkit-keyframes topMove{
0% {
top: 10rpx;
opacity: 0.8;
}
100% {
top: 314rpx;
opacity: 1;
}
}
@keyframes topMove{
0% {
top: 10rpx;
opacity: 0.8;
}
100% {
top: 314rpx;
opacity: 1;
}
}
@-webkit-keyframes btmMove{
0% {
top: 616rpx;
opacity: 0.2;
}
100% {
top: 532rpx;
opacity: 1;
}
}
@keyframes btmMove{
0% {
top: 616rpx;
opacity: 0.2;
}
100% {
top: 532rpx;
opacity: 1;
}
}
.tips{
width: 100%;
color:#EFDACA;
font-size: 40rpx;
line-height: 56rpx;
position: absolute;
top: 1000rpx;
text-align: center;
}
.word-move{
-webkit-animation: wordMove 1s ease;
animation: wordMove 1s ease;
-webkit-animation-fill-mode: forwards;
animation-fill-mode: forwards;
}
@-webkit-keyframes wordMove{
0%{
left: -100%;
}
100%{
left: 0;
}
}
@keyframes wordMove{
0%{
left: -100%;
}
100%{
left: 0;
}
}
.pay-btn{
width: 686rpx;
height: 82rpx;
position: absolute;
top: 1100rpx;
left: 50%;
-webkit-transform: translateX(-50%);
transform: translateX(-50%);
background: -webkit-linear-gradient(128deg, #DEB99F 0%, #E9D1C0 51%, #E3C9B5 100%);
background: linear-gradient(322deg, #DEB99F 0%, #E9D1C0 51%, #E3C9B5 100%);
border-radius: 62rpx;
text-align: center;
line-height: 82rpx;
color: #946F46;
}
.tip{
width: 100%;
text-align: center;
color: #EFDACA;
font-size: 32rpx;
line-height: 44rpx;
position: absolute;
top: 1200rpx;
left: 50%;
-webkit-transform: translateX(-50%);
transform: translateX(-50%);
}