myCenter.wxss 2.0 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394959697
  1. /* 水平间距 */
  2. /* 水平间距 */
  3. .container.data-v-eea72321 {
  4. padding: 0 20rpx;
  5. min-height: 100vh;
  6. background-color: #f1f6fe;
  7. }
  8. .container .header.data-v-eea72321 {
  9. position: relative;
  10. width: 710rpx;
  11. height: 260rpx;
  12. text-align: end;
  13. }
  14. .container .header .header_img.data-v-eea72321 {
  15. margin-top: -24rpx;
  16. margin-right: -45rpx;
  17. width: 589rpx;
  18. height: 320rpx;
  19. }
  20. .container .header .user_photo.data-v-eea72321 {
  21. position: absolute;
  22. top: 80rpx;
  23. left: 20rpx;
  24. width: 120rpx;
  25. height: 120rpx;
  26. border-radius: 50%;
  27. }
  28. .container .header .user_name.data-v-eea72321 {
  29. position: absolute;
  30. top: 90rpx;
  31. left: 167rpx;
  32. font-size: 40rpx;
  33. font-weight: bold;
  34. }
  35. .container .header .user_grade.data-v-eea72321 {
  36. position: absolute;
  37. top: 160rpx;
  38. left: 167rpx;
  39. font-size: 24rpx;
  40. color: #666666;
  41. }
  42. .container .header .user_change.data-v-eea72321 {
  43. position: absolute;
  44. right: -20rpx;
  45. top: 80rpx;
  46. display: flex;
  47. justify-content: center;
  48. align-items: center;
  49. width: 171rpx;
  50. height: 67rpx;
  51. font-size: 24rpx;
  52. border-radius: 173rpx 0 0 173rpx;
  53. background-color: rgba(0, 97, 255, 0.05);
  54. }
  55. .container .header .user_change .img.data-v-eea72321 {
  56. margin-right: 10rpx;
  57. width: 29rpx;
  58. height: 29rpx;
  59. }
  60. .container .body.data-v-eea72321 {
  61. z-index: 1;
  62. position: relative;
  63. padding: 0 30rpx;
  64. border-radius: 8rpx;
  65. background-color: #fff;
  66. }
  67. .container .body .body_box.data-v-eea72321 {
  68. display: flex;
  69. align-items: center;
  70. height: 110rpx;
  71. }
  72. .container .body .body_box .box_img.data-v-eea72321 {
  73. width: 50rpx;
  74. height: 50rpx;
  75. border-radius: 50%;
  76. }
  77. .container .body .body_box .box_title.data-v-eea72321 {
  78. flex: 1;
  79. margin-left: 18rpx;
  80. font-size: 32rpx;
  81. }
  82. .container .body .body_box .box_icon.data-v-eea72321 {
  83. width: 31rpx;
  84. height: 31rpx;
  85. }
  86. .container .logout.data-v-eea72321 {
  87. position: absolute;
  88. bottom: 100rpx;
  89. display: flex;
  90. justify-content: center;
  91. align-items: center;
  92. width: 710rpx;
  93. height: 100rpx;
  94. font-size: 32rpx;
  95. border-radius: 8rpx;
  96. background-color: #fff;
  97. }