userCenter.wxss 1.6 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788
  1. page {
  2. background-color: #F4F4F4;
  3. font-size: 32rpx;
  4. font-family: PingFang-SC-Bold, PingFang-SC;
  5. position: relative;
  6. }
  7. .userPage {
  8. height: 100vh;
  9. position: relative;
  10. }
  11. .userPage .userTop {
  12. position: relative;
  13. width: 100%;
  14. box-sizing: border-box;
  15. padding: 50rpx 30rpx 65rpx;
  16. }
  17. .userPage .userTop image {
  18. width: 100%;
  19. position: absolute;
  20. left: 0;
  21. top: 0;
  22. z-index: -1;
  23. }
  24. .userPage .userTop .userTop-content {
  25. display: flex;
  26. align-items: center;
  27. }
  28. .userPage .userTop .avatar {
  29. width: 172rpx;
  30. height: 172rpx;
  31. border-radius: 50%;
  32. background-color: pink;
  33. margin-right: 30rpx;
  34. }
  35. .userPage .userTop .login {
  36. text-align: center;
  37. }
  38. .userPage .userTop .btn {
  39. width: 324rpx;
  40. height: 62rpx;
  41. line-height: 62rpx;
  42. background: #1E9F6A;
  43. border-radius: 8rpx 32rpx 8rpx 32rpx;
  44. color: #FFFFFF;
  45. margin: 40rpx auto;
  46. }
  47. .userPage .userOrder {
  48. margin: 20rpx 30rpx;
  49. padding: 40rpx 0;
  50. border-radius: 8rpx 56rpx 8rpx 8rpx;
  51. background-color: #ffffff;
  52. display: flex;
  53. font-size: 22rpx;
  54. font-weight: bold;
  55. color: #141328;
  56. text-align: center;
  57. }
  58. .userPage .userOrder .flex-item {
  59. flex: 1;
  60. }
  61. .userPage .userOrder .line {
  62. width: 1px;
  63. height: 48rpx;
  64. line-height: 48rpx;
  65. background: #141328;
  66. opacity: 0.29;
  67. margin: auto 0;
  68. }
  69. .userPage .signout {
  70. margin: 46rpx auto 0;
  71. padding: 24rpx 0;
  72. width: 438rpx;
  73. text-align: center;
  74. background: #E6E5E5;
  75. border-radius: 8rpx 56rpx 8rpx 56rpx;
  76. }
  77. .userPage .kefuicon {
  78. position: absolute;
  79. right: 30rpx;
  80. bottom: 0;
  81. }
  82. .userPage .kefuicon button::after {
  83. border: none;
  84. }
  85. .userPage .kefuicon image {
  86. width: 136rpx;
  87. }