index.wxss 5.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376
  1. /* pages/reward/index.wxss */
  2. page {
  3. background-color: #f5f5f5;
  4. }
  5. /* 顶部筛选 */
  6. .head {
  7. display: flex;
  8. height: 100rpx;
  9. width: 100%;
  10. flex: 1 0 auto;
  11. align-items: center;
  12. background-color: #fff;
  13. border-bottom: 2rpx solid #ddd;
  14. }
  15. .head .map {
  16. display: flex;
  17. white-space: nowrap;
  18. flex-grow: 1;
  19. font-size: 30rpx;
  20. justify-content: center;
  21. height: 40rpx;
  22. align-items: center;
  23. color: #525255;
  24. }
  25. .head .map .location {
  26. display: flex;
  27. align-items: center;
  28. width: 20rpx;
  29. height: 24rpx;
  30. padding-right: 10rpx;
  31. }
  32. .map .location image {
  33. width: 100%;
  34. height: 100%;
  35. }
  36. .head .salay {
  37. display: flex;
  38. flex-grow: 1;
  39. white-space: nowrap;
  40. font-size: 26rpx;
  41. height: 40rpx;
  42. color: #868b92;
  43. justify-content: center;
  44. align-items: center;
  45. }
  46. .salay .salayname {
  47. padding-right: 10rpx;
  48. }
  49. .salay .arrow {
  50. display: flex;
  51. width: 14rpx;
  52. height: 8rpx;
  53. align-items: center;
  54. }
  55. .salay .arrow image {
  56. width: 100%;
  57. height: 100%;
  58. }
  59. .salay .active {
  60. color: #1e62a7;
  61. }
  62. /* 列表 */
  63. .box-body {
  64. width: 100%;
  65. overflow: hidden;
  66. }
  67. .box_title {
  68. padding: 17rpx 0 17rpx 40rpx;
  69. font-size: 28rpx;
  70. color: #666;
  71. border-bottom: 2rpx solid #ddd;
  72. }
  73. .box-item {
  74. display: flex;
  75. padding: 35rpx 40rpx 30rpx 40rpx;
  76. font-size: 32rpx;
  77. color: #232327;
  78. box-sizing: border-box;
  79. background-color: #fff;
  80. border-bottom: 16rpx solid #f5f5f5;
  81. }
  82. .item-hover {
  83. background: #f5f5f5;
  84. }
  85. .box-item .box-item-img {
  86. display: flex;
  87. flex: 0 0 auto;
  88. width: 150rpx;
  89. height: 150rpx;
  90. border-radius: 6rpx;
  91. background: #fff;
  92. }
  93. .box-item .box-item-info {
  94. display: flex;
  95. flex-direction: column;
  96. justify-content: space-between;
  97. flex-grow: 1;
  98. box-sizing: border-box;
  99. overflow: hidden;
  100. }
  101. .box-item .one {
  102. display: flex;
  103. justify-content: space-between;
  104. color: #232327;
  105. flex-direction: row;
  106. }
  107. .box-item .one .left {
  108. display: flex;
  109. flex-grow: 1;
  110. align-items: center;
  111. font-size: 32rpx;
  112. font-family: SourceHanSansCN-Regular;
  113. font-weight: 400;
  114. color: rgba(35, 35, 39, 1);
  115. width: 60%;
  116. }
  117. .box-item .one .salary {
  118. font-size: 32rpx;
  119. font-family: Arial-BoldMT;
  120. font-weight: 400;
  121. color: rgba(255, 78, 37, 1);
  122. }
  123. .box-item .one .salary image {
  124. width: 18rpx;
  125. height: 24rpx;
  126. }
  127. .box-item .two {
  128. display: flex;
  129. justify-content: space-between;
  130. color: #909090;
  131. font-size: 24rpx;
  132. margin-top: 30rpx;
  133. align-items: center;
  134. }
  135. .box-item .two .limit {
  136. display: flex;
  137. flex-direction: row;
  138. flex-grow: 1;
  139. overflow: hidden;
  140. margin-right: 30rpx;
  141. width: 80%;
  142. color: #868b92;
  143. }
  144. .box-item .two .limit image {
  145. width: 18rpx;
  146. height: 18rpx;
  147. margin-right: 10rpx;
  148. }
  149. .box-item .two .limit i-tag {
  150. /* margin-left: 10rpx; */
  151. }
  152. .box-item .two .limit text {
  153. margin-left: 10rpx;
  154. }
  155. .box-item .two .limit_1 {
  156. display: flex;
  157. flex-direction: row;
  158. flex-grow: 1;
  159. overflow: hidden;
  160. width: 80%;
  161. color: #868b92;
  162. flex-wrap: wrap;
  163. }
  164. .box-item .two .limit_1 image {
  165. width: 18rpx;
  166. height: 18rpx;
  167. margin-right: 10rpx;
  168. }
  169. .box-item .two .limit_1 i-tag {
  170. /* margin-left: 10rpx; */
  171. }
  172. .box-item .two .limit_1 text {
  173. margin-left: 10rpx;
  174. }
  175. .box-item .two .time {
  176. color: #706f6f;
  177. font-size: 20rpx;
  178. }
  179. .tag-class {
  180. margin-right: 8rpx;
  181. white-space: nowrap;
  182. border: none !important;
  183. background: rgba(255, 246, 229, 1) !important;
  184. border-radius: 14px !important;
  185. margin-bottom: 12rpx;
  186. color: #ff903f;
  187. font-size: 20rpx;
  188. }
  189. .box-item .three {
  190. display: flex;
  191. justify-content: space-between;
  192. align-items: center;
  193. font-size: 20rpx;
  194. margin-top: 20rpx;
  195. }
  196. .box-item .three image {
  197. width: 16rpx;
  198. height: 19rpx;
  199. }
  200. .box-item .three .area {
  201. color: #868b92;
  202. font-size: 24rpx;
  203. }
  204. .box-item .three .area .area-name {
  205. margin-left: 10rpx;
  206. color: #868b92;
  207. font-size: 24rpx;
  208. }
  209. .box-item .three .limit {
  210. display: flex;
  211. flex-grow: 1;
  212. overflow: hidden;
  213. margin-right: 10rpx;
  214. width: 80%;
  215. flex-direction: row;
  216. }
  217. .box-item .three .limit i-tag {
  218. margin-left: 10rpx;
  219. }
  220. .box-item .three .time {
  221. flex: 0 0 auto;
  222. color: #868b92;
  223. }
  224. .box-item .three .time image {
  225. width: 18rpx;
  226. height: 18rpx;
  227. }
  228. .box-item .three .time text {
  229. margin-left: 6rpx;
  230. font-size: 20rpx;
  231. }
  232. .box-item .three .fan {
  233. display: flex;
  234. flex-direction: row;
  235. color: #ff400e;
  236. font-size: 20rpx;
  237. align-items: center;
  238. }
  239. .box-item .three .fan image {
  240. width: 24rpx;
  241. height: 24rpx;
  242. margin-right: 10rpx;
  243. }
  244. .box-item .four {
  245. display: flex;
  246. justify-content: space-between;
  247. color: #909090;
  248. font-size: 22rpx;
  249. margin-top: 18rpx;
  250. align-items: center;
  251. }
  252. .box-item .four .limit {
  253. display: flex;
  254. flex-direction: row;
  255. flex-grow: 1;
  256. overflow: hidden;
  257. margin-right: 30rpx;
  258. width: 80%;
  259. color: #868b92;
  260. }
  261. .box-item .four .limit image {
  262. width: 18rpx;
  263. height: 18rpx;
  264. }
  265. .box-item .four .limit i-tag {
  266. margin-left: 10rpx;
  267. }
  268. .box-item .four .limit text {
  269. margin-left: 10rpx;
  270. }
  271. .box-item .four .time {
  272. color: #706f6f;
  273. font-size: 20rpx;
  274. }
  275. .box-item .four .commpany {
  276. font-size: 22rpx;
  277. color: #a0a4a9;
  278. }
  279. .box-item .four .area {
  280. color: #868b92;
  281. font-size: 24rpx;
  282. }
  283. .box-item .four .area image {
  284. width: 16rpx;
  285. height: 19rpx;
  286. }
  287. .box-item .four .area .area-name {
  288. margin-left: 10rpx;
  289. color: #868b92;
  290. font-size: 22rpx;
  291. }
  292. .loading_no {
  293. display: flex;
  294. justify-content: center;
  295. align-items: center;
  296. height: 60rpx;
  297. font-size: 22rpx;
  298. color: #696969;
  299. }
  300. /* 空白页 */
  301. .no_data {
  302. width: 100%;
  303. margin-top: 20%;
  304. display: flex;
  305. justify-content: center;
  306. align-items: center;
  307. flex-direction: column;
  308. }
  309. .white {
  310. width: 125px;
  311. height: 125px;
  312. }
  313. .no_text {
  314. color: #ccc;
  315. font-size: 32rpx;
  316. margin-top: 48rpx;
  317. }