C端小程序
25'ten fazla konu seçemezsiniz Konular bir harf veya rakamla başlamalı, kısa çizgiler ('-') içerebilir ve en fazla 35 karakter uzunluğunda olabilir.

508 satır
8.1 KiB

  1. /* pages/park/addPark/addPark.wxss */
  2. page{
  3. background: #F4F5F9;
  4. }
  5. .addpark-title {
  6. margin-top: 48rpx;
  7. text-align: center;
  8. font-size: 30rpx;
  9. color: #9a9b9c;
  10. }
  11. .addpark-num {
  12. display: flex;
  13. justify-content: center;
  14. width: 100%;
  15. margin-top: 33rpx;
  16. height: 90rpx;
  17. }
  18. .addpark-num-head {
  19. display: flex;
  20. width: 164rpx;
  21. border-radius: 10rpx;
  22. color: #3C3C3C;
  23. text-align: center;
  24. align-items: center;
  25. }
  26. .addpark-num-head view, .addpark-num-center view, .addpark-num-new view {
  27. width: 88rpx;
  28. height: 82rpx;
  29. line-height: 82rpx;
  30. margin: 0 auto;
  31. border: 2rpx solid #E1E1E1;
  32. border-radius: 10rpx;
  33. background: #FFFFFF;
  34. }
  35. .addpark-num-center {
  36. display: flex;
  37. margin-left: 20rpx;
  38. width: 392rpx;
  39. /* border: 2rpx solid #E1E1E1; */
  40. border-radius: 10rpx;
  41. text-align: center;
  42. align-items: center;
  43. }
  44. .addpark-num-head-border {
  45. border-left: 2rpx solid #fff;
  46. }
  47. .addpark-num-center-border {
  48. border-left: 2rpx solid #E1E1E1;
  49. }
  50. .addpark-num-new {
  51. display: flex;
  52. width: 82rpx;
  53. text-align: center;
  54. align-items: center;
  55. margin-left: 20rpx;
  56. border: 2rpx dashed #2C8DFF;
  57. border-radius: 10rpx;
  58. }
  59. .addpark-num-new view {
  60. border:none!important;
  61. }
  62. .newsource {
  63. font-size: 16rpx;
  64. position: absolute;
  65. top: 100rpx;
  66. left: 670rpx;
  67. height: 30rpx;
  68. width: 60rpx;
  69. background: linear-gradient(127deg,rgba(252,177,74,1) 0%,rgba(254,70,20,1) 100%);
  70. color: #fff;
  71. /* border: 1px solid #11c67b; */
  72. border-radius: 14rpx;
  73. text-align: center;
  74. line-height: 30rpx;
  75. }
  76. .addpark-choose {
  77. width: 672rpx;
  78. margin: 34rpx auto;
  79. height: 440rpx;
  80. border: 2rpx solid #FD832D;
  81. border-radius: 16rpx;
  82. padding: 30rpx 15rpx;
  83. }
  84. .addpark-choose-line {
  85. display: flex;
  86. justify-content: center;
  87. }
  88. .addpark-choose-font {
  89. width: 80rpx;
  90. height: 77rpx;
  91. background: #FEFFFE;
  92. text-align: center;
  93. line-height: 77rpx;
  94. border: 1 px solid #f8f8f8;
  95. border-radius: 8rpx;
  96. margin: 5rpx;
  97. }
  98. .addpark-choose-font p {
  99. display: block;
  100. }
  101. .addpark-choose-font p image {
  102. width: 5vmin;
  103. height: 3.5vmin;
  104. margin-top: -0.8vmin;
  105. vertical-align: middle;
  106. }
  107. .addpark-choose-num {
  108. width: 672rpx;
  109. margin: 34rpx auto;
  110. height: 510rpx;
  111. border: 2rpx solid #FD832D;
  112. border-radius: 16rpx;
  113. padding: 30rpx 15rpx;
  114. }
  115. .choose {
  116. color: #FD832D;
  117. }
  118. .choose-title {
  119. border: 2rpx solid #FD832D;
  120. }
  121. .addpark-button-submit {
  122. width: 670rpx;
  123. height: 94rpx;
  124. margin: 0 auto;
  125. background: linear-gradient(127deg,rgba(252,177,74,1) 0%,rgba(254,70,20,1) 100%);
  126. color: #fff;
  127. border-radius: 60rpx;
  128. line-height: 94rpx;
  129. }
  130. .active{
  131. opacity: .6;
  132. }
  133. .addpark-button-gray {
  134. width: 670rpx;
  135. height: 94rpx;
  136. margin: 0 auto;
  137. background: #cbcccd;
  138. color: #fff;
  139. border-radius: 60rpx;
  140. line-height: 94rpx;
  141. }
  142. .addpark-back {
  143. font-size: 30rpx;
  144. color: #FD832D;
  145. float: right;
  146. margin: 25rpx 25rpx;
  147. }
  148. .plaza-parking-info {
  149. box-sizing: border-box;
  150. height: 235rpx;
  151. margin: 20rpx 30rpx 0 30rpx !important;
  152. background: #fff;
  153. padding: 20rpx 30rpx 30rpx 30rpx;
  154. border-radius: 10rpx;
  155. display: flex;
  156. }
  157. .plaza-parking-info image {
  158. height: 147rpx;
  159. width: 147rpx;
  160. margin-top: 15rpx;
  161. margin-right: 30rpx;
  162. }
  163. .plaza-parking-info .flex-item {
  164. flex: 1;
  165. }
  166. .plaza-parking-info .flex-item p:first-child {
  167. font-size: 30rpx;
  168. margin-bottom: 10rpx;
  169. text-overflow: hidden;
  170. overflow: hidden;
  171. white-space: nowrap;
  172. width: 100%;
  173. }
  174. .plaza-parking-info .plaza-tip {
  175. color: rgb(153, 153, 153);
  176. font-size: 24rpx;
  177. }
  178. .plaza-parking-info span {
  179. color: rgb(153, 153, 153);
  180. font-size: 24rpx;
  181. width: 50%;
  182. display: inline-block;
  183. }
  184. .plaza-parking-info span:last-child {
  185. color: rgb(88, 171, 251);
  186. }
  187. .addCar {
  188. /* margin-top:1vmin!important; */
  189. text-align: center;
  190. }
  191. .addCar .add-btn {
  192. color: rgb(88, 171, 251);
  193. font-size: 32rpx;
  194. }
  195. .addCar .tip {
  196. margin-top: 3vmin;
  197. font-size: 24rpx;
  198. color: rgb(153, 153, 153);
  199. }
  200. .addCar i {
  201. color: rgb(88, 171, 251);
  202. }
  203. .bottom-nav {
  204. padding: 3vmin 5vmin;
  205. display: flex;
  206. justify-content: space-between;
  207. }
  208. .bottom-nav button.parking-log {
  209. border: rgb(88, 171, 251) 1rpx solid;
  210. color: rgb(88, 171, 251);
  211. width: 330rpx;
  212. line-height: 68rpx;
  213. height: 68rpx;
  214. font-size: 32rpx;
  215. }
  216. .bottom-nav button.parking-coupon {
  217. border: rgb(253, 50, 83) 1rpx solid;
  218. background: rgb(253, 50, 83);
  219. color: #fff;
  220. width: 330rpx;
  221. height: 68rpx;
  222. line-height: 68rpx;
  223. font-size: 32rpx;
  224. }
  225. /*绑定车辆列表*/
  226. .car-list {
  227. padding: 30rpx;
  228. }
  229. .car-list .item {
  230. box-sizing: border-box;
  231. background: #fff;
  232. border-radius: 15rpx;
  233. height: 100rpx;
  234. line-height: 100rpx;
  235. padding: 0 20rpx 0 40rpx;
  236. margin-bottom: 20rpx;
  237. position: relative;
  238. }
  239. .car-list .item span {
  240. line-height: 50rpx;
  241. display: inline-block;
  242. width: 257rpx;
  243. border: 1rpx solid rgb(88, 171, 251);
  244. padding-left: 30rpx;
  245. border-radius: 10rpx;
  246. color: rgb(88, 171, 251);
  247. font-size: 32rpx;
  248. font-weight: bold;
  249. }
  250. .car-list .item image {
  251. position: absolute;
  252. right: 23rpx;
  253. top: 26rpx;
  254. }
  255. .car-list .oTitle {
  256. font-size: 3.5vmin;
  257. color: rgb(153, 153, 153);
  258. line-height: 8vmin;
  259. height: 8vmin;
  260. display: block;
  261. margin-left: 1vmin;
  262. }
  263. .car-list .oTitle image {
  264. display: block;
  265. width: 4.3vmin;
  266. height: 4.1vmin;
  267. background-size: 100%;
  268. float: left;
  269. margin-right: 1vmin;
  270. vertical-align: middle;
  271. }
  272. .footer {
  273. text-align: right;
  274. padding-right: 30rpx;
  275. color: rgb(88, 171, 251);
  276. font-size: 24rpx;
  277. }
  278. .wrap {
  279. padding: 10rpx 30rpx 30rpx 30rpx;
  280. }
  281. .out {
  282. display: flex;
  283. justify-content: space-between;
  284. margin-bottom: 20rpx;
  285. height: 180rpx;
  286. padding: 20rpx 30rpx;
  287. border-radius: 20rpx;
  288. box-shadow: 6rpx 6rpx 6rpx rgba(0, 0, 0, 0.06);
  289. }
  290. .bg-blue {
  291. background: linear-gradient(45deg, rgb(98, 216, 253), rgb(89, 178, 251));
  292. }
  293. .bg-blue .car-name {
  294. background-color: #fff;
  295. color: rgb(88, 177, 251);
  296. text-align: center;
  297. }
  298. .bg-blue .name-border {
  299. border: 1px solid rgb(88, 177, 251);
  300. border-radius: 15rpx;
  301. font-size: 27rpx;
  302. }
  303. .bg-white {
  304. background-color: #fff;
  305. }
  306. .bg-white .name-border {
  307. border: 1px solid #fff;
  308. border-radius: 15rpx;
  309. font-size: 27rpx;
  310. }
  311. .car {
  312. flex: 1;
  313. }
  314. .car text {
  315. display: block;
  316. }
  317. .car-name {
  318. margin-bottom: 25rpx;
  319. background-color: rgb(88, 177, 251);
  320. color: #fff;
  321. box-sizing: border-box;
  322. padding: 7rpx 10rpx;
  323. border-radius: 20rpx;
  324. width: 246rpx;
  325. height: 54rpx;
  326. text-align: center;
  327. }
  328. .parking-time {
  329. font-size: 30rpx;
  330. color: rgb(182, 182, 182);
  331. margin-bottom: 10rpx;
  332. }
  333. .need-pay {
  334. display: block;
  335. height: 80rpx;
  336. text-align: right;
  337. color: #fff;
  338. font-size: 64rpx;
  339. }
  340. .go-pay {
  341. box-sizing: border-box;
  342. border: 5rpx solid #fff;
  343. text-align: center;
  344. position: absolute;
  345. bottom: 0;
  346. width: 130rpx;
  347. line-height: 50rpx;
  348. right: 0;
  349. color: #fff;
  350. border-radius: 20rpx;
  351. font-size: 28rpx;
  352. }
  353. .address {
  354. font-size: 30rpx;
  355. color: rgb(182, 182, 182);
  356. }
  357. .bg-blue .parking-time {
  358. color: #fff;
  359. }
  360. .bg-blue .address {
  361. color: #fff;
  362. }
  363. .cost>text {
  364. display: block;
  365. margin-bottom: 12rpx;
  366. }
  367. .time {
  368. font-size: 25rpx;
  369. background: red;
  370. color: white;
  371. padding: 0 7rpx;
  372. margin-right: 10rpx;
  373. }
  374. .dot {
  375. color: red;
  376. margin-right: 10rpx;
  377. }
  378. .time-tip {
  379. font-size: 24rpx;
  380. color: rgb(182, 182, 182);
  381. text-align: center;
  382. }
  383. .already-pay {
  384. color: rgb(88, 171, 251);
  385. font-size: 30rpx;
  386. }
  387. .out-cars {
  388. position: relative;
  389. }
  390. .out-car {
  391. margin-top: 10rpx;
  392. display: block;
  393. font-size: 24rpx;
  394. margin-bottom: 30rpx;
  395. color: rgb(182, 182, 182);
  396. }
  397. .go-pay-disabled {
  398. display: inline-block;
  399. position: absolute;
  400. border: 5rpx solid rgb(204, 204, 204);
  401. bottom: 0;
  402. right: 0;
  403. text-align: center;
  404. background: rgb(204, 204, 204);
  405. color: #fff;
  406. border-radius: 20rpx;
  407. width: 130rpx;
  408. line-height: 50rpx;
  409. font-size: 28rpx;
  410. }
  411. .oTitle {
  412. font-size: 3.5vmin;
  413. color: rgb(153, 153, 153);
  414. line-height: 8vmin;
  415. height: 8vmin;
  416. display: block;
  417. margin-left: 1vmin;
  418. }
  419. .oTitle image {
  420. display: block;
  421. width: 4.3vmin;
  422. height: 4.1vmin;
  423. background-size: 100%;
  424. float: left;
  425. margin-right: 1vmin;
  426. margin-top: 2vmin;
  427. }
  428. .info-right {
  429. width: 30vmin;
  430. text-align: right;
  431. position: relative;
  432. }
  433. .car-outting {
  434. background: #fff;
  435. }
  436. .car-outting .car-name {
  437. color: #fff;
  438. }