myEdit.wxss 4.0 KB

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