upgrade.wxss 4.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255
  1. .section {
  2. overflow-x: hidden;
  3. }
  4. .topImg {
  5. width: 100%;
  6. }
  7. .section .head {
  8. width: 130%;
  9. height: 380rpx;
  10. border-radius: 0 0 50% 50%;
  11. background: #2e3748;
  12. position: relative;
  13. left: -15%;
  14. overflow: hidden;
  15. }
  16. .section .head1 {
  17. width: 150%;
  18. height: 240rpx;
  19. border-radius: 0 0 50% 50%;
  20. background: #2e3748;
  21. position: relative;
  22. left: -25%;
  23. padding-top: 30rpx;
  24. }
  25. .section .head .card {
  26. width: 538rpx;
  27. height: 255rpx;
  28. background: linear-gradient(to right, #4ecd65, #3eb251);
  29. margin: 30rpx auto 0 auto;
  30. border-radius: 25rpx 25rpx 0 0;
  31. padding: 50rpx;
  32. text-align: center;
  33. overflow: hidden;
  34. }
  35. .section .head1 .card {
  36. width: 610rpx;
  37. height: 295rpx;
  38. background: linear-gradient(to bottom, #3eb251, #52c464, #68d278);
  39. margin: 0 auto;
  40. border-radius: 25rpx;
  41. padding: 30rpx 40rpx;
  42. overflow: hidden;
  43. color: #282e42;
  44. }
  45. .card .card-title {
  46. display: flex;
  47. align-items: center;
  48. justify-content: center;
  49. color: rgba(29, 142, 48, 1);
  50. font-size: 26rpx;
  51. }
  52. .card .card-title.vipinfo {
  53. color: #282e42;
  54. }
  55. .card .card-title .vipinfo-avatar {
  56. width: 120rpx;
  57. height: 120rpx;
  58. border-radius: 50%;
  59. margin-right: 20rpx;
  60. }
  61. .card .card-title .vipinfo-r {
  62. display: flex;
  63. flex-direction: column;
  64. flex: 1;
  65. }
  66. .card .card-title .vipinfo-name {
  67. font-size: 30rpx;
  68. }
  69. .card .card-title .endtime {
  70. font-size: 26rpx;
  71. margin-top: 10rpx;
  72. font-weight: 500;
  73. }
  74. .card .card-title .vip-xucard {
  75. position: absolute;
  76. display: flex;
  77. align-items: center;
  78. padding: 13rpx 20rpx;
  79. background: #282e42;
  80. border-radius: 50px;
  81. color: #fff;
  82. font-size: 26rpx;
  83. right: 22%;
  84. }
  85. .card .sheng {
  86. margin-top: 30rpx;
  87. font-size: 30rpx;
  88. }
  89. .card .sheng text {
  90. color: #fff;
  91. }
  92. .card .card-title .title-name {
  93. margin: 0 20rpx;
  94. }
  95. .card .card-title text {
  96. flex: 1;
  97. border-top: 0.1rpx solid rgba(29, 142, 48, 0.7);
  98. }
  99. .section .content {
  100. color: green;
  101. background-image: linear-gradient(to right, rgba(19, 116, 35, 1), rgba(21, 113, 39, 1), rgba(38, 73, 62, 1));
  102. -webkit-background-clip: text;
  103. -webkit-text-fill-color: transparent;
  104. }
  105. .card .bigtitle {
  106. margin: 30rpx 0;
  107. font-size: 50rpx;
  108. }
  109. .card .smalltitle {
  110. font-size: 30rpx;
  111. font-weight: 600;
  112. }
  113. .section .privilege {
  114. padding: 30rpx;
  115. }
  116. .section .privilege1 {
  117. padding: 140rpx 30rpx 0 30rpx;
  118. }
  119. .section .privilege .privilegelist {
  120. display: flex;
  121. width: 100%;
  122. overflow-x: scroll;
  123. white-space: nowrap;
  124. padding-top: 30rpx;
  125. }
  126. .section .privilege .privilegelist .list-item {
  127. display: flex;
  128. flex-direction: column;
  129. align-items: center;
  130. justify-content: center;
  131. margin-right: 30rpx;
  132. min-width: 140rpx;
  133. height: 160rpx;
  134. }
  135. .section .privilege .privilegelist .list-item image {
  136. width: 90rpx;
  137. height: 90rpx;
  138. border-radius: 10rpx;
  139. }
  140. .section .privilege .privilegelist .list-item view {
  141. font-size: 24rpx;
  142. margin-top: 8rpx;
  143. }
  144. .section .greentitle {
  145. font-size: 35rpx;
  146. color: #2f3746;
  147. }
  148. .viptype {
  149. padding: 30rpx;
  150. margin-top: 20rpx;
  151. }
  152. .viplist .list {
  153. display: flex;
  154. overflow-x: scroll;
  155. overflow-y: hidden;
  156. white-space: nowrap;
  157. margin: 30rpx 0;
  158. }
  159. .viplist .list .list-item {
  160. border: 1rpx solid rgba(60,186,99,1);
  161. padding: 18rpx 15rpx;
  162. border-radius: 15rpx;
  163. min-width: 160rpx;
  164. max-width: 160rpx;
  165. height: 180rpx;
  166. text-align: center;
  167. margin-right: 20rpx;
  168. }
  169. .viplist .list .list-item.active {
  170. background: rgba(60,186,99,0.2);
  171. }
  172. .gray {
  173. color: #999;
  174. }
  175. .green {
  176. color: #3CBA63;
  177. }
  178. .section .apply-btn {
  179. background: linear-gradient(to bottom,#394456,#2F3848);
  180. width: 68%;
  181. color: #2FB157;
  182. font-size: 30rpx;
  183. text-align: center;
  184. border-radius: 50rpx;
  185. padding: 20rpx 0;
  186. margin: 0 auto 5rpx;
  187. box-shadow: 1rpx 1rpx 5rpx #ccc;
  188. }
  189. .cate {
  190. position: sticky;
  191. top: 0;
  192. left: 0;
  193. right: 0;
  194. z-index: 10;
  195. }
  196. .goodsItem {
  197. border-bottom: .1rpx solid #f5f5f5;
  198. }
  199. .none-rush-list {
  200. display: flex;
  201. flex-direction: column;
  202. align-items: center;
  203. justify-content: center;
  204. padding-bottom: 140rpx;
  205. padding-top: 140rpx;
  206. }
  207. .none-rush-list .img-block {
  208. width: 240rpx;
  209. height: 240rpx;
  210. margin-bottom: 30rpx;
  211. }
  212. .none-rush-list .h1 {
  213. font-size: 32rpx;
  214. line-height: 32rpx;
  215. color: #444;
  216. margin-bottom: 20rpx;
  217. }