rank.wxss 3.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212
  1. /* pages/rank/rank.wxss */
  2. page{
  3. background: #F7F7F7;
  4. }
  5. @keyframes around {
  6. from {
  7. margin-left: 90%;
  8. }
  9. to {
  10. /* var接受传入的变量 */
  11. margin-left: -100%;
  12. }
  13. }
  14. .zd{
  15. width: 40px;
  16. height: 100%;
  17. position: absolute;
  18. left: 0;
  19. top: 0;
  20. background: rgba(255, 244.8, 244.8, 1);
  21. }
  22. .marquee_container{
  23. width: 100%;
  24. background: rgba(255, 244.8, 244.8, 1);
  25. /* box-shadow:0px 4px 12px 0px rgba(0,0,0,0.08); */
  26. border-radius:4px;
  27. padding: 12.5px 12px;
  28. position: relative;
  29. overflow: hidden;
  30. height: 125rpx;
  31. }
  32. .marquee_container:hover{
  33. /* 不起作用 */
  34. animation-play-state: paused;
  35. }
  36. .marquee_text{
  37. color:#5C5C5C;
  38. font-size: 28rpx;
  39. /* display: flex; */
  40. white-space: nowrap;
  41. /* animation-name: around;
  42. animation-duration: 15s; /*过渡时间*/
  43. animation-iteration-count: infinite;
  44. animation-timing-function:linear;
  45. margin-left: 64rpx;
  46. }
  47. .marquee_text navigator{
  48. margin-right: 20px;
  49. }
  50. .marquee_text text{
  51. display: block;
  52. color:#5C5C5C;
  53. font-size: 26rpx;
  54. margin-top: 5rpx;
  55. }
  56. .marquee_container .notice{
  57. width: 34rpx;
  58. height: 34rpx;
  59. position: absolute;
  60. left: 10px;
  61. top: 46rpx;
  62. }
  63. .marquee_container .signupPoint{
  64. width: 34rpx;
  65. height: 34rpx;
  66. position: absolute;
  67. right: 10px;
  68. top: 46rpx;
  69. }
  70. ._top{
  71. background: #D94B24;
  72. text-align: center;
  73. color: #fff;
  74. font-size: 32rpx;
  75. position: relative;
  76. line-height: 80rpx;
  77. }
  78. .date-picker{
  79. margin-top: 20rpx;
  80. }
  81. .date-picker image{
  82. height: 30rpx;
  83. position: relative;
  84. top: 4rpx;
  85. }
  86. .search{
  87. height: 45rpx;
  88. position: absolute;
  89. right: 30rpx;
  90. bottom: 0rpx;
  91. }
  92. .search image{
  93. height: 45rpx;
  94. }
  95. .game_info{
  96. position: relative;
  97. padding: 20rpx 20rpx 0;
  98. /* padding-left: 150rpx; */
  99. background: #fff;
  100. color: #333;
  101. font-size: 28rpx;
  102. text-align: center;
  103. }
  104. /* .game_info image{ */
  105. /* width: 80rpx;
  106. position: absolute;
  107. left: 50rpx;
  108. top: 0;
  109. bottom: 0;
  110. margin: auto; */
  111. /* } */
  112. .game_info .picker{
  113. display: block;
  114. font-size: 36rpx;
  115. font-weight: 500;
  116. color: #333;
  117. line-height: 50rpx;
  118. }
  119. .top{
  120. display: flex;
  121. font-size: 28rpx;
  122. padding: 24rpx 32rpx;
  123. background: #fff;
  124. margin-bottom: 20rpx;
  125. justify-content: space-between;
  126. }
  127. .item{
  128. display: flex;
  129. justify-content: space-between;
  130. font-size: 28rpx;
  131. padding: 16rpx 32rpx;
  132. }
  133. .item text{
  134. color: #333;
  135. width: 21%;
  136. text-align: right;
  137. }
  138. .item .red{
  139. color: #FF5151;
  140. }
  141. .top text{
  142. color: #999;
  143. }
  144. .item image{
  145. width: 36rpx;
  146. }
  147. .title image{
  148. width: 32rpx;
  149. position: relative;
  150. top: 7rpx;
  151. }
  152. .list{
  153. background: #fff;
  154. padding: 30rpx 0;
  155. margin-bottom: 20rpx;
  156. }
  157. .list .note{
  158. font-size:28rpx;
  159. padding-top: 30rpx;
  160. color:#666;
  161. display: block;
  162. border-top: 1px solid #F5F5F5;
  163. }
  164. .title{
  165. /* border-left: 4px solid #FF5151; */
  166. color: #333;
  167. font-size: 36rpx;
  168. font-weight: 500;
  169. padding-left: 20rpx;
  170. padding-right: 40rpx;
  171. margin-bottom: 20rpx;
  172. }
  173. .title text{
  174. font-weight: 400;
  175. color: #666;
  176. font-size: 28rpx;
  177. }
  178. .title navigator{
  179. float: right;
  180. color: #999;
  181. font-size: 28rpx;
  182. }
  183. .item text{
  184. display: block;
  185. }
  186. .item .name{
  187. width: 25%;
  188. overflow: hidden;
  189. text-overflow: ellipsis;
  190. white-space: nowrap;
  191. text-align: left;
  192. margin-left: 5%;
  193. }
  194. .assess{
  195. display: inline-block;
  196. font-size: 28rpx;
  197. color: #666;
  198. border: 1px solid #666;
  199. line-height: 64rpx;
  200. height: 64rpx;
  201. padding: 0 20rpx;
  202. border-radius: 8rpx;
  203. position: absolute;
  204. right: 30rpx;
  205. top: 30rpx;
  206. }
  207. .date-picker{
  208. color: #666;
  209. }