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.

651 lines
9.2 KiB

  1. @import "../../app.wxss";
  2. page {
  3. background-color: #fff;
  4. }
  5. .container{
  6. padding-bottom: 60rpx;
  7. }
  8. .header{
  9. width: 690rpx;
  10. height: 80rpx;
  11. font-size: 32rpx;
  12. margin: 0 auto;
  13. border-radius:16rpx;
  14. line-height: 80rpx;
  15. letter-spacing: 3rpx;
  16. }
  17. .header image{
  18. width: 40rpx;
  19. vertical-align: middle;
  20. margin-top:-5rpx;
  21. margin-right:6rpx;
  22. }
  23. .top{
  24. border-bottom:2rpx solid #f8f8f8;
  25. }
  26. .headBox {
  27. width: 690rpx;
  28. margin: 30rpx auto 0;
  29. box-sizing: border-box;
  30. display: flex;
  31. background-color: white;
  32. }
  33. .headBox image {
  34. width: 150rpx;
  35. height: 150rpx;
  36. margin: 10rpx 30rpx 0 0;
  37. border-radius: 16rpx;
  38. }
  39. .titleName {
  40. width: 100%;
  41. line-height: 35rpx;
  42. height: 35rpx;
  43. color: #666;
  44. font-size: 32rpx;
  45. word-break: break-all;
  46. text-align: justify;
  47. font-weight: bold;
  48. }
  49. ::-webkit-scrollbar {
  50. width: 0;
  51. height: 0;
  52. color: transparent;
  53. }
  54. .carLocation, .locationNumber {
  55. display: inline-block;
  56. height: 40rpx;
  57. color: #999;
  58. font-size: 24rpx;
  59. line-height: 30rpx;
  60. }
  61. .carLocation {
  62. width: 206rpx;
  63. font-size: 28rpx;
  64. }
  65. .yuan {
  66. display: inline-block;
  67. margin-left: 6rpx;
  68. color: #333;
  69. }
  70. .price {
  71. width: 690rpx;
  72. font-size: 28rpx;
  73. color: #999;
  74. margin: 10rpx auto 0;
  75. }
  76. .time {
  77. color: #999 !important;
  78. }
  79. .price .fl {
  80. width: 15%;
  81. color: #333;
  82. }
  83. .price .fr {
  84. width: 85%;
  85. color: #999;
  86. line-height: 40rpx;
  87. font-size: 26rpx;
  88. }
  89. .titleName .fr {
  90. color: #999;
  91. font-size: 27rpx;
  92. }
  93. .borderBox {
  94. width: 750rpx;
  95. margin-top:30rpx;
  96. }
  97. .borderUp {
  98. width: 680rpx;
  99. margin: 0 auto;
  100. font-size: 36rpx;
  101. border: 2rpx dashed #979797;
  102. border-radius: 16rpx;
  103. padding-bottom: 40rpx;
  104. height: 202rpx;
  105. margin-top: 47rpx;
  106. }
  107. .addicense_active {
  108. width: 690rpx;
  109. /* box-shadow: 0 4rpx 20rpx 0 rgba(153, 153, 153, 0.35); */
  110. border-radius: 12rpx;
  111. /* background: #02c0ff; *//* padding-bottom: 40rpx; */
  112. }
  113. .myCar {
  114. display: block;
  115. text-align: center;
  116. font-size: 34rpx;
  117. color: #02c0ff;
  118. letter-spacing: 0;
  119. }
  120. .carNumber {
  121. display: block;
  122. height: 50rpx;
  123. line-height: 50rpx;
  124. text-align: center;
  125. font-size: 26rpx;
  126. color: #999;
  127. letter-spacing: 0;
  128. margin-top: 10rpx;
  129. }
  130. .addBox {
  131. width: 750rpx;
  132. position: relative;
  133. background-color: white;
  134. }
  135. .add {
  136. position: absolute;
  137. left: 50%;
  138. top: 50%;
  139. transform: translate(-50%, -50%);
  140. font-size: 34rpx;
  141. color: #666;
  142. border: 2px dashed #eee;
  143. padding: 30rpx 50rpx;
  144. border-radius: 16rpx;
  145. }
  146. .add text {
  147. font-size: 40rpx;
  148. }
  149. .bottonBox {
  150. width: 750rpx;
  151. margin-top: 34rpx;
  152. margin-bottom: 80rpx;
  153. border-top: 16rpx #f8f8f8 solid;
  154. }
  155. .bottonBox view:nth-of-type(1) image{
  156. height: 45rpx;
  157. }
  158. .textStyle {
  159. background-color: white;
  160. height: 88rpx;
  161. line-height: 88rpx;
  162. padding-left: 82rpx;
  163. border-bottom: 1px #f8f8f8 solid;
  164. position: relative;
  165. font-size: 30rpx;
  166. color: #333;
  167. letter-spacing: 1.16rpx;
  168. }
  169. .textStyle image {
  170. width: 40rpx;
  171. height: 40rpx;
  172. top: 24rpx;
  173. left: 27rpx;
  174. position: absolute;
  175. }
  176. .swiper {
  177. position: relative;
  178. margin: 0 auto;
  179. height: 262rpx;
  180. }
  181. .swiper-item {
  182. width: 365rpx;
  183. font-size: 75rpx;
  184. font-weight: 400;
  185. text-align: center;
  186. color: rgba(255, 255, 255, 1);
  187. }
  188. .swiper-item .clearfix1 {
  189. background: #bbe6ff;
  190. border-radius: 12rpx;
  191. padding: 6rpx;
  192. }
  193. .tche {
  194. width: 685rpx;
  195. height: 88rpx;
  196. line-height: 88rpx;
  197. margin: 0 auto;
  198. background: #00c0ff;
  199. border-radius: 60rpx;
  200. position: relative;
  201. margin-top: 30rpx;
  202. }
  203. .txt01 {
  204. width: 667rpx;
  205. height: 180rpx;
  206. line-height: 180rpx;
  207. float: left;
  208. background: #00c0ff;
  209. border-radius: 12rpx;
  210. border: 3px solid #fff;
  211. text-align: center;
  212. font-size: 60rpx;
  213. }
  214. .passNumberBox {
  215. width: 690rpx;
  216. margin: 32rpx auto 0;
  217. position: relative;
  218. background-color: white;
  219. }
  220. .numberBox {
  221. width: 100%;
  222. }
  223. .passNumber {
  224. width: 400rpx;
  225. height: 100rpx;
  226. font-size: 32rpx;
  227. font-weight: 600;
  228. line-height: 100rpx;
  229. left: 55rpx;
  230. position: absolute;
  231. }
  232. .nopay {
  233. height: 80rpx;
  234. line-height: 80rpx;
  235. font-weight: 400;
  236. }
  237. .number {
  238. font-size: 48rpx;
  239. color: #1f2d3d;
  240. letter-spacing: 0;
  241. line-height: 52rpx;
  242. font-weight: 400;
  243. }
  244. .manage_plate {
  245. width: 65%;
  246. border-radius: 80rpx;
  247. margin: 40rpx auto 0;
  248. background: #02c0ff;
  249. color: #fff;
  250. text-align: center;
  251. font-size: 30rpx;
  252. }
  253. .button_active {
  254. opacity: 0.6;
  255. }
  256. .btn001 {
  257. height: 88rpx;
  258. line-height: 88rpx;
  259. margin: 0 auto;
  260. font-size: 30rpx;
  261. font-weight: 400;
  262. color: #fff;
  263. background: none;
  264. }
  265. .parkPrice {
  266. font-size: 30rpx;
  267. font-weight: 500;
  268. }
  269. .deleteButton {
  270. font-size: 28rpx;
  271. line-height: 50rpx;
  272. height: 50rpx;
  273. top: 50%;
  274. right: 30rpx;
  275. position: absolute;
  276. transform: translate(0, -50%);
  277. color: white;
  278. background-color: #00c0ff !important;
  279. }
  280. .deleteButton button {
  281. background-color: #00c0ff !important;
  282. }
  283. .detail {
  284. width: 32rpx;
  285. height: 32rpx;
  286. right: 34rpx;
  287. top: 32rpx;
  288. position: absolute;
  289. }
  290. .detail image {
  291. width: 44rpx;
  292. height: 44rpx;
  293. position: absolute;
  294. left: 0;
  295. top: 0;
  296. }
  297. .voucher {
  298. width: 90%;
  299. padding: 0 5%;
  300. background-color: #fff;
  301. /* background-color: #cbcbcb; */
  302. height: 80rpx;
  303. position: relative;
  304. margin: 0 0 12rpx 0;
  305. border-bottom: 2rpx #fff solid;
  306. display: flex;
  307. justify-content: space-between;;
  308. }
  309. .textV1, .textV2 {
  310. height: 58rpx;
  311. width: 100rpx;
  312. padding-top: 26rpx;
  313. text-align: center;
  314. line-height: 80rxp;
  315. font-size: 24rpx;
  316. color: #333;
  317. }
  318. .textV2 {
  319. margin-top: 0rpx;
  320. padding: 0;
  321. /* background-color: rgb(0, 192, 255); */
  322. border-radius: 10rpx;
  323. width: 300rpx;
  324. height: 80rpx;
  325. line-height: 80rpx;
  326. font-size: 20rpx;
  327. border: 4rpx #fff solid;
  328. margin-bottom: 20rpx;
  329. }
  330. .textV3 {
  331. width: 225rpx;
  332. }
  333. .choice {
  334. width: 80rpx;
  335. height: 80rpx;
  336. position: relative;
  337. }
  338. .choice image {
  339. position: absolute;
  340. left: 50%;
  341. top: 50%;
  342. transform: translate(-50%, -50%);
  343. width: 30rpx;
  344. height: 30rpx;
  345. }
  346. .buy-view {
  347. background: #fff;
  348. position: relative;
  349. height: 88rpx;
  350. margin-top: 30rpx;
  351. }
  352. .buy {
  353. background: #00c0ff;
  354. height: 88rpx;
  355. width: 73%;
  356. margin: 0 auto;
  357. color: #fff;
  358. font-size: 36rpx;
  359. line-height: 88rpx;
  360. border-radius: 60rpx;
  361. position: relative;
  362. z-index: 100;
  363. text-align: center;
  364. }
  365. .buyBox {
  366. height: 88rpx;
  367. line-height: 88rpx;
  368. width: 98%;
  369. position: absolute;
  370. left: 0;
  371. right: 0;
  372. bottom: 0;
  373. top: 0;
  374. z-index: 100000000;
  375. border-radius: 60rpx;
  376. }
  377. .active {
  378. opacity: 0.6;
  379. }
  380. .borderBox {
  381. width: 750rpx;
  382. }
  383. .carmanage {
  384. position: relative;
  385. width: 690rpx;
  386. margin: 15rpx auto 0;
  387. height: 60rpx;
  388. line-height: 60rpx;
  389. /* border-bottom: 1rpx solid #eee; */
  390. }
  391. .carmanage .fr {
  392. font-size: 28rpx;
  393. color: #888;
  394. letter-spacing: 1.16rpx;
  395. text-align: right;
  396. }
  397. .fl {
  398. float: left;
  399. }
  400. .fr {
  401. float: right;
  402. }
  403. .carmanage .fl {
  404. width: 400rpx;
  405. }
  406. .carmanage .fr image {
  407. position: absolute;
  408. top: 0;
  409. right: 0;
  410. bottom: 0;
  411. margin: auto;
  412. width: 44rpx;
  413. height: 44rpx;
  414. }
  415. .carmanage image {
  416. width: 40rpx;
  417. vertical-align: middle;
  418. }
  419. .mycar {
  420. display: inline-block;
  421. font-size: 33rpx;
  422. color: #666;
  423. line-height: 35rpx;
  424. letter-spacing: 1.16rpx;
  425. }
  426. .num {
  427. display: inline-block;
  428. font-size: 26rpx;
  429. color: #999;
  430. letter-spacing: 0;
  431. margin-left: 20rpx;
  432. }
  433. .orderBox {
  434. padding: 0 45rpx;
  435. position: relative;
  436. }
  437. .priceBox {
  438. display: inline-block;
  439. width: 355rpx;
  440. }
  441. .priceBox text {
  442. color: #333;
  443. font-size: 28rpx;
  444. display: block;
  445. text-align: left;
  446. }
  447. .payBox {
  448. width: 250rpxpx;
  449. }
  450. .payBox button {
  451. width: 230rpx;
  452. border: 0;
  453. font-size: 32rpx;
  454. margin-top: 13rpx;
  455. margin-right: 20rpx;
  456. background-color: lightgreen;
  457. color: white;
  458. }
  459. input {
  460. outline: none;
  461. border: none;
  462. list-style: none;
  463. }
  464. button::after {
  465. border: none;
  466. }
  467. .right {
  468. display: inline-block;
  469. width: 328rpx;
  470. }
  471. .textRight {
  472. margin-left: 0;
  473. margin-right: 25rpx;
  474. text-align: left;
  475. font-size: 30rpx !important;
  476. color: #333 !important;
  477. }
  478. .myCars image {
  479. width: 44rpx;
  480. height: 44rpx;
  481. vertical-align: middle;
  482. margin-right: 14rpx;
  483. }
  484. .myCars {
  485. font-size: 34rpx;
  486. color: #02c0ff;
  487. letter-spacing: 0;
  488. text-align: center;
  489. padding-top: 58rpx;
  490. }
  491. .dots {
  492. position: absolute;
  493. left: 0;
  494. right: 0;
  495. bottom: 19rpx;
  496. display: flex;
  497. justify-content: center;
  498. height: 19rpx;
  499. background: #fff;
  500. }
  501. .dots .dot {
  502. margin: 0 8rpx;
  503. width: 32rpx;
  504. height: 14rpx;
  505. background: #ccc;
  506. border-radius: 8rpx;
  507. transition: all 0.6s;
  508. }
  509. .dots .dot.active {
  510. width: 49rpx;
  511. height: 4rpx;
  512. background: rgba(86, 189, 248, 1);
  513. border-radius: 6rpx;
  514. }
  515. .coupon {
  516. font-size: 28rpx;
  517. color: #666;
  518. }
  519. .orderBox .fl {
  520. line-height: 70rpx;
  521. font-size: 28rpx;
  522. color: #333;
  523. }
  524. .orderBox .fr {
  525. line-height: 70rpx;
  526. font-size: 28rpx;
  527. color: #ff4949;
  528. }
  529. .jians {
  530. font-size: 22rpx;
  531. display: inline-block;
  532. width: 34rpx;
  533. height: 34rpx;
  534. text-align: center;
  535. background: #ff4949;
  536. line-height: 34rpx;
  537. color: #fff;
  538. border-radius: 6rpx;
  539. margin-right: 6rpx;
  540. }
  541. .jiant{
  542. display: inline-block;
  543. width: 44rpx;
  544. height: 44rpx;
  545. vertical-align: middle;
  546. margin-top: -6rpx;
  547. margin-right: -10rpx;
  548. }
  549. .img {
  550. display: block;
  551. width: 211rpx;
  552. margin: 168rpx auto 40rpx;
  553. }
  554. .txt1 {
  555. display: block;
  556. font-size: 34rpx;
  557. color: #333;
  558. letter-spacing: 0;
  559. text-align: center;
  560. }
  561. .txt2 {
  562. display: block;
  563. font-size: 28rpx;
  564. color: #999;
  565. letter-spacing: 0;
  566. text-align: center;
  567. line-height: 40rpx;
  568. margin-top: 10rpx;
  569. }