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.

254 lines
4.2 KiB

  1. .page {
  2. padding: 20rpx 0;
  3. }
  4. .page .tabBar {
  5. display: flex;
  6. justify-content: space-evenly;
  7. align-items: center;
  8. width: 100%;
  9. }
  10. .page .tabBar .item {
  11. width: 28%;
  12. height: 80rpx;
  13. line-height: 80rpx;
  14. color: #fff;
  15. background-color: #52a0fd;
  16. text-align: center;
  17. border-radius: 15rpx;
  18. opacity: 0.7;
  19. transform: scale(1);
  20. transition: all 0.3s;
  21. }
  22. .page .tabBar .item.active {
  23. opacity: 1;
  24. transform: scale(1.1);
  25. }
  26. .selectArea {
  27. /* background-color: #b4b4b4; */
  28. padding: 20rpx;
  29. text-align: center;
  30. }
  31. .selectArea .timeSelect {
  32. margin-bottom: 10rpx;
  33. }
  34. .selectArea .timeSelect .picker .pickerBorder {
  35. display: inline-block;
  36. width: 400rpx;
  37. height: 55rpx;
  38. line-height: 55rpx;
  39. border: 1px solid #bbbbbb;
  40. background-color: #f5f5f5;
  41. border-radius: 10rpx;
  42. text-align: center;
  43. }
  44. .line {
  45. border-bottom: 1rpx solid #c7c7c7;
  46. }
  47. .searchArea {
  48. padding: 20rpx;
  49. }
  50. .searchBox {
  51. text-align: center;
  52. margin: 30rpx 0 50rpx 0;
  53. }
  54. .searchArea .searchBox .timeSelect {
  55. display: flex;
  56. align-items: center;
  57. justify-content: space-between;
  58. font-size: 25rpx;
  59. padding: 0 80rpx;
  60. }
  61. .searchArea .searchBox .pickerSelect {
  62. font-size: 25rpx;
  63. margin-bottom: 30rpx;
  64. }
  65. .searchArea .searchBox .pickerSelect .picker {
  66. font-size: 27rpx;
  67. }
  68. .searchArea .searchBox .pickerSelect .picker .pickerBorder {
  69. display: inline-block;
  70. font-size: 27rpx;
  71. width: 420rpx;
  72. height: 45rpx;
  73. line-height: 45rpx;
  74. color: #a0a0a0;
  75. border: 1px solid #a0a0a0;
  76. /* background-color: #b9b9b9; */
  77. border-radius: 10rpx;
  78. }
  79. .searchArea .searchBox .timeSelect .picker .pickerBorder {
  80. display: inline-block;
  81. width: 400rpx;
  82. height: 40rpx;
  83. line-height: 40rpx;
  84. font-size: 25rpx;
  85. color: #ffffff;
  86. border: 1px solid #bbbbbb;
  87. background-color: #75b3fd;
  88. border-radius: 10rpx;
  89. text-align: center;
  90. }
  91. .searchArea .searchBox .timeSelect .picker {
  92. display: inline-block;
  93. width: 400rpx;
  94. height: 50rpx;
  95. }
  96. .searchArea .searchBox .timeSelect .picker .input {
  97. width: 100%;
  98. height: 100%;
  99. color: #000000;
  100. border: 1px solid #a0a0a0;
  101. /* background-color: #b9b9b9; */
  102. border-radius: 10rpx;
  103. }
  104. .searchArea .searchBtn {
  105. display: inline-block;
  106. width: 20%;
  107. height: 100%;
  108. color: #ffffff;
  109. border-radius: 10rpx;
  110. background-color: #52a0fd;
  111. padding: 10rpx 0;
  112. }
  113. .searchArea .searchBtn.one {
  114. position: relative;
  115. bottom: 10rpx;
  116. right: 40rpx;
  117. display: inline-block;
  118. width: 110rpx;
  119. height: 100%;
  120. font-size: 25rpx;
  121. color: #ffffff;
  122. border-radius: 10rpx;
  123. background-color: #52a0fd;
  124. padding: 10rpx 0;
  125. }
  126. .meterList {
  127. padding: 0 20rpx;
  128. font-size: 28rpx;
  129. }
  130. .meterList .item {
  131. padding: 20rpx 30rpx;
  132. background-color: #52a0fd;
  133. color: #ffffff;
  134. margin-bottom: 50rpx;
  135. border-radius: 15rpx;
  136. }
  137. .meterList .beforeItem {
  138. width: 100%;
  139. }
  140. .meterList .beforeItem .inline {
  141. font-size: 28rpx;
  142. /* text-overflow: ellipsis;
  143. overflow: hidden;
  144. word-break: break-all;
  145. white-space: nowrap; */
  146. line-height: 50rpx;
  147. margin: 20rpx 0;
  148. color: #a1a1a1;
  149. }
  150. .meterList .item text {
  151. font-size: 28rpx;
  152. }
  153. .meterList .item .top {
  154. margin-bottom: 20rpx;
  155. }
  156. .meterList .item .center {
  157. margin-bottom: 10rpx;
  158. }
  159. .meterList .item .bottom {
  160. display: flex;
  161. align-items: center;
  162. justify-content: space-between;
  163. }
  164. .meterList .item .bottom .input {
  165. position: relative;
  166. top: 12rpx;
  167. right: 10rpx;
  168. display: inline-block;
  169. width: 143rpx;
  170. background-color: #fff;
  171. color: #000000;
  172. text-align: center;
  173. }
  174. .meterList .item .bottom .input.disabled {
  175. color: #a5a5a5;
  176. }
  177. .meterList .searchBtn {
  178. width: 80%;
  179. height: 80rpx;
  180. color: #ffffff;
  181. line-height: 80rpx;
  182. text-align: center;
  183. margin: auto;
  184. border-radius: 10rpx;
  185. background-color: #52a0fd;
  186. }
  187. .time {
  188. position: relative;
  189. display: flex;
  190. flex: 2.5;
  191. text-align: center;
  192. z-index: 10;
  193. align-items: center;
  194. margin-bottom: 30rpx;
  195. }
  196. .time>view:nth-of-type(1),
  197. .time>view:nth-of-type(3) {
  198. flex: 1;
  199. }
  200. .time>view:nth-of-type(2) {
  201. flex: 0.5;
  202. }
  203. .time>view text {
  204. display: block;
  205. }
  206. .time>view text:nth-of-type(2n+1) {
  207. margin-top: 69rpx;
  208. }
  209. .time>view text:nth-of-type(2n+1) {
  210. color: #999;
  211. font-size: 26rpx;
  212. margin-bottom: 24rpx;
  213. }
  214. .time>view text:nth-of-type(2n) {
  215. color: rgba(153, 153, 153, 1);
  216. font-size: 32rpx;
  217. margin-top: 34rpx;
  218. }