reader/salesperson/pages/fill/index.wxss

.container {
  position: relative;
  width: 750rpx;
  height: 100vh;
  background: linear-gradient(158deg, #FDD65D 0%, #FFD55D 17%, #FDCB4E 38%, #FE9F16 100%);
}
.container .black {
  padding: 10rpx 30rpx;
  transform: rotate(180deg);
  width: 18rpx;
  height: 36rpx;
  opacity: 0.8;
}
.container .titleBox {
  text-align: center;
  color: #570D07;
  font-size: 30rpx;
}
.container .titleBox .t1 {
  margin: 10rpx 0;
  font-weight: 500;
}
.container .titleBox .t2 {
  font-size: 20rpx;
  opacity: 0.9;
}
.container .form {
  margin: 36rpx auto;
  width: 710rpx;
  background: #FFFFFF;
  border-radius: 20rpx;
  font-size: 28rpx;
}
.container .form .row {
  padding: 32rpx 47rpx;
  display: flex;
  align-items: center;
}
.container .form .row .label {
  width: 150rpx;
}
.container .form .row .nickName {
  text-align: left;
  color: #666666;
  font-size: 26rpx;
}
.container .form .row .resetBtn {
  flex: 1;
  font-size: 26rpx;
  text-align: left;
  color: #555555;
}
.container .qrCodeBox {
  margin: 30rpx auto;
  width: 710rpx;
  box-sizing: border-box;
  padding: 65rpx 40rpx 37rpx;
  background: #FFFFFF;
  font-size: 30rpx;
  border-radius: 20rpx;
  text-align: center;
}
.container .qrCodeBox .qrCode {
  margin: 38rpx 0;
  width: 256rpx;
  height: 256rpx;
  padding: 20rpx;
  border-radius: 20rpx;
  background-color: #FFF7E1;
}
.container .qrCodeBox .content {
  margin-top: 20rpx;
  text-align: left;
}
.container .bottom {
  position: absolute;
  width: 100%;
  padding: 26rpx 0;
  bottom: 0;
  left: 0;
  background-color: white;
}
.container .bottom .btn {
  margin: 0 auto;
  width: 466rpx;
  padding: 14rpx 0;
  background: linear-gradient(180deg, #6EC8FF 0%, #31BDFE 100%);
  border-radius: 39rpx;
  color: white;
}