C端小程序
Nie możesz wybrać więcej, niż 25 tematów Tematy muszą się zaczynać od litery lub cyfry, mogą zawierać myślniki ('-') i mogą mieć do 35 znaków.

809 wiersze
12 KiB

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