C端小程序
Vous ne pouvez pas sélectionner plus de 25 sujets Les noms de sujets doivent commencer par une lettre ou un nombre, peuvent contenir des tirets ('-') et peuvent comporter jusqu'à 35 caractères.

906 lignes
13 KiB

  1. @import "../../../app.wxss";
  2. page {
  3. background: #f4f5f9;
  4. }
  5. button::after {
  6. border: none;
  7. }
  8. .coupons {
  9. width: 100%;
  10. position: relative;
  11. overflow: hidden;
  12. padding-bottom: 170rpx;
  13. background: #f4f5f9;
  14. }
  15. .couponsL c-coupons {
  16. width: 335rpx;
  17. height: 354rpx;
  18. margin-bottom: 22rpx;
  19. }
  20. .couponsL c-coupons:nth-of-type(2n+1) {
  21. float: left;
  22. }
  23. .couponsL c-coupons:nth-of-type(2n) {
  24. float: right;
  25. }
  26. .banner {
  27. position: relative;
  28. width: 750rpx;
  29. height: 454rpx;
  30. }
  31. .banner swiper {
  32. width: 750rpx;
  33. height: 454rpx;
  34. }
  35. .banner image {
  36. width: 100%;
  37. height: 454rpx;
  38. }
  39. .moneyBox {
  40. font-size: 24rpx;
  41. overflow: hidden;
  42. }
  43. .earnest {
  44. float: left;
  45. font-size: 28rpx;
  46. color: #a6a6a6;
  47. }
  48. .earnestNum {
  49. float: left;
  50. color: red;
  51. font-size: 32rpx;
  52. }
  53. .final {
  54. float: left;
  55. font-size: 28rpx;
  56. color: #a6a6a6;
  57. margin-left: 30rpx;
  58. }
  59. .pickFinal_Box {
  60. overflow: hidden;
  61. }
  62. .earnestTime {
  63. font-size: 28rpx;
  64. color: #a6a6a6;
  65. }
  66. .finalTime {
  67. font-size: 28rpx;
  68. color: #a6a6a6;
  69. }
  70. .original {
  71. float: left;
  72. width: 100rpx;
  73. margin-left: 10rpx;
  74. text-decoration: line-through;
  75. color: #a6a6a6;
  76. font-size: 24rpx;
  77. line-height: 50rpx;
  78. }
  79. .dots {
  80. position: absolute;
  81. left: 0;
  82. right: 0;
  83. bottom: 50rpx;
  84. display: flex;
  85. justify-content: center;
  86. }
  87. .dot {
  88. margin: 0 8rpx;
  89. width: 14rpx;
  90. height: 14rpx;
  91. background: #fff;
  92. border-radius: 8rpx;
  93. transition: all 0.6s;
  94. }
  95. .dot.active {
  96. width: 24rpx;
  97. background: #f80;
  98. }
  99. .refound {
  100. border: 1rpx solid red;
  101. padding: 3rpx 0;
  102. display: block;
  103. width: 130rpx;
  104. text-align: center;
  105. margin-left: 14rpx;
  106. }
  107. .couponsL {
  108. width: 92%;
  109. margin: 20rpx auto;
  110. }
  111. .coupons_info {
  112. width: 92%;
  113. padding: 0 4%;
  114. background: #fff;
  115. border-top-left-radius: 20rpx;
  116. border-top-right-radius: 20rpx;
  117. /* margin-top: -25rpx; */
  118. }
  119. .fenxiang {
  120. position: absolute;
  121. right: 28rpx;
  122. top: 27rpx;
  123. display: flex;
  124. flex-direction: column;
  125. }
  126. .fenxiang image {
  127. width: 48rpx;
  128. height: 48rpx;
  129. margin: 0 auto;
  130. }
  131. .gift {
  132. color: #3c3c3c;
  133. font-size: 20rpx;
  134. margin: 0 auto;
  135. }
  136. .user-motto {
  137. width: 270rpx;
  138. border: 0;
  139. background: none;
  140. height: 260rpx;
  141. color: #fff;
  142. position: fixed;
  143. }
  144. .user-motto::after {
  145. border: none;
  146. }
  147. .title {
  148. display: block;
  149. font-weight: bold;
  150. font-size: 32rpx;
  151. color: #3c3c3c;
  152. letter-spacing: 1.09rpx;
  153. line-height: 45rpx;
  154. width: 542rpx;
  155. overflow: hidden;
  156. white-space: nowrap;
  157. text-overflow: ellipsis;
  158. padding-top: 30rpx;
  159. }
  160. .subTitle {
  161. display: block;
  162. width: 588rpx;
  163. /* height: 37rpx; */
  164. font-size: 26rpx;
  165. color: #a6a6a6;
  166. letter-spacing: 1.16rpx;
  167. overflow: hidden;
  168. white-space: nowrap;
  169. text-overflow: ellipsis;
  170. padding: 6rpx 0;
  171. }
  172. .rest {
  173. font-size: 24rpx;
  174. color: #919191;
  175. letter-spacing: 0;
  176. height: 50rpx;
  177. line-height: 50rpx;
  178. border-bottom: 1px solid #f9f9f9;
  179. }
  180. .restNum {
  181. font-size: 24rpx;
  182. color: #999;
  183. letter-spacing: 1.16rpx;
  184. text-align: right;
  185. }
  186. .time {
  187. font-size: 24rpx;
  188. color: #a6a6a6;
  189. letter-spacing: 0;
  190. line-height: 33rpx;
  191. display: inline-block;
  192. }
  193. .txt01 {
  194. font-size: 24rpx;
  195. color: #919191;
  196. letter-spacing: 0;
  197. }
  198. .price {
  199. font-size: 24rpx;
  200. color: #999;
  201. letter-spacing: 0;
  202. }
  203. .salePriceStr {
  204. font-size: 24rpx;
  205. color: #999;
  206. letter-spacing: 0;
  207. }
  208. .salePriceStr .rmb {
  209. color: #fd782d;
  210. font-size: 24rpx;
  211. line-height: 40rpx;
  212. float: left;
  213. }
  214. .salePriceStr .pri01 {
  215. font-size: 40rpx;
  216. color: #fd782d;
  217. letter-spacing: 0;
  218. line-height: 40rpx;
  219. float: left;
  220. }
  221. .salePriceStr .pri01Hr {
  222. font-size: 24rpx !important;
  223. }
  224. .use {
  225. color: #fd782d;
  226. /* margin-left: 10rpx; */
  227. }
  228. .salePriceStr .yuan {
  229. font-size: 24rpx;
  230. color: #fd782d;
  231. letter-spacing: 0;
  232. }
  233. .price text {
  234. font-size: 24rpx;
  235. color: #333;
  236. letter-spacing: 0;
  237. }
  238. .throgh {
  239. text-decoration: line-through;
  240. margin-left: 10rpx;
  241. color: #999 !important;
  242. margin-top: 8rpx;
  243. height: 32rpx;
  244. line-height: 45rpx;
  245. }
  246. .fl {
  247. float: left;
  248. }
  249. .fr {
  250. float: right;
  251. }
  252. .notes view:nth-child(1) {
  253. height: 87rpx;
  254. line-height: 87rpx;
  255. background: #fff;
  256. border-top: 1px solid #f9f9f9;
  257. }
  258. .notes {
  259. width: 100%;
  260. background: #fff;
  261. padding-bottom: 30rpx;
  262. }
  263. .active {
  264. opacity: 0.6;
  265. }
  266. .notes view:nth-child(1) text {
  267. color: #333;
  268. letter-spacing: 0;
  269. font-size: 30rpx;
  270. height: 70rpx;
  271. line-height: 70rpx;
  272. }
  273. .notes view:nth-child(1) {
  274. width: 92%;
  275. margin: 0 auto;
  276. }
  277. .notes view:nth-child(2) {
  278. display: flex;
  279. flex-direction: column;
  280. width: 92%;
  281. margin: 0 auto;
  282. }
  283. .notes view:nth-child(2)>text {
  284. font-size: 24rpx;
  285. color: #919191;
  286. letter-spacing: 0;
  287. line-height: 42rpx;
  288. }
  289. .buy-view {
  290. /* background: #fff; */
  291. height: 92rpx;
  292. bottom: 0;
  293. left: 0;
  294. right: 0;
  295. padding-bottom: 22rpx;
  296. padding-top: 22rpx;
  297. }
  298. .buy {
  299. position: relative;
  300. background: linear-gradient(127deg, rgba(252, 177, 74, 1) 0%, rgba(254, 70, 20, 1) 100%);
  301. height: 94rpx;
  302. width: 560rpx;
  303. margin: 0 auto 30rpx;
  304. color: #fff;
  305. font-size: 36rpx;
  306. line-height: 94rpx;
  307. border-radius: 61rpx;
  308. }
  309. #noBuy {
  310. position: relative;
  311. background-color: rgba(0, 0, 0, 0.2);
  312. height: 94rpx;
  313. width: 560rpx;
  314. margin: 0 auto 30rpx;
  315. color: #fff;
  316. font-size: 36rpx;
  317. line-height: 94rpx;
  318. border-radius: 61rpx;
  319. }
  320. .buyHr {
  321. background: #cecece !important;
  322. }
  323. .goback {
  324. position: relative;
  325. float: left;
  326. width: 132rpx !important;
  327. height: 96rpx;
  328. background: rgba(255, 255, 255, 1) !important;
  329. line-height: 95rpx;
  330. border-radius: 32rpx;
  331. margin-left: 20rpx;
  332. }
  333. .goback image {
  334. position: absolute;
  335. width: 52rpx;
  336. height: 50rpx;
  337. left: 0;
  338. right: 0;
  339. top: 0;
  340. bottom: 0;
  341. margin: 10rpx auto;
  342. }
  343. .tel {
  344. position: absolute;
  345. right: 0;
  346. top: 0;
  347. bottom: 0;
  348. margin: auto;
  349. width: 50rpx;
  350. height: 50rpx;
  351. }
  352. .txt {
  353. margin-right: 30rpx;
  354. }
  355. .distance {
  356. border: none;
  357. border-radius: 16rpx;
  358. width: 600rpx;
  359. padding: 16rpx 6rpx 0 0;
  360. }
  361. .distance .txt01 {
  362. display: block;
  363. font-size: 26rpx;
  364. color: #ff4949;
  365. }
  366. .clock {
  367. width: 116rpx !important;
  368. vertical-align: middle;
  369. margin-right: 10rpx;
  370. margin-top: -4rpx;
  371. }
  372. .qiang {
  373. position: inline-block;
  374. width: 60rpx;
  375. height: 40rpx;
  376. line-height: 40rpx;
  377. color: #ff4949;
  378. text-align: center;
  379. font-size: 28rpx;
  380. margin-right: 10rpx;
  381. }
  382. .times {
  383. display: inline-block;
  384. color: #ff4949;
  385. font-weight: bold;
  386. font-size: 26rpx;
  387. text-align: center;
  388. }
  389. .timess {
  390. color: #fd782d;
  391. }
  392. .times text {
  393. display: inline-block;
  394. margin: 6rpx;
  395. height: 56rpx;
  396. padding: 0 6rpx;
  397. text-align: center;
  398. font-size: 28rpx;
  399. line-height: 60rpx;
  400. border-radius: 12rpx;
  401. color: #fff;
  402. font-weight: bold;
  403. background: #ff4949;
  404. }
  405. .con {
  406. position: absolute;
  407. top: 35rpx;
  408. right: 0;
  409. bottom: 0;
  410. left: 0;
  411. margin: auto;
  412. width: 587rpx;
  413. }
  414. .con .image {
  415. display: block;
  416. width: 100%;
  417. }
  418. .img {
  419. margin-top: -50rpx;
  420. }
  421. .question {
  422. display: block;
  423. width: 587rpx;
  424. background: #fff;
  425. border-bottom-left-radius: 22rpx;
  426. border-bottom-right-radius: 22rpx;
  427. overflow: hidden;
  428. }
  429. .ques {
  430. display: block;
  431. width: 511rpx;
  432. margin: 0 auto;
  433. height: 95rpx;
  434. line-height: 95rpx;
  435. font-size: 30rpx;
  436. color: #333;
  437. border-bottom: 1rpx solid #eee;
  438. }
  439. .titles {
  440. width: 511rpx;
  441. display: block;
  442. text-align: center;
  443. height: 50rpx;
  444. margin: 0 auto;
  445. padding-top: 10rpx;
  446. padding-bottom: 20rpx;
  447. font-size: 32rpx;
  448. font-weight: bold;
  449. line-height: 41rpx;
  450. border-bottom: 1rpx solid #eee;
  451. }
  452. .quessss >view:last-child {
  453. border-bottom: 0;
  454. }
  455. .wmclose {
  456. position: relative;
  457. z-index: 10000;
  458. display: block;
  459. width: 70rpx;
  460. }
  461. .ques_gou {
  462. position: absolute;
  463. width: 20rpx;
  464. top: 160rpx;
  465. left: 23rpx;
  466. }
  467. .btnss {
  468. color: #f8755b;
  469. font-weight: bold;
  470. font-size: 30rpx !important;
  471. text-align: center !important;
  472. }
  473. .radios {
  474. display: block;
  475. font-size: 28rpx;
  476. height: 95rpx;
  477. line-height: 95rpx;
  478. color: #333;
  479. text-indent: 0.5em;
  480. }
  481. .elecard {
  482. display: inline-block;
  483. margin-left: 6rpx;
  484. color: rgba(254, 70, 20, 1);
  485. border: 1px solid rgba(254, 70, 20, 1);
  486. border-radius: 8rpx;
  487. font-style: normal;
  488. font-size: 30rpx;
  489. line-height: 40rpx;
  490. padding: 0 6rpx;
  491. }
  492. .btns {
  493. /* padding: 0 33rpx; */
  494. position: fixed;
  495. left: 0;
  496. right: 0;
  497. bottom: 0;
  498. padding-bottom: 22rpx;
  499. padding-top: 22rpx;
  500. z-index: 12;
  501. /* background: #fff; */
  502. }
  503. .btnTxt {
  504. width: 50rpx;
  505. height: 30rpx;
  506. line-height: 50rpx;
  507. color: #fd782d;
  508. font-size: 20rpx;
  509. position: absolute;
  510. right: 42rpx;
  511. bottom: 15rpx;
  512. }
  513. .btns .fr, .btns .fl {
  514. width: 277rpx;
  515. height: 95rpx;
  516. border-radius: 48rpx;
  517. text-align: center;
  518. }
  519. .btns .fl {
  520. margin-left: 20rpx;
  521. color: #fff;
  522. background: linear-gradient(127deg, rgba(252, 177, 74, 1) 0%, rgba(254, 70, 20, 1) 100%);
  523. }
  524. .btns .fl text {
  525. display: block;
  526. font-size: 30rpx;
  527. line-height: 34rpx;
  528. }
  529. .btns .fl text:nth-of-type(1) {
  530. margin-top: 12rpx;
  531. }
  532. .btns .fr {
  533. font-size: 30rpx;
  534. color: #fff;
  535. margin-right: 20rpx;
  536. line-height: 95rpx;
  537. background: linear-gradient(90deg, rgba(40, 179, 255, 1) 0%, rgba(48, 103, 255, 1) 100%);
  538. /* box-shadow: 0px 8px 8px 1px rgba(246, 93, 51, 0.32); */
  539. }
  540. .support-tansfer {
  541. width: 60%;
  542. border-radius: 50rpx;
  543. margin-top: 30rpx;
  544. /* background: #02c0ff !important; */
  545. background: linear-gradient(127deg, rgba(252, 177, 74, 1) 0%, rgba(254, 70, 20, 1) 100%);
  546. }
  547. .shaddow {
  548. z-index: 100;
  549. position: fixed;
  550. width: 100%;
  551. height: 100%;
  552. top: 0px;
  553. background: rgba(0, 0, 0, 0.8);
  554. overflow: hidden;
  555. }
  556. .alert-box {
  557. position: fixed;
  558. top: 50%;
  559. margin-top: -270rpx;
  560. left: 10%;
  561. width: 80%;
  562. height: auto;
  563. padding-bottom: 20rpx;
  564. background: #fff;
  565. z-index: 200;
  566. border-radius: 20rpx;
  567. }
  568. .user-img {
  569. position: absolute;
  570. top: -50rpx;
  571. left: 250rpx;
  572. /* margin-left: -50rpx; */
  573. width: 100rpx;
  574. height: 100rpx;
  575. z-index: 300;
  576. border-radius: 50rpx;
  577. background: #fff;
  578. overflow: hidden;
  579. }
  580. .user-img image {
  581. width: 100rpx;
  582. height: 100rpx;
  583. }
  584. .close {
  585. position: absolute;
  586. z-index: 300;
  587. right: 0;
  588. top: 0;
  589. width: 100rpx;
  590. height: 100rpx;
  591. overflow: hidden;
  592. }
  593. .close image {
  594. display: block;
  595. width: 26rpx;
  596. height: 26rpx;
  597. margin: 20rpx 0 0 52rpx;
  598. }
  599. .a-title {
  600. text-align: center;
  601. margin-top: 76rpx;
  602. font-size: 36rpx;
  603. font-family: PingFang-SC-Medium;
  604. font-weight: 500;
  605. color: rgba(51, 51, 51, 1);
  606. line-height: 44rpx;
  607. }
  608. .a-img {
  609. position: relative;
  610. width: 80%;
  611. border-radius: 20rpx;
  612. height: 294rpx;
  613. overflow: hidden;
  614. text-align: center;
  615. margin: 30rpx auto 0;
  616. }
  617. .a-received {
  618. position: absolute;
  619. width: 100%;
  620. height: 294rpx;
  621. top: 0;
  622. left: 0;
  623. text-align: center;
  624. line-height: 294rpx;
  625. z-index: 320;
  626. background: rgba(255, 255, 255, 1);
  627. border: 0px solid rgba(151, 57, 117, 1);
  628. opacity: 0.91;
  629. font-size: 36rpx;
  630. color: rgba(255, 51, 50, 1);
  631. font-family: PingFang-SC-Medium;
  632. }
  633. .a-img image {
  634. width: 100%;
  635. height: 100%;
  636. }
  637. .bottom {
  638. text-align: center;
  639. height: 70rpx;
  640. line-height: 70rpx;
  641. color: #999;
  642. font-size: 32rpx;
  643. background: #fff;
  644. padding-top: 20rpx;
  645. }
  646. .presslimit {
  647. height: 34rpx;
  648. line-height: 34rpx;
  649. margin-top: 8rpx;
  650. margin-left: 12rpx;
  651. color: #fd782d;
  652. font-size: 20rpx;
  653. letter-spacing: 1.16rpx;
  654. overflow: hidden;
  655. white-space: nowrap;
  656. text-overflow: ellipsis;
  657. }
  658. .presslimit text {
  659. margin-left: 15rpx;
  660. background: rgba(201, 201, 201, 0.1);
  661. }
  662. checkbox-group, radio-group {
  663. height: 400rpx;
  664. overflow-y: scroll;
  665. }
  666. .detailImg {
  667. width: 100%;
  668. background: #fff;
  669. margin: auto;
  670. }
  671. .detailImg image {
  672. display: block;
  673. width: 92%;
  674. padding: 0 4% 0 4%;
  675. margin-bottom: 20rpx;
  676. }
  677. .content {
  678. margin: 0;
  679. padding: 0;
  680. width: 100%;
  681. height: 100%;
  682. background: #f3f3f3;
  683. position: relative;
  684. }
  685. .poster {
  686. width: 100%;
  687. height: 100%;
  688. padding: 20rpx;
  689. position: absolute;
  690. top: 0;
  691. left: 0;
  692. }
  693. .bottomsave {
  694. width: 100%;
  695. height: 140rpx;
  696. line-height: 140rpx;
  697. margin: auto 0;
  698. bottom: 0;
  699. left: 0;
  700. right: 0;
  701. border-top: 1px solid #ccc;
  702. box-shadow: 0 0rpx 150rpx #ccc;
  703. background: #fff;
  704. }
  705. .saveposter {
  706. color: #fff;
  707. width: 380rpx;
  708. height: 80rpx;
  709. border-radius: 50rpx;
  710. background: #f08f04;
  711. margin-top: 30rpx;
  712. font-size: 32rpx;
  713. }
  714. .modal {
  715. width: 100%;
  716. height: 100%;
  717. position: fixed;
  718. top: 0;
  719. left: 0;
  720. background: rgba(0, 0, 0, 0.5);
  721. overflow: hidden;
  722. z-index: 10000;
  723. color: #fff;
  724. }
  725. .modal-content {
  726. width: 540rpx;
  727. height: 233rpx;
  728. line-height: 60rpx;
  729. overflow: hidden;
  730. position: fixed;
  731. top: 50%;
  732. left: 0;
  733. z-index: 11;
  734. background: #f9f9f9;
  735. margin: -16rpx 105rpx;
  736. border-radius: 36rpx;
  737. display: flex;
  738. }
  739. .modal-content view {
  740. display: inline-block;
  741. flex: 1;
  742. text-align: center;
  743. }
  744. .modal-content view>text {
  745. color: #000;
  746. display: block;
  747. font-size: 30rpx;
  748. }
  749. .modal-content view>image {
  750. margin-top: 40rpx;
  751. width: 90rpx;
  752. height: 90rpx;
  753. }
  754. .wx-swiper-dots {
  755. margin-bottom: 30rpx;
  756. }
  757. .quan {
  758. float: left;
  759. margin: 18rpx 15rpx 0 0;
  760. width: 12rpx;
  761. height: 12rpx;
  762. background: #e1e1e1;
  763. border-radius: 50%;
  764. }
  765. .swiper-box .wx-swiper-dots.wx-swiper-dots-horizontal {
  766. margin-bottom: 2rpx;
  767. }
  768. .swiper-box .wx-swiper-dot {
  769. width: 40rpx;
  770. display: inline-flex;
  771. height: 6rpx;
  772. margin-left: 10rpx;
  773. border-radius: 6rpx;
  774. justify-content: space-between;
  775. }
  776. .swiper-box .wx-swiper-dot::before {
  777. content: '';
  778. flex-grow: 1;
  779. background: #ccc8c8;
  780. }
  781. .swiper-box .wx-swiper-dot-active::before {
  782. background: #f6792b;
  783. }
  784. .jifen {
  785. font-size: 30rpx;
  786. }