index.wxss 2.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156
  1. /**index.wxss**/
  2. page {
  3. height: 100vh;
  4. display: flex;
  5. flex-direction: column;
  6. }
  7. .user-container{
  8. height: 100%;
  9. display: flex;
  10. flex-direction: column;
  11. align-items: center;
  12. justify-content: space-between;
  13. padding: 40rpx;
  14. box-sizing: border-box;
  15. }
  16. .scrollarea {
  17. flex: 1;
  18. overflow-y: hidden;
  19. }
  20. .userinfo {
  21. display: flex;
  22. flex-direction: column;
  23. align-items: center;
  24. color: #aaa;
  25. width: 80%;
  26. }
  27. .userinfo-avatar {
  28. overflow: hidden;
  29. width: 128rpx;
  30. height: 128rpx;
  31. margin: 20rpx;
  32. border-radius: 50%;
  33. }
  34. .usermotto {
  35. margin-top: 200px;
  36. }
  37. .avatar-wrapper {
  38. padding: 0;
  39. width: 56px !important;
  40. border-radius: 8px;
  41. margin-top: 40rpx;
  42. margin-bottom: 40rpx;
  43. }
  44. .avatar {
  45. display: block;
  46. width: 56px;
  47. height: 56px;
  48. }
  49. .nickname-wrapper {
  50. display: flex;
  51. width: 100%;
  52. padding: 16px;
  53. box-sizing: border-box;
  54. color: black;
  55. }
  56. .nickname-label {
  57. width: 105px;
  58. }
  59. .nickname-input {
  60. text-align: center;
  61. flex: 1;
  62. }
  63. .login-in{
  64. display: flex;
  65. flex-direction: column;
  66. align-items: center;
  67. justify-content: center;
  68. }
  69. .user-title{
  70. width: 100%;
  71. font-weight: bold;
  72. color: #584735;
  73. text-align: left;
  74. font-size: 40rpx;
  75. margin: 20rpx 0 20rpx 0;
  76. }
  77. .user-zhanwei{
  78. width: 100%;
  79. height: 14px;
  80. margin-bottom: 20rpx;
  81. }
  82. .zhanwei-img{
  83. width: 100%;
  84. height: 14px;
  85. }
  86. /* 功能按钮区域 */
  87. .function-section {
  88. width: 100%;
  89. flex: 1;
  90. display: flex;
  91. flex-direction: column;
  92. }
  93. .main-buttons {
  94. margin-bottom: 20rpx;
  95. }
  96. .btn-reserve {
  97. background: url('https://swkz-1332577016.cos.ap-guangzhou.myqcloud.com/karamay/preview-btn.png');
  98. width: 100%;
  99. height: 130rpx;
  100. border-radius: 10rpx;
  101. display: flex;
  102. justify-content: center;
  103. align-items: center;
  104. background-size: 100% auto;
  105. color: #fff;
  106. font-size: 32rpx;
  107. font-weight: bold;
  108. }
  109. .btn-people {
  110. display: flex;
  111. justify-content: center;
  112. align-items: center;
  113. width: 100%;
  114. height: 130rpx;
  115. background: url('https://swkz-1332577016.cos.ap-guangzhou.myqcloud.com/karamay/btn_02.png');
  116. background-size: 100% auto;
  117. border-radius: 10rpx;
  118. border: 2rpx solid #94765A;
  119. margin-top: 20rpx;
  120. color: #fff;
  121. font-size: 32rpx;
  122. }
  123. .btn-feed{
  124. display: flex;
  125. justify-content: center;
  126. align-items: center;
  127. width: 100%;
  128. height: 130rpx;
  129. background: #fff;
  130. border-radius: 5px 5px 5px 5px;
  131. border: 1px solid #FFFFFF;
  132. color: #C8583D;
  133. margin-bottom: 20rpx;
  134. }
  135. .btn-out{
  136. display: flex;
  137. justify-content: center;
  138. align-items: center;
  139. width: 100%;
  140. height: 130rpx;
  141. border-radius: 5px 5px 5px 5px;
  142. border: 1px solid #D9D9D9;
  143. color: #584735;
  144. }