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.

639 wiersze
9.0 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. /* .textV1{
  334. position: absolute;
  335. left: 10rpx;
  336. top: 22rpx;
  337. } */
  338. /* .textV2{
  339. position: absolute;
  340. top: 22rpx;
  341. right: 80rpx;
  342. } */
  343. .choice {
  344. width: 80rpx;
  345. height: 80rpx;
  346. position: relative;
  347. }
  348. .choice image {
  349. position: absolute;
  350. left: 50%;
  351. top: 50%;
  352. transform: translate(-50%, -50%);
  353. width: 30rpx;
  354. height: 30rpx;
  355. }
  356. .buy-view {
  357. background: #fff;
  358. position: relative;
  359. height: 88rpx;
  360. margin-top: 30rpx;
  361. }
  362. .buy {
  363. background: #00c0ff;
  364. height: 88rpx;
  365. width: 73%;
  366. margin: 0 auto;
  367. color: #fff;
  368. font-size: 36rpx;
  369. line-height: 88rpx;
  370. border-radius: 60rpx;
  371. position: relative;
  372. z-index: 100;
  373. text-align: center;
  374. }
  375. .buyBox {
  376. height: 88rpx;
  377. line-height: 88rpx;
  378. width: 98%;
  379. position: absolute;
  380. left: 0;
  381. right: 0;
  382. bottom: 0;
  383. top: 0;
  384. z-index: 100000000;
  385. border-radius: 60rpx;
  386. }
  387. .active {
  388. opacity: 0.6;
  389. }
  390. .borderBox {
  391. width: 750rpx;
  392. }
  393. .carmanage {
  394. position: relative;
  395. width: 690rpx;
  396. margin: 15rpx auto 0;
  397. height: 60rpx;
  398. line-height: 60rpx;
  399. /* border-bottom: 1rpx solid #eee; */
  400. }
  401. .carmanage .fr {
  402. font-size: 28rpx;
  403. color: #888;
  404. letter-spacing: 1.16rpx;
  405. text-align: right;
  406. }
  407. .fl {
  408. float: left;
  409. }
  410. .fr {
  411. float: right;
  412. }
  413. .carmanage .fl {
  414. width: 400rpx;
  415. }
  416. .carmanage .fr image {
  417. position: absolute;
  418. top: 0;
  419. right: 0;
  420. bottom: 0;
  421. margin: auto;
  422. width: 44rpx;
  423. height: 44rpx;
  424. }
  425. .carmanage image {
  426. width: 40rpx;
  427. vertical-align: middle;
  428. }
  429. .mycar {
  430. display: inline-block;
  431. font-size: 33rpx;
  432. color: #666;
  433. line-height: 35rpx;
  434. letter-spacing: 1.16rpx;
  435. }
  436. .num {
  437. display: inline-block;
  438. font-size: 26rpx;
  439. color: #999;
  440. letter-spacing: 0;
  441. margin-left: 20rpx;
  442. }
  443. .orderBox {
  444. padding: 0 45rpx;
  445. position: relative;
  446. }
  447. .priceBox {
  448. display: inline-block;
  449. width: 355rpx;
  450. }
  451. .priceBox text {
  452. color: #333;
  453. font-size: 28rpx;
  454. display: block;
  455. text-align: left;
  456. }
  457. .payBox {
  458. width: 250rpxpx;
  459. }
  460. .payBox button {
  461. width: 230rpx;
  462. border: 0;
  463. font-size: 32rpx;
  464. margin-top: 13rpx;
  465. margin-right: 20rpx;
  466. background-color: lightgreen;
  467. color: white;
  468. }
  469. input {
  470. outline: none;
  471. border: none;
  472. list-style: none;
  473. }
  474. button::after {
  475. border: none;
  476. }
  477. .right {
  478. display: inline-block;
  479. width: 328rpx;
  480. }
  481. .textRight {
  482. margin-left: 0;
  483. margin-right: 25rpx;
  484. text-align: left;
  485. font-size: 30rpx !important;
  486. color: #333 !important;
  487. }
  488. .myCars image {
  489. width: 44rpx;
  490. height: 44rpx;
  491. vertical-align: middle;
  492. margin-right: 14rpx;
  493. }
  494. .myCars {
  495. font-size: 34rpx;
  496. color: #02c0ff;
  497. letter-spacing: 0;
  498. text-align: center;
  499. padding-top: 58rpx;
  500. }
  501. .dots {
  502. position: absolute;
  503. left: 0;
  504. right: 0;
  505. bottom: 19rpx;
  506. display: flex;
  507. justify-content: center;
  508. height: 19rpx;
  509. background: #fff;
  510. }
  511. .dots .dot {
  512. margin: 0 8rpx;
  513. width: 32rpx;
  514. height: 14rpx;
  515. background: #ccc;
  516. border-radius: 8rpx;
  517. transition: all 0.6s;
  518. }
  519. .dots .dot.active {
  520. width: 49rpx;
  521. height: 4rpx;
  522. background: rgba(86, 189, 248, 1);
  523. border-radius: 6rpx;
  524. }
  525. .coupon {
  526. font-size: 28rpx;
  527. color: #666;
  528. }
  529. .orderBox .fl {
  530. line-height: 70rpx;
  531. font-size: 28rpx;
  532. color: #333;
  533. }
  534. .orderBox .fr {
  535. line-height: 70rpx;
  536. font-size: 28rpx;
  537. color: #ff4949;
  538. }
  539. .jians {
  540. font-size: 22rpx;
  541. display: inline-block;
  542. width: 34rpx;
  543. height: 34rpx;
  544. text-align: center;
  545. background: #ff4949;
  546. line-height: 34rpx;
  547. color: #fff;
  548. border-radius: 6rpx;
  549. margin-right: 6rpx;
  550. }
  551. .jiant{
  552. display: inline-block;
  553. width: 44rpx;
  554. height: 44rpx;
  555. vertical-align: middle;
  556. margin-top: -6rpx;
  557. margin-right: -10rpx;
  558. }