rankbox.wxss 3.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234
  1. /* pages/rankbox/rankbox.wxss */
  2. .topBox{
  3. position: fixed;
  4. z-index: 14;
  5. width: 750rpx;
  6. overflow: hidden;
  7. top: 0;
  8. left: 0;
  9. }
  10. .topImg{
  11. position: absolute;
  12. top: 0;
  13. left: 0;
  14. z-index: 9;
  15. width: 750rpx;
  16. height: 634rpx;
  17. }
  18. .title{
  19. position: relative;
  20. z-index: 10;
  21. font-family: PingFangSC-Regular,Source Han Sans CN ExtraLight;
  22. font-size: 36rpx;
  23. color: #FFFFFF;
  24. text-align: center;
  25. }
  26. .lastImg{
  27. display: block;
  28. position: absolute;
  29. left: 40rpx;
  30. margin-top:24rpx;
  31. width:36rpx;
  32. height: 36rpx;
  33. z-index: 11;
  34. }
  35. .nameCardBox{
  36. display: block;
  37. position: relative;
  38. width: 670rpx;
  39. background: #FFFFFF;
  40. box-shadow: 0 4rpx 20rpx 0 rgba(36,158,251,0.23);
  41. border-radius: 10px;
  42. margin: -240rpx auto 0;
  43. z-index: 9;
  44. overflow: hidden;
  45. }
  46. .rankcirclebg{
  47. position: relative;
  48. display: block;
  49. width: 100%;
  50. height:192rpx;
  51. margin-top: -110rpx;
  52. z-index: 10;
  53. }
  54. view.mypersonbox{
  55. display: block;
  56. position: absolute;
  57. z-index: 12;
  58. width: 670rpx;
  59. bottom: 200rpx;
  60. left: 40rpx;
  61. }
  62. .headimg{
  63. display: block;
  64. width: 140rpx;
  65. height:140rpx;
  66. border-radius: 50%;
  67. margin: 0 auto;
  68. }
  69. .persoName{
  70. margin-top: 16rpx;
  71. }
  72. .lineimg{
  73. display: block;
  74. width: 2rpx;
  75. height: 112rpx;
  76. }
  77. .customernum{
  78. margin-top: 4rpx;
  79. }
  80. .sharebox{
  81. display: block;
  82. width: 320rpx;
  83. text-align: center;
  84. }
  85. .ranklist{
  86. display: block;
  87. padding: 0 20rpx;
  88. margin-top: -90rpx;
  89. position: relative;
  90. z-index: 11;
  91. /* padding-bottom: 200rpx; */
  92. }
  93. .rankbox{
  94. display: block;
  95. width: 100%;
  96. border-bottom: 1px solid rgba(164,185,201,0.41);
  97. }
  98. .rankbox view{
  99. line-height: 50rpx;
  100. padding-bottom: 22rpx;
  101. }
  102. .nowsharetit{
  103. font-size: 18px;
  104. color: #0091FF;
  105. position: relative;
  106. }
  107. .nowsharetit::before{
  108. content: " ";
  109. display: block;
  110. width: 74rpx;
  111. height:10rpx;
  112. position: absolute;
  113. bottom: 0;
  114. left: 50%;
  115. margin-left: -37rpx;
  116. background: #249EFB;
  117. border-radius: 5rpx;
  118. }
  119. .ranklistbox{
  120. display: block;
  121. padding: 0 20rpx;
  122. }
  123. .everyranklist{
  124. display: block;
  125. width: 100%;
  126. border-bottom: 2rpx dashed #eaf0f4;
  127. height: 120rpx;
  128. box-sizing: border-box;
  129. }
  130. .numbox{
  131. display: block;
  132. width: 100rpx;
  133. text-align: center;
  134. line-height: 118rpx;
  135. font-size: 24rpx;
  136. }
  137. .firstbox{
  138. transform: rotate(12deg);
  139. font-size: 48rpx;
  140. color: #F7B500;
  141. line-height: 118rpx;
  142. }
  143. .secondbox{
  144. transform: rotate(12deg);
  145. font-size: 48rpx;
  146. color: #CCD1D7;
  147. line-height: 118rpx;
  148. }
  149. .thirdbox{
  150. transform: rotate(12deg);
  151. font-size: 48rpx;
  152. color: #CCAA6F;
  153. line-height: 118rpx;
  154. }
  155. .everyheadimg{
  156. display: block;
  157. width: 80rpx;
  158. height: 80rpx;
  159. position: relative;
  160. top: 19rpx;
  161. }
  162. .rankcrown{
  163. display: block;
  164. width: 32rpx;
  165. height: 32rpx;
  166. position: absolute;
  167. bottom: -6rpx;
  168. right: -6rpx;
  169. }
  170. .everyname{
  171. color: #262628;
  172. line-height: 118rpx;
  173. margin-left: 16rpx;
  174. width: 300rpx;
  175. }
  176. .everynumbox{
  177. display: block;
  178. width: 160rpx;
  179. color: #F7B500;
  180. text-align: right;
  181. line-height: 118rpx;
  182. }
  183. .myrankbox{
  184. position: fixed;
  185. width: 100%;
  186. left: 0;
  187. bottom: 0;
  188. height: 196rpx;
  189. z-index: 20;
  190. background: #FFFFFF;
  191. box-shadow: 0 4rpx 20rpx 0 rgba(56,72,85,0.35);
  192. }
  193. .myheadimg{
  194. margin-left: 60rpx;
  195. display: block;
  196. width: 114rpx;
  197. height: 114rpx;
  198. border-radius: 50%;
  199. position: relative;
  200. top: 36rpx;
  201. }
  202. .mypersonmsg{
  203. display: block;
  204. margin-left: 20rpx;
  205. position: relative;
  206. top: 56rpx;
  207. width: 300rpx;
  208. }
  209. .ranknumbox{
  210. display: block;
  211. width: 200rpx;
  212. text-align: center;
  213. position: relative;
  214. top:44rpx;
  215. }
  216. .stickybox,.weui-sticky__fixed,.rankbox {
  217. display: block;
  218. width: 100%;
  219. background: #FFFFFF;
  220. }