new-person.css 3.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154
  1. html,
  2. body {
  3. background: #f5f5f5;
  4. font-family: PingFangSC-Regular;
  5. }
  6. .container{
  7. height: 100%;
  8. padding-bottom: 102rpx;
  9. }
  10. .header {
  11. width: 100%;
  12. height: 180rpx;
  13. background: #28aff0;
  14. color: #ffffff;
  15. box-sizing: border-box;
  16. padding-left: 32rpx;
  17. overflow: hidden;
  18. position: relative;
  19. }
  20. .header > view:first-child {
  21. font-size: 36rpx;
  22. margin: 48rpx 0 8rpx;
  23. }
  24. .header > view:nth-child(2) {
  25. font-size: 24rpx;
  26. }
  27. .header > image {
  28. width: 212rpx;
  29. height: 148rpx;
  30. position: absolute;
  31. top: 32rpx;
  32. right: 44rpx;
  33. }
  34. .cardBox {
  35. width: 100%;
  36. height: 432rpx;
  37. margin-top: 24rpx;
  38. margin-bottom: 88rpx;
  39. }
  40. .cardBox > .card {
  41. width: 100%;
  42. height: 100%;
  43. box-sizing: border-box;
  44. padding: 0 40rpx;
  45. background: #ffffff;
  46. box-shadow: 0 4rpx 8rpx 0 rgba(0, 0, 0, 0.03);
  47. border-radius: 8rpx;
  48. overflow: hidden
  49. }
  50. .cardBox > .card > view:first-child {
  51. margin: 42rpx 0 34rpx;
  52. display: flex;
  53. justify-content: space-between;
  54. position: relative;
  55. font-size: 28rpx;
  56. }
  57. .cardBox > .card > view:first-child > text:first-child {
  58. color: #333333;
  59. }
  60. .cardBox > .card > view:first-child > text:nth-child(2) {
  61. color: #3296fb;
  62. }
  63. .cardBox > .card > view:first-child > image {
  64. width: 28rpx;
  65. height: 28rpx;
  66. position: absolute;
  67. top: 6rpx;
  68. right: 124rpx;
  69. }
  70. .cardBox > .card > view:last-child {
  71. display: flex;
  72. justify-content: space-between;
  73. font-size: 30rpx;
  74. color: #3296fb;
  75. }
  76. .cardBox > .card > view:last-child > .cardItem {
  77. display: flex;
  78. flex-direction: column;
  79. justify-content: space-between;
  80. align-items: center;
  81. }
  82. .cardBox > .card > view:last-child > .cardItem > view {
  83. padding: 32rpx 44rpx;
  84. background: #ebf5ff;
  85. border-radius: 12rpx;
  86. margin-bottom: 32rpx;
  87. }
  88. .cardBox > .card > view:last-child > .cardItem > view > image {
  89. width: 204rpx;
  90. height: 132rpx;
  91. background: #ffffff;
  92. border-radius: 8rpx;
  93. }
  94. .pBox{
  95. background: #ffffff;
  96. }
  97. .pItem {
  98. box-sizing: border-box;
  99. padding: 28rpx 32rpx;
  100. /* background: #ffffff; */
  101. display: flex;
  102. justify-content: space-between;
  103. font-size: 32rpx;
  104. }
  105. .pItem > view {
  106. color: #333333;
  107. margin-right: 78rpx;
  108. }
  109. .pBox .pItem:nth-child(3)>view{
  110. margin-right: 142rpx;
  111. }
  112. .pItem > input {
  113. color: #666666;
  114. }
  115. .placeholderStyle {
  116. color: #cccccc;
  117. }
  118. .line {
  119. float: right;
  120. width: 718rpx;
  121. height: 1px;
  122. background-color: #eeeeee;
  123. -webkit-transform: scale(1, 0.5);
  124. transform: scale(1, 0.5);
  125. }
  126. .btnBox {
  127. position: fixed;
  128. bottom: 0;
  129. width: 100%;
  130. z-index: 100;
  131. background: #ffffff;
  132. box-sizing: border-box;
  133. padding: 12rpx 20rpx 0;
  134. }
  135. .btnBox-X {
  136. position: fixed;
  137. bottom: 0;
  138. width: 100%;
  139. z-index: 100;
  140. background: #ffffff;
  141. box-sizing: border-box;
  142. padding: 12rpx 20rpx 68rpx;
  143. }
  144. .btnBox > .btn,.btnBox-X > .btn {
  145. height: 90rpx;
  146. background: #3296fb;
  147. border-radius: 45rpx;
  148. color: #ffffff;
  149. font-family: PingFangSC-Medium;
  150. font-size: 32rpx;
  151. text-align: center;
  152. line-height: 90rpx;
  153. }