myEdit.wxss 3.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240
  1. .avatar-wrapper {
  2. overflow: hidden;
  3. padding: 0;
  4. border-radius: 8px;
  5. margin: 50rpx 0rpx;
  6. border: none;
  7. }
  8. .avatar {
  9. margin: 0 auto;
  10. display: block;
  11. width: 140rpx;
  12. height: 140rpx;
  13. border-radius: 50%;
  14. }
  15. .container {
  16. display: flex;
  17. }
  18. .setting-info {
  19. width: 100%;
  20. height: 100%;
  21. overflow: hidden;
  22. padding: 0 17rpx;
  23. font-size: 32rpx;
  24. color: #5E5E5E;
  25. background: #F7F7F7;
  26. overflow-x: hidden;
  27. }
  28. .nickname-box {
  29. margin-top: 34rpx;
  30. width: 716rpx;
  31. height: 88rpx;
  32. position: relative;
  33. box-sizing: border-box;
  34. padding: 22rpx 0 22rpx 26rpx;
  35. display: flex;
  36. align-items: center;
  37. background: #FFFFFF;
  38. border-radius: 12rpx;
  39. }
  40. .nickname-box,
  41. .grade {
  42. margin-top: 20rpx;
  43. }
  44. .user-action {
  45. /* min-width: 100rpx; */
  46. /* max-width: 400rpx; */
  47. width: 74%;
  48. }
  49. .nickname {
  50. width: 74%;
  51. }
  52. .setting-title {
  53. display: inline-block;
  54. width: 145rpx;
  55. text-align: center;
  56. }
  57. .placeholderStyle {
  58. font-size: 32rpx;
  59. color: #737373;
  60. }
  61. .edit-img {
  62. position: absolute;
  63. right: 50rpx;
  64. top: 24rpx;
  65. width: 22rpx;
  66. height: 32rpx;
  67. }
  68. .icon {
  69. width: 100%;
  70. height: 100%;
  71. }
  72. .sex-box {
  73. margin-top: 20rpx;
  74. width: 716rpx;
  75. height: 88rpx;
  76. box-sizing: border-box;
  77. display: flex;
  78. align-items: center;
  79. background: #FFFFFF;
  80. padding: 22rpx 0 22rpx 26rpx;
  81. border-radius: 12rpx;
  82. }
  83. .school-title,
  84. .radio-each,
  85. .birthday-title,
  86. .occupation-title {
  87. margin-right: 30rpx;
  88. }
  89. .radio-group {
  90. display: flex;
  91. height: 42rpx;
  92. overflow: hidden;
  93. /* margin-top: -8rpx; */
  94. }
  95. /* .sex-title{
  96. position: relative;
  97. top: 10rpx;
  98. } */
  99. .radio {
  100. margin-right: 50rpx;
  101. display: flex;
  102. }
  103. radio .wx-radio-input.wx-radio-input-checked::before {
  104. border-radius: 50%;
  105. width: 8rpx;
  106. height: 8rpx;
  107. text-align: center;
  108. font-size: 0rpx;
  109. /* 对勾大小 去掉 */
  110. background-color: #FF5E00;
  111. transform: translate(-50%, -50%) scale(1);
  112. -webkit-transform: translate(-50%, -50%) scale(1);
  113. }
  114. radio {
  115. margin-left: 20rpx;
  116. border-radius: 50%;
  117. width: 28rpx;
  118. /* 最好是4的倍数,不然会不在中间 */
  119. height: 28rpx;
  120. border: 4rpx solid #FF8100;
  121. /* 设置边框(外圆) */
  122. font-size: 0;
  123. /* 让边框重合 */
  124. margin-top: 6rpx;
  125. }
  126. radio .wx-radio-input {
  127. border-radius: 50%;
  128. width: 28rpx;
  129. height: 28rpx;
  130. border: none;
  131. /* 替换边框(隐藏原有边框) */
  132. }
  133. radio .wx-radio-input.wx-radio-input-checked {
  134. border: none;
  135. background: #f00;
  136. }
  137. .birthday-box {
  138. margin-top: 20rpx;
  139. width: 716rpx;
  140. height: 88rpx;
  141. box-sizing: border-box;
  142. display: flex;
  143. align-items: center;
  144. background: #FFFFFF;
  145. padding: 22rpx 0 22rpx 26rpx;
  146. border-radius: 12rpx;
  147. position: relative;
  148. overflow: hidden;
  149. }
  150. .occupation-box {
  151. margin-top: 20rpx;
  152. width: 716rpx;
  153. height: 88rpx;
  154. box-sizing: border-box;
  155. display: flex;
  156. align-items: center;
  157. background: #FFFFFF;
  158. padding: 22rpx 0 22rpx 26rpx;
  159. border-radius: 12rpx;
  160. }
  161. .school-box {
  162. margin-top: 20rpx;
  163. width: 716rpx;
  164. height: 88rpx;
  165. box-sizing: border-box;
  166. display: flex;
  167. align-items: center;
  168. background: #FFFFFF;
  169. padding: 22rpx 0 22rpx 26rpx;
  170. border-radius: 12rpx;
  171. position: relative;
  172. }
  173. .address {
  174. /* width: 420rpx; */
  175. /* height: 88rpx; */
  176. width: 74%;
  177. }
  178. .edit-image {
  179. position: absolute;
  180. right: 50rpx;
  181. top: 24rpx;
  182. width: 22rpx;
  183. height: 32rpx;
  184. }
  185. .submit-btn {
  186. margin-top: 92rpx;
  187. width: 716rpx;
  188. height: 200rpx;
  189. display: flex;
  190. justify-content: center;
  191. align-items: center;
  192. }
  193. .btn {
  194. font-size: 40rpx;
  195. color: #FFFFFF;
  196. width: 464rpx;
  197. line-height: 80rpx;
  198. border-radius: 80rpx;
  199. background: #FF9209;
  200. }
  201. picker {
  202. width: 100%;
  203. }
  204. .avatar-text {
  205. width: 100%;
  206. font-size: 34rpx;
  207. color: rgb(0, 162, 255);
  208. text-align: center;
  209. margin-top: 24rpx;
  210. }