index.wxss 14 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453
  1. page {
  2. font-size: 16px;
  3. }
  4. ax-body {
  5. display: block;
  6. height: 100%;
  7. background: linear-gradient(to bottom, #C7FFFD, #FFF, #E6F3FF, #8BECFF, #72B8FE, #86D3FD);
  8. }
  9. ax-body .ax-body .__root {
  10. display: flex;
  11. flex-direction: column;
  12. padding-left: 0 !important;
  13. padding-right: 0 !important;
  14. position: relative;
  15. overflow: hidden !important;
  16. padding-bottom: var(--app-navigation-heiht) !important;
  17. }
  18. .main-scroll-wrap {
  19. flex: 1;
  20. position: relative;
  21. }
  22. .root-scroll {
  23. position: absolute;
  24. top: 0;
  25. left: 0;
  26. right: 0;
  27. bottom: 0;
  28. }
  29. .contet-root {
  30. height: 100%;
  31. }
  32. .base {
  33. padding-left: 10px;
  34. padding-right: 10px;
  35. }
  36. /* 导航栏 */
  37. app-navigation {
  38. display: block;
  39. position: fixed;
  40. left: 0;
  41. right: 0;
  42. bottom: 0;
  43. }
  44. /* 标题栏 */
  45. .titlebar {
  46. display: flex;
  47. align-items: center;
  48. padding-left: 3px;
  49. }
  50. .titlebar .page-title {
  51. width: 133px;
  52. height: 33px;
  53. }
  54. .titlebar .page-subtitle {
  55. font-size: 12px;
  56. }
  57. /* 定位城市 */
  58. .search-view {
  59. position: -webkit-sticky;
  60. position: sticky;
  61. top: 0;
  62. z-index: 90;
  63. }
  64. .arrears-tips {
  65. margin: auto;
  66. margin-top: 20rpx;
  67. display: flex;
  68. align-items: center;
  69. justify-content: space-between;
  70. transition: opacity 0.3s;
  71. opacity: 1;
  72. width: 702rpx;
  73. height: 72rpx;
  74. background: #FFF6E8;
  75. border-radius: 16rpx;
  76. }
  77. .arrears-left {
  78. display: flex;
  79. align-items: center;
  80. gap: 20rpx;
  81. }
  82. .arrears-icon {
  83. width: 30rpx;
  84. height: 30rpx;
  85. margin-left: 20rpx;
  86. }
  87. .arrears-text {
  88. font-size: 24rpx;
  89. color: #FAB04D;
  90. }
  91. .arrears-btn {
  92. width: 112rpx;
  93. height: 48rpx;
  94. background: #FAB14F;
  95. border-radius: 24rpx;
  96. font-size: 24rpx;
  97. color: #FFFFFF;
  98. text-align: center;
  99. line-height: 48rpx;
  100. margin-right: 20rpx;
  101. }
  102. .locate-city {
  103. display: flex;
  104. align-items: center;
  105. margin-right: 10px;
  106. }
  107. .locate-city ._icon {
  108. display: inline-block;
  109. width: 20px;
  110. height: 20px;
  111. margin-right: 5px;
  112. }
  113. /* 搜索条 */
  114. .search-bar {
  115. flex: 1;
  116. display: flex;
  117. align-items: center;
  118. height: 30px;
  119. padding: 0 10px;
  120. border-radius: 8px;
  121. border: 1px solid #2B303A;
  122. background-color: #fff;
  123. }
  124. .search-bar input {
  125. flex: 1;
  126. display: block;
  127. font-size: 14px;
  128. background-color: transparent;
  129. }
  130. .search-bar ._icon-search {
  131. display: inline-block;
  132. width: 20px;
  133. height: 20px;
  134. margin-left: 10px;
  135. }
  136. /* 快捷栏 */
  137. .shortcut-bar {
  138. display: flex;
  139. align-items: center;
  140. justify-content: space-between;
  141. padding: 15px 10px;
  142. }
  143. .shortcut-bar ._item {
  144. display: flex;
  145. align-items: center;
  146. justify-content: center;
  147. flex-direction: column;
  148. }
  149. .shortcut-bar ._item ._icon {
  150. width: 40px;
  151. height: 40px;
  152. }
  153. .shortcut-bar ._item ._name {
  154. font-size: 12px;
  155. margin-top: 6px;
  156. }
  157. /* 版头广告 */
  158. .banner {
  159. width: 100%;
  160. height: calc((100vw - 20px) * (5/27));
  161. }
  162. .banner .swiper-item {
  163. display: flex;
  164. width: 100%;
  165. }
  166. .banner .swiper-item .swiper-item-image {
  167. display: block;
  168. width: 100%;
  169. border-radius: 5px;
  170. }
  171. /* 选项条 */
  172. .options-bar {
  173. align-items: center;
  174. padding: 15px 0px;
  175. font-size: 14px;
  176. }
  177. .options-bar .option-item {
  178. display: flex;
  179. align-items: center;
  180. justify-content: center;
  181. flex-direction: column;
  182. font-size: inherit;
  183. }
  184. .options-bar .option-item+.option-item {
  185. margin-left: 30px;
  186. }
  187. .options-bar .option-item.active {
  188. font-size: 18px;
  189. font-weight: bold;
  190. }
  191. .options-bar .option-item::after {
  192. content: '';
  193. display: block;
  194. width: 30px;
  195. height: 6px;
  196. -webkit-transform: translateY(5px) scaleX(0);
  197. transform: translateY(5px) scaleX(0);
  198. border-radius: 10pc;
  199. background: linear-gradient(to right, #8FF8FB, #47AEFF);
  200. transition: all 400ms ease;
  201. }
  202. .options-bar .option-item.active::after {
  203. -webkit-transform: translateY(5px) scaleX(1);
  204. transform: translateY(5px) scaleX(1);
  205. }
  206. .options-bar .separ {
  207. flex: 1;
  208. }
  209. .options-bar .separ::before {
  210. content: '';
  211. display: block;
  212. height: 13px;
  213. border-left: 1px solid #3EB6F8;
  214. }
  215. .options-bar .map-mode {
  216. color: #3EB6F8;
  217. }
  218. .options-bar .map-mode ._icon {
  219. width: 17px;
  220. height: 17px;
  221. margin-right: 5px;
  222. }
  223. /* 电站列表 */
  224. .list-scroll-wrap {
  225. height: var(--list-heiht);
  226. position: relative;
  227. }
  228. .list-scroll-wrap>.list-scroll {
  229. position: absolute;
  230. top: 0;
  231. left: 0;
  232. right: 0;
  233. bottom: 0;
  234. }
  235. .list {
  236. padding: 10px;
  237. }
  238. .list .item {
  239. display: block;
  240. border-radius: 8px;
  241. background-color: #fff;
  242. box-shadow: 0 1px 10px rgba(0, 39, 52, 0.1);
  243. overflow: hidden;
  244. }
  245. .list .item+.item {
  246. margin-top: 10px;
  247. }
  248. .list .item .contet {
  249. padding: 10px;
  250. background: #F6F9FE url(data:image/png;base64,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) no-repeat center;
  251. }
  252. .list .item .name {
  253. display: flex;
  254. font-weight: bold;
  255. }
  256. .list .item .name>.txt {
  257. flex: 1;
  258. line-height: 1.5em;
  259. }
  260. .list .item .name>.icon {
  261. display: flex;
  262. align-items: center;
  263. justify-content: center;
  264. width: 20px;
  265. height: 20px;
  266. border-radius: 4px;
  267. background: linear-gradient(to bottom, #2A67F0, #769FFC);
  268. margin-right: 10px;
  269. }
  270. .list .item .name>.icon image {
  271. display: block;
  272. width: 10px;
  273. }
  274. .list .item .parkade {
  275. display: flex;
  276. font-size: 12px;
  277. color: #aaa;
  278. margin-top: 15px;
  279. }
  280. .list .item .parkade>.txt {
  281. flex: 1;
  282. line-height: 1.5em;
  283. }
  284. .list .item .parkade>.icon {
  285. display: inline-flex;
  286. align-items: center;
  287. justify-content: center;
  288. width: 20px;
  289. height: 20px;
  290. background-color: #5BE7FF;
  291. margin-right: 10px;
  292. }
  293. .list .item .parkade>.icon image {
  294. display: block;
  295. width: 10px;
  296. }
  297. .list .item .info {
  298. margin-top: 15px;
  299. }
  300. .list .item .info .charge {
  301. display: inline-flex;
  302. align-items: center;
  303. justify-content: center;
  304. }
  305. .list .item .info .charge>.icon {
  306. display: inline-flex;
  307. align-items: center;
  308. justify-content: center;
  309. width: 20px;
  310. height: 20px;
  311. color: #fff;
  312. font-size: 13px;
  313. border-radius: 4px;
  314. background: linear-gradient(to bottom, #4FEF86, #00AA3A);
  315. }
  316. .list .item .info .charge>.icon.blue {
  317. background: linear-gradient(to bottom, #8EB1FF, #3071FF);
  318. }
  319. .list .item .info .charge>.value {
  320. margin-left: 5px;
  321. }
  322. .list .item .info .charge>.max {
  323. color: #aaa;
  324. font-size: 12px;
  325. }
  326. .list .item .info .charge>.max::before {
  327. content: '/';
  328. }
  329. .list .item .info .charge+.charge {
  330. margin-left: 30px;
  331. }
  332. .list .item .info .distance {
  333. display: flex;
  334. align-items: center;
  335. height: 22px;
  336. border: 1px solid #3EB6F8;
  337. border-radius: 100pc;
  338. font-size: 12px;
  339. color: #3EB6F8;
  340. padding-right: 7px;
  341. overflow: hidden;
  342. }
  343. .list .item .info .distance>.icon {
  344. display: inline-flex;
  345. align-items: center;
  346. justify-content: center;
  347. width: 20px;
  348. height: 20px;
  349. background-color: #3EB6F8;
  350. margin-right: 5px;
  351. }
  352. .list .item .info .distance>.icon image {
  353. display: block;
  354. width: 10px;
  355. }
  356. .list .item .price {
  357. display: flex;
  358. align-items: center;
  359. justify-content: space-between;
  360. background-color: #fff;
  361. height: 45px;
  362. font-size: 14px;
  363. padding: 0 10px;
  364. box-shadow: 0 0 5px rgba(0, 0, 0, 0.05);
  365. }
  366. .list .item .price .value {
  367. font-size: 20px;
  368. font-weight: bold;
  369. }
  370. .list .item .price .unit {
  371. margin-left: 6rpx;
  372. font-weight: bold;
  373. font-size: 12px;
  374. margin-left: 6rpx;
  375. }
  376. .card-bottom-text {
  377. font-weight: bold;
  378. font-size: 20px;
  379. color: #FF5D50;
  380. }
  381. .card-bottom-text .mini-text {
  382. margin-left: 6rpx;
  383. font-size: 12px;
  384. }
  385. .operation-price-btn {
  386. margin-left: 10rpx;
  387. width: 140rpx;
  388. height: 40rpx;
  389. background: #FF6457;
  390. border-radius: 22rpx 22rpx 22rpx 22rpx;
  391. font-style: italic;
  392. text-align: center;
  393. line-height: 40rpx;
  394. font-weight: 400;
  395. font-size: 22rpx;
  396. color: #FFFFFF;
  397. }
  398. .ordinary-price {
  399. margin-left: 12rpx;
  400. font-size: 24rpx;
  401. color: #AAAAAA;
  402. text-decoration: line-through;
  403. }
  404. .ad-popup {
  405. height: 1000rpx;
  406. }
  407. .ad-swiper{
  408. height: 100%;
  409. }
  410. .ad-swiper-item{
  411. height: 700rpx;
  412. }
  413. .close-get {
  414. margin-left: 550rpx;
  415. width: 50rpx;
  416. height: 50rpx;
  417. border-radius: 50%;
  418. border: 4rpx solid #3EB6F8;
  419. color: #fff;
  420. font-size: 30rpx;
  421. font-weight: bold;
  422. text-align: center;
  423. }
  424. .ad-image {
  425. margin-top: 10rpx;
  426. width: 600rpx;
  427. border-radius: 16rpx;
  428. }
  429. .discount{
  430. flex: 1;
  431. text-align: right;
  432. padding-right: 5px;
  433. }
  434. .discount view{
  435. display: inline-flex;
  436. align-items: center;
  437. height: 22px;
  438. border: 1px solid #ccc;
  439. border-radius: 5px;
  440. font-size: 12px;
  441. color: #F59C79;
  442. padding: 0 7px;
  443. overflow: hidden;
  444. }