index.less 2.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121
  1. .container {
  2. position: relative;
  3. width: 750rpx;
  4. height: 100vh;
  5. background: linear-gradient(158deg, #FDD65D 0%, #FFD55D 17%, #FDCB4E 38%, #FE9F16 100%);
  6. .black {
  7. padding: 10rpx 30rpx;
  8. transform: rotate(180deg);
  9. width: 18rpx;
  10. height: 36rpx;
  11. opacity: 0.8;
  12. }
  13. .titleBox {
  14. text-align: center;
  15. color: #570D07;
  16. font-size: 30rpx;
  17. .t1 {
  18. margin: 10rpx 0;
  19. font-weight: 500;
  20. }
  21. .t2 {
  22. font-size: 20rpx;
  23. opacity: 0.9;
  24. }
  25. }
  26. .form {
  27. margin: 36rpx auto;
  28. width: 710rpx;
  29. background: #FFFFFF;
  30. border-radius: 20rpx;
  31. font-size: 28rpx;
  32. .row {
  33. position: relative;
  34. padding: 32rpx 47rpx;
  35. display: flex;
  36. align-items: center;
  37. .label {
  38. width: 150rpx;
  39. }
  40. .nickName {
  41. text-align: left;
  42. color: #666666;
  43. font-size: 26rpx;
  44. }
  45. .resetBtn {
  46. flex: 1;
  47. font-size: 26rpx;
  48. text-align: left;
  49. color: #555555;
  50. }
  51. }
  52. .r1:before {
  53. position: absolute;
  54. content: "请输入姓名";
  55. bottom: -4rpx;
  56. left: 194rpx;
  57. color: red;
  58. }
  59. .r2:before {
  60. position: absolute;
  61. content: "请输入手机号";
  62. bottom: -4rpx;
  63. left: 194rpx;
  64. color: red;
  65. }
  66. }
  67. .qrCodeBox {
  68. margin: 30rpx auto;
  69. width: 710rpx;
  70. box-sizing: border-box;
  71. padding: 65rpx 40rpx 37rpx;
  72. background: #FFFFFF;
  73. font-size: 30rpx;
  74. border-radius: 20rpx;
  75. text-align: center;
  76. .qrCode {
  77. margin: 38rpx 0;
  78. width: 256rpx;
  79. height: 256rpx;
  80. padding: 20rpx;
  81. border-radius: 20rpx;
  82. background-color: #FFF7E1;
  83. }
  84. .content {
  85. margin-top: 20rpx;
  86. text-align: left;
  87. }
  88. }
  89. .bottom {
  90. position: absolute;
  91. width: 100%;
  92. padding: 26rpx 0;
  93. bottom: 0;
  94. left: 0;
  95. background-color: white;
  96. .btn {
  97. margin: 0 auto;
  98. width: 466rpx;
  99. padding: 14rpx 0;
  100. background: linear-gradient(180deg, #6EC8FF 0%, #31BDFE 100%);
  101. border-radius: 39rpx;
  102. color: white;
  103. }
  104. }
  105. }