C端小程序
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

509 line
9.1 KiB

  1. page{
  2. position: relative;
  3. height: auto!important;
  4. background:#FF6F03;
  5. background-image:url('https://s3.cn-northwest-1.amazonaws.com.cn/iformall-net/cimg/barginlistbg.jpg');
  6. background-size: cover;
  7. background-repeat: no-repeat;
  8. }
  9. .list{
  10. padding: 0 32rpx;
  11. }
  12. .listitem .fl {
  13. width: 180rpx;
  14. height: 180rpx!important;
  15. border-radius: 10rpx;
  16. overflow: hidden;
  17. margin-top:10rpx;
  18. }
  19. .listitem .icon{
  20. width: 140rpx;
  21. height: 116rpx;
  22. position: absolute;
  23. top: 0;
  24. right: 30rpx;
  25. }
  26. .listitem .ri {
  27. margin-left: 26rpx;
  28. width: 305rpx;
  29. }
  30. .ri text{
  31. display: block;
  32. text-align: left;
  33. }
  34. .ri .txt01 {
  35. width: 100%;
  36. font-size:30rpx;
  37. color: rgba(51, 51, 51, 1);
  38. line-height: 44rpx;
  39. white-space: nowrap;
  40. text-overflow: ellipsis;
  41. overflow: hidden;
  42. font-weight: bold;
  43. }
  44. .ri .txt02 {
  45. width: 100%;
  46. white-space: nowrap;
  47. text-overflow: ellipsis;
  48. overflow: hidden;
  49. font-size: 24rpx;
  50. color: rgba(140, 140, 140, 1);
  51. }
  52. .ri .txt03 {
  53. width: 100%;
  54. font-size:24rpx;
  55. text-decoration:line-through;
  56. color:rgba(140,140,140,1);
  57. }
  58. .ri .txt04 {
  59. width: 100%;
  60. font-size:24rpx;
  61. color:rgba(255,50,50,1);
  62. line-height:44rpx;
  63. }
  64. .money{
  65. display: inline-block!important;
  66. font-size:50rpx;
  67. font-weight:500;
  68. color:rgba(255,50,50,1);
  69. }
  70. .listitem{
  71. position: relative;
  72. padding: 21rpx;
  73. background: #fff;
  74. border-radius: 20rpx;
  75. margin-bottom: 30rpx;
  76. margin-top: 30rpx;
  77. }
  78. .botton{
  79. position: absolute;
  80. right: 18rpx;
  81. text-align: center;
  82. bottom: 40rpx;
  83. width:186rpx;
  84. height:48rpx;
  85. line-height:48rpx;
  86. background:linear-gradient(90deg,rgba(255,182,20,1) 0%,rgba(248,98,52,1) 100%);
  87. border-radius:24rpx;
  88. font-size:26rpx;
  89. color:rgba(255,255,255,1);
  90. }
  91. .botton1{
  92. position: absolute;
  93. right: 36rpx;
  94. text-align: center;
  95. bottom: 6rpx;
  96. width:186rpx;
  97. height:48rpx;
  98. line-height:48rpx;
  99. background:linear-gradient(90deg,rgba(255,182,20,1) 0%,rgba(255,111,3,1) 100%);
  100. /* background:linear-gradient(90deg,rgba(236,59,45,1) 0%,rgba(255,111,3,1) 100%); */
  101. border-radius:24rpx;
  102. font-size:26rpx;
  103. color:rgba(255,255,255,1);
  104. }
  105. .botton02{
  106. background: #ccc!important;
  107. }
  108. .botton2{
  109. position: absolute;
  110. right: 36rpx;
  111. text-align: center;
  112. bottom: 8rpx;
  113. border-radius:24rpx;
  114. font-size:26rpx;
  115. line-height:48rpx;
  116. color:rgba(255,255,255,1);
  117. width:134rpx;
  118. height:48rpx;
  119. background:linear-gradient(90deg,rgba(255,182,20,1) 0%,rgba(255,111,3,1) 100%);
  120. }
  121. .botton3{
  122. position: absolute;
  123. right: 36rpx;
  124. text-align: center;
  125. bottom: 8rpx;
  126. line-height:48rpx;
  127. border-radius:24rpx;
  128. font-size:26rpx;
  129. color:rgba(255,255,255,1);
  130. width:134rpx;
  131. height:48rpx;
  132. background:linear-gradient(90deg,rgba(255,182,20,1) 0%,rgba(255,111,3,1) 100%);
  133. }
  134. /* .buttonfix{
  135. position: fixed;
  136. height: 95rpx;
  137. line-height: 95rpx;
  138. bottom: 0;
  139. left: 0;
  140. right: 0;
  141. display: flex;
  142. flex: 2;
  143. background: #fff;
  144. border-top:1rpx solid #C6C6C6;
  145. justify-content: space-around;
  146. text-align: center;
  147. } */
  148. .buttonfix > view{
  149. text-align: center;
  150. font-size: 32rpx;
  151. flex: 1;
  152. }
  153. .active1{
  154. color: #02C0FF!important;
  155. }
  156. .line{
  157. border-left:1rpx solid #C6C6C6;
  158. box-sizing:border-box;
  159. -moz-box-sizing:border-box;
  160. -webkit-box-sizing:border-box;
  161. }
  162. .page{
  163. padding-bottom: 100rpx;
  164. position: relative;
  165. }
  166. .mr{
  167. height: 40rpx;
  168. line-height: 40rpx;
  169. }
  170. .txt004{
  171. margin-top: 10rpx;
  172. }
  173. .market {
  174. width: 100%;
  175. height: 100%;
  176. /* background: #f5f5f5; */
  177. }
  178. .tabs {
  179. width: 100% !important;
  180. height: 88rpx;
  181. text-align: center;
  182. position: fixed;
  183. top: 0;
  184. left: 0;
  185. right: 0;
  186. z-index: 100000;
  187. }
  188. .i-tab {
  189. width: 25% !important;
  190. display: inline-block;
  191. }
  192. .section {
  193. position: relative;
  194. }
  195. .mms {
  196. position: relative;
  197. width: 690rpx;
  198. height: 197rpx !important;
  199. background: #fff;
  200. padding: 30rpx 0 0;
  201. margin: 0 auto 40rpx;
  202. border-radius: 16rpx;
  203. border-top: 8rpx solid #02b7ff;
  204. box-shadow: 0 6px 20px 0 rgba(0, 0, 0, 0.10);
  205. }
  206. .detail_msg {
  207. display: flex;
  208. padding-bottom: 26rpx;
  209. }
  210. .expiretime {
  211. display: block;
  212. width: 100%;
  213. text-align: left;
  214. text-indent: 1em;
  215. height:54rpx;
  216. line-height:54rpx;
  217. font-size: 26rpx;
  218. color: #333;
  219. letter-spacing: 0;
  220. }
  221. .liness {
  222. display: block;
  223. width: 100%;
  224. }
  225. .logo {
  226. width: 60rpx;
  227. height: 60rpx;
  228. border: 1px solid #f8f8f8;
  229. border-radius: 50rpx;
  230. display: block;
  231. margin-left: 20rpx;
  232. }
  233. .logo image {
  234. width: 60rpx;
  235. height: 60rpx;
  236. border-radius: 50%;
  237. }
  238. .info view:nth-child(1) {
  239. display: flex;
  240. justify-content: space-between;
  241. padding: 0 2%;
  242. }
  243. .info {
  244. width: 100%;
  245. }
  246. .info view:nth-child(1) text {
  247. font-size: 32rpx;
  248. line-height: 32rpx;
  249. height: 32rpx;
  250. color: #333;
  251. letter-spacing: 0;
  252. width: 400rpx;
  253. display: inline-block;
  254. white-space: nowrap;
  255. text-overflow: ellipsis;
  256. overflow: hidden;
  257. }
  258. .info view:nth-child(2) {
  259. padding-left: 2%;
  260. font-size: 22rpx;
  261. color: #333;
  262. letter-spacing: 0;
  263. margin-top: 6rpx;
  264. display: inline-block;
  265. white-space: nowrap;
  266. text-overflow: ellipsis;
  267. overflow: hidden;
  268. width: 400rpx;
  269. }
  270. .info view:nth-child(3) {
  271. margin-left: 20rpx;
  272. }
  273. .btns {
  274. position: absolute;
  275. right: 30rpx;
  276. top: 38rpx;
  277. width: 120rpx;
  278. height: 48rpx;
  279. line-height: 48rpx;
  280. text-align: center;
  281. border: 2rpx solid #02c0ff;
  282. border-radius: 60rpx;
  283. color: #02c0ff;
  284. font-size: 28rpx;
  285. }
  286. .active {
  287. color: #fff;
  288. background: #02c0ff;
  289. }
  290. .txt1 {
  291. font-size: 26rpx;
  292. color: #333;
  293. letter-spacing: 0;
  294. }
  295. .nocoupon image {
  296. width: 300rpx;
  297. display: block;
  298. margin: 3% auto 0;
  299. }
  300. .txt001 {
  301. display: block;
  302. line-height: 48rpx;
  303. font-size: 34rpx;
  304. color: #333;
  305. letter-spacing: 0;
  306. text-align: center;
  307. }
  308. .txt002 {
  309. display: block;
  310. margin-top: 1%;
  311. font-size: 28rpx;
  312. color: #999;
  313. letter-spacing: 0;
  314. line-height: 40rpx;
  315. text-align: center;
  316. }
  317. .top{
  318. width: 710rpx;
  319. height: 260rpx;
  320. background: #fff;
  321. border-radius: 16rpx;
  322. overflow: hidden;
  323. margin: 30rpx auto 0;
  324. }
  325. .nocoupon button {
  326. background: #00c0ff;
  327. color: #fff;
  328. font-style: 30rpx;
  329. width: 100%;
  330. border-radius: 60rpx;
  331. }
  332. .loading {
  333. text-align: center;
  334. height: 80rpx;
  335. line-height: 80rpx;
  336. font-size: 26rpx;
  337. color: #fff;
  338. }
  339. .loading image {
  340. width: 60rpx;
  341. height: 60rpx;
  342. vertical-align: middle;
  343. margin-right: 10rpx;
  344. }
  345. .active {
  346. opacity: 0.6;
  347. }
  348. .nav {
  349. position: absolute;
  350. bottom: 3.3%;
  351. left: 0;
  352. right: 0;
  353. margin: auto;
  354. width: 670rpx;
  355. border-radius: 60rpx;
  356. background: #02c0ff;
  357. font-size: 32px;
  358. color: #fff;
  359. text-align: center;
  360. line-height: 32px;
  361. }
  362. .sendImg{
  363. position: absolute;
  364. width: 100rpx;
  365. top:109rpx;
  366. right:72rpx;
  367. }
  368. .no-data01{
  369. width: 690rpx;
  370. padding-top: 174rpx;
  371. height: calc(100vh - 460rpx);
  372. background: #fff;
  373. margin: 0 auto;
  374. border-radius:15rpx;
  375. box-sizing: border-box;
  376. margin-top: 20rpx;
  377. }
  378. .no-data{
  379. width: 690rpx;
  380. padding-top: 174rpx;
  381. height: calc(100vh - 160rpx);
  382. background: #fff;
  383. margin: 0 auto;
  384. border-radius:15rpx;
  385. box-sizing: border-box;
  386. margin-top:20rpx;
  387. }
  388. .no-data01 image{
  389. width: 261rpx;
  390. height: 272rpx;
  391. display: block;
  392. margin: 0 auto;
  393. }
  394. .no-data image{
  395. width: 261rpx;
  396. height: 272rpx;
  397. display: block;
  398. margin: 0 auto;
  399. }
  400. .no-data-text{
  401. text-align: center;
  402. font-size:34rpx;
  403. font-family:PingFang-SC-Medium;
  404. font-weight:500;
  405. color:rgba(0,0,0,1);
  406. }
  407. .dingdan {
  408. margin-top: 33rpx;
  409. }
  410. .dingdan text:nth-of-type(1) {
  411. display: block;
  412. font-size: 34rpx;
  413. color: #333;
  414. letter-spacing: 0;
  415. text-align: center;
  416. }
  417. .dingdan text:nth-of-type(2) {
  418. display: block;
  419. font-size: 28rpx;
  420. color: #999;
  421. letter-spacing: 0;
  422. text-align: center;
  423. }
  424. .dingdan image {
  425. display: block;
  426. width: 300rpx;
  427. height: 300rpx;
  428. margin: 0 auto 16rpx;
  429. }
  430. .again{
  431. position: relative;
  432. width: 686rpx;
  433. height: 200rpx;
  434. }
  435. .banner{
  436. margin-bottom:20rpx;
  437. background:none!important;
  438. border-radius:16rpx;
  439. }
  440. .banner .bannerbg image{
  441. display: none!important;
  442. height: 0!important;
  443. overflow: hidden;
  444. }
  445. .bottom{
  446. width: 690rpx;
  447. height: 85rpx;
  448. position: fixed;
  449. bottom: 26rpx;
  450. left: 30rpx;
  451. /* background:rgba(243,69,58,1); */
  452. border:1px solid rgba(255, 222, 67, 1);
  453. border-radius:40px;
  454. color: #fff;
  455. overflow: hidden;
  456. }
  457. .bottom-left{
  458. width: 50%;
  459. float: left;
  460. margin-left: -1rpx;
  461. text-align: center;
  462. line-height: 85rpx;
  463. font-size:30rpx;
  464. font-family:PingFang-SC-Medium;
  465. font-weight:500;
  466. color:rgba(255,253,245,1);
  467. border-right:1px solid rgba(255, 222, 67, 1);
  468. opacity: 1;
  469. }
  470. .bottom-right{
  471. width: 50%;
  472. float: left;
  473. text-align: center;
  474. line-height: 85rpx;
  475. font-size:30rpx;
  476. font-family:PingFang-SC-Medium;
  477. font-weight:500;
  478. color:rgba(255,253,245,1);
  479. opacity: 1;
  480. }