C端小程序
您最多选择25个主题 主题必须以字母或数字开头,可以包含连字符 (-),并且长度不得超过35个字符

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