/* invitationCode/index.wxss */ page{ overflow: hidden; } .main{ height: 100vh; background-size: cover; background-position: center; padding-top: 5vh; box-sizing: border-box; } .top-left{ position: fixed; top: -85rpx; left: -70rpx; width: 500rpx; z-index: 100; } .top-right{ position: fixed; top: -50rpx; right: 0; width: 300rpx; transform: rotate(-12deg); z-index: 100; } .bottom-left{ position: fixed; bottom: 113rpx; left: -50rpx; width: 300rpx; z-index: 100; } .bottom-right{ position: fixed; bottom: 113rpx; right: -60rpx; width: 180rpx; z-index: 100; } .qrcode-box{ height: 78vh; width: 94vw; background-size: 100%,100%; margin: 0 3vw -0 3vw; background-repeat: no-repeat; padding-top: 80rpx; box-sizing: border-box; text-align: center; } .qrcode-box .head{ width: 126rpx; height: 126rpx; background: white; border-radius: 50%; margin-bottom: 16rpx; } .qrcode-box .name{ font-size: 34rpx; font-weight: 400; color: #ffffff; margin-bottom: 22rpx; } .qrcode-box .code{ font-size: 28rpx; font-weight: 400; color: #ffffff; margin-bottom: 100rpx; } .qrcode-box .qr-box{ width: 402rpx; height: 402rpx; background: white; box-sizing: border-box; padding: 22rpx 25rpx; margin: 0 auto; margin-bottom: 24rpx; border-radius: 10rpx; } .qrcode-box .qr-box image{ height: 358rpx; width: 352rpx; background: #f6f6f6; } .qrcode-box .tip{ font-size: 34rpx; font-weight: 400; color: #ffffff; } .bottom{ position: fixed; bottom: 24rpx; left: 50%; transform: translateX(-50%); height: 12vh; } .btn1{ width: 294rpx; line-height: 60rpx; background: #f1ffdf; border: 1px solid #9ddb52; border-radius: 31rpx; text-align: center; font-size: 28rpx; font-weight: 700; color: #9ddb52; margin-bottom: 20rpx; } .btn2{ width: 294rpx; line-height: 60rpx; background: #9ddb52; color: white; border: 1px solid #9ddb52; border-radius: 31rpx; text-align: center; font-size: 28rpx; font-weight: 700; }