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.

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