C端小程序
Du kannst nicht mehr als 25 Themen auswählen Themen müssen entweder mit einem Buchstaben oder einer Ziffer beginnen. Sie können Bindestriche („-“) enthalten und bis zu 35 Zeichen lang sein.

636 Zeilen
9.5 KiB

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