.page { padding: 20rpx 0; } .page .tabBar { display: flex; justify-content: space-evenly; align-items: center; width: 100%; } .page .tabBar .item { width: 28%; height: 80rpx; line-height: 80rpx; color: #fff; background-color: #52a0fd; text-align: center; border-radius: 15rpx; opacity: 0.7; transform: scale(1); transition: all 0.3s; } .page .tabBar .item.active { opacity: 1; transform: scale(1.1); } .selectArea { /* background-color: #b4b4b4; */ padding: 20rpx; text-align: center; } .selectArea .timeSelect { margin-bottom: 10rpx; } .selectArea .timeSelect .picker .pickerBorder { display: inline-block; width: 400rpx; height: 55rpx; line-height: 55rpx; border: 1px solid #bbbbbb; background-color: #f5f5f5; border-radius: 10rpx; text-align: center; } .line { border-bottom: 1rpx solid #c7c7c7; } .searchArea { padding: 20rpx; } .searchBox { text-align: center; margin: 30rpx 0 50rpx 0; } .searchArea .searchBox .timeSelect { display: flex; align-items: center; justify-content: space-between; font-size: 25rpx; padding: 0 80rpx; } .searchArea .searchBox .pickerSelect { font-size: 25rpx; margin-bottom: 30rpx; } .searchArea .searchBox .pickerSelect .picker { font-size: 27rpx; } .searchArea .searchBox .pickerSelect .picker .pickerBorder { display: inline-block; font-size: 27rpx; width: 420rpx; height: 45rpx; line-height: 45rpx; color: #a0a0a0; border: 1px solid #a0a0a0; /* background-color: #b9b9b9; */ border-radius: 10rpx; } .searchArea .searchBox .timeSelect .picker .pickerBorder { display: inline-block; width: 400rpx; height: 40rpx; line-height: 40rpx; font-size: 25rpx; color: #ffffff; border: 1px solid #bbbbbb; background-color: #75b3fd; border-radius: 10rpx; text-align: center; } .searchArea .searchBox .timeSelect .picker { display: inline-block; width: 400rpx; height: 50rpx; } .searchArea .searchBox .timeSelect .picker .input { width: 100%; height: 100%; color: #000000; border: 1px solid #a0a0a0; /* background-color: #b9b9b9; */ border-radius: 10rpx; } .searchArea .searchBtn { display: inline-block; width: 20%; height: 100%; color: #ffffff; border-radius: 10rpx; background-color: #52a0fd; padding: 10rpx 0; } .searchArea .searchBtn.one { position: relative; bottom: 10rpx; right: 40rpx; display: inline-block; width: 110rpx; height: 100%; font-size: 25rpx; color: #ffffff; border-radius: 10rpx; background-color: #52a0fd; padding: 10rpx 0; } .meterList { padding: 0 20rpx; font-size: 28rpx; } .meterList .item { padding: 20rpx 30rpx; background-color: #52a0fd; color: #ffffff; margin-bottom: 50rpx; border-radius: 15rpx; } .meterList .beforeItem { width: 100%; } .meterList .beforeItem .inline { font-size: 28rpx; /* text-overflow: ellipsis; overflow: hidden; word-break: break-all; white-space: nowrap; */ line-height: 50rpx; margin: 20rpx 0; color: #a1a1a1; } .meterList .item text { font-size: 28rpx; } .meterList .item .top { margin-bottom: 20rpx; } .meterList .item .center { margin-bottom: 10rpx; } .meterList .item .bottom { display: flex; align-items: center; justify-content: space-between; } .meterList .item .bottom .input { position: relative; top: 12rpx; right: 10rpx; display: inline-block; width: 143rpx; background-color: #fff; color: #000000; text-align: center; } .meterList .item .bottom .input.disabled { color: #a5a5a5; } .meterList .searchBtn { width: 80%; height: 80rpx; color: #ffffff; line-height: 80rpx; text-align: center; margin: auto; border-radius: 10rpx; background-color: #52a0fd; } .time { position: relative; display: flex; flex: 2.5; text-align: center; z-index: 10; align-items: center; margin-bottom: 30rpx; } .time>view:nth-of-type(1), .time>view:nth-of-type(3) { flex: 1; } .time>view:nth-of-type(2) { flex: 0.5; } .time>view text { display: block; } .time>view text:nth-of-type(2n+1) { margin-top: 69rpx; } .time>view text:nth-of-type(2n+1) { color: #999; font-size: 26rpx; margin-bottom: 24rpx; } .time>view text:nth-of-type(2n) { color: rgba(153, 153, 153, 1); font-size: 32rpx; margin-top: 34rpx; }