user.wxss 4.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180
  1. @charset "UTF-8";
  2. /* 页面左右间距 */
  3. /* 文字尺寸 */
  4. /*文字颜色*/
  5. /* 边框颜色 */
  6. /*颜色*/
  7. /* 图片加载中颜色 */
  8. /* 行为相关颜色 */
  9. /* 功能栏字体大小 */
  10. /*功能栏左侧小图标*/
  11. .content {
  12. line-height: 1;
  13. }
  14. .content .top {
  15. width: 750rpx;
  16. height: 370rpx;
  17. background: url(/static/images/bgi2.png) no-repeat top left;
  18. background-size: 750rpx 370rpx;
  19. display: -webkit-box;
  20. display: -webkit-flex;
  21. display: flex;
  22. -webkit-box-align: center;
  23. -webkit-align-items: center;
  24. align-items: center;
  25. padding-left: 55rpx;
  26. }
  27. .content .top .avater {
  28. width: 150rpx;
  29. height: 150rpx;
  30. margin-right: 28rpx;
  31. }
  32. .content .top .avater .avater-img {
  33. width: 100%;
  34. height: 100%;
  35. -webkit-border-radius: 50%;
  36. border-radius: 50%;
  37. }
  38. .content .top .name-box .name-top {
  39. font-size: 42rpx;
  40. font-weight: 400;
  41. color: #FFFFFF;
  42. margin-bottom: 15rpx;
  43. }
  44. .content .top .name-box .name-bottom {
  45. margin-top: 16rpx;
  46. display: -webkit-box;
  47. display: -webkit-flex;
  48. display: flex;
  49. -webkit-box-align: center;
  50. -webkit-align-items: center;
  51. align-items: center;
  52. }
  53. .content .top .name-box .name-bottom .nameInfo {
  54. color: #FFFFFF;
  55. padding: 6rpx 16rpx;
  56. border: 1rpx solid #FFFFFF;
  57. -webkit-border-radius: 12rpx;
  58. border-radius: 12rpx;
  59. }
  60. .content .top .name-box .name-footbox .name-foot {
  61. text-align: center;
  62. font-size: 22rpx;
  63. font-weight: 400;
  64. color: #FFFFFF;
  65. background: rgba(255, 255, 255, 0.2);
  66. border: 1px solid #FFFFFF;
  67. -webkit-border-radius: 20rpx;
  68. border-radius: 20rpx;
  69. padding: 3rpx 13rpx;
  70. }
  71. .content .center-box {
  72. width: 687rpx;
  73. background: #FFE8E8;
  74. -webkit-border-radius: 16rpx;
  75. border-radius: 16rpx;
  76. margin: -90rpx auto 0;
  77. }
  78. .content .center-box .center-top {
  79. width: 687rpx;
  80. height: 80rpx;
  81. background: #FFFFFF;
  82. -webkit-border-radius: 16rpx 16rpx 0 0;
  83. border-radius: 16rpx 16rpx 0 0;
  84. display: -webkit-box;
  85. display: -webkit-flex;
  86. display: flex;
  87. -webkit-box-align: center;
  88. -webkit-align-items: center;
  89. align-items: center;
  90. padding-left: 30rpx;
  91. }
  92. .content .center-box .center-top .top-left {
  93. width: 126rpx;
  94. line-height: 32rpx;
  95. text-align: center;
  96. background: -webkit-gradient(linear, left bottom, left top, from(#C90F1B), to(#F14D33));
  97. background: -webkit-linear-gradient(bottom, #C90F1B, #F14D33);
  98. background: linear-gradient(0deg, #C90F1B, #F14D33);
  99. font-size: 22rpx;
  100. font-weight: 400;
  101. color: #FFFFFF;
  102. -webkit-border-radius: 20rpx;
  103. border-radius: 20rpx;
  104. margin-right: 10rpx;
  105. }
  106. .content .center-box .center-top .top-right {
  107. font-size: 22rpx;
  108. font-weight: 400;
  109. color: #CB151D;
  110. }
  111. .content .center-box .center-foot {
  112. height: 155rpx;
  113. display: -webkit-box;
  114. display: -webkit-flex;
  115. display: flex;
  116. }
  117. .content .center-box .center-foot .foot-list {
  118. -webkit-box-flex: 1;
  119. -webkit-flex: 1;
  120. flex: 1;
  121. text-align: center;
  122. padding-top: 20rpx;
  123. }
  124. .content .center-box .center-foot .foot-list .list-top {
  125. font-size: 39rpx;
  126. font-weight: 400;
  127. color: #CB141D;
  128. line-height: 58rpx;
  129. }
  130. .content .center-box .center-foot .foot-list .list-foot {
  131. font-size: 39rpx;
  132. font-weight: 400;
  133. color: #666666;
  134. line-height: 58rpx;
  135. }
  136. .content .tt {
  137. margin: 20rpx auto 0;
  138. width: 700rpx;
  139. -webkit-box-shadow: 0px 0px 20rpx 0px rgba(49, 49, 52, 0.06);
  140. box-shadow: 0px 0px 20rpx 0px rgba(49, 49, 52, 0.06);
  141. -webkit-border-radius: 10rpx;
  142. border-radius: 10rpx;
  143. background-color: #ffffff;
  144. }
  145. .content .tt .tt-box {
  146. width: 700rpx;
  147. height: 100rpx;
  148. padding: 0 30rpx;
  149. display: -webkit-box;
  150. display: -webkit-flex;
  151. display: flex;
  152. -webkit-box-align: center;
  153. -webkit-align-items: center;
  154. align-items: center;
  155. }
  156. .content .tt .tt-box .tt-icon {
  157. width: 40rpx;
  158. height: 40rpx;
  159. }
  160. .content .tt .tt-box .tt-icon1 {
  161. width: 40rpx;
  162. height: 36rpx;
  163. }
  164. .content .tt .tt-box .tt-txt {
  165. margin-left: 20rpx;
  166. font-size: 28rpx;
  167. font-weight: 300;
  168. color: #000000;
  169. -webkit-box-flex: 1;
  170. -webkit-flex: 1;
  171. flex: 1;
  172. }
  173. .content .tt .tt-box .next-icon {
  174. width: 30rpx;
  175. height: 38rpx;
  176. }
  177. .content .tt .border-b {
  178. border-bottom: 1px solid #F1F1F1;
  179. }