mrr.sj.front/unpackage/dist/dev/mp-weixin/components/select-time-page/select-time-page.wxss

430 lines
4.0 KiB
Plaintext
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

/* 全局样式nvue不支持scoped和less需使用普通css */
/* 时间选择弹框 */
.time-popup {
background-color: #ffffff;
border-radius: 24rpx 24rpx 0 0;
overflow: hidden;
-webkit-transform: translateY(0);
transform: translateY(0);
transition: -webkit-transform 0.3s;
transition: transform 0.3s;
transition: transform 0.3s, -webkit-transform 0.3s;
z-index: 999;
}
.popup-header {
display: flex;
flex-direction: row;
justify-content: space-between;
align-items: center;
padding: 30rpx 30rpx 36rpx 30rpx;
}
.popup-close {
font-family: PingFangSC, PingFang SC;
font-weight: 400;
font-size: 26rpx;
color: #999999;
line-height: 37rpx;
text-align: left;
font-style: normal;
}
.popup-title {
font-family: PingFangSC, PingFang SC;
font-weight: 500;
font-size: 30rpx;
color: #333333;
line-height: 42rpx;
text-align: left;
font-style: normal;
}
.time-picker-content {
padding: 32rpx 32rpx;
display: flex;
flex-wrap: wrap;
flex-direction: row;
width: 750rpx;
}
.time-picker-content__datas {
display: flex;
flex-direction: row;
flex-wrap: wrap;
align-items: flex-start;
width: 690rpx;
justify-content: space-between;
margin-bottom: 30rpx;
}
.time-picker-content__datas__date__item {
width: 214rpx;
height: 70rpx;
background: #f7f8fa;
border-radius: 10rpx;
display: flex;
align-items: center;
justify-content: center;
position: relative;
overflow: hidden;
}
.time-picker-content__datas__date__item__text {
font-family: PingFangSC, PingFang SC;
font-weight: 400;
font-size: 26rpx;
color: #333333;
line-height: 37rpx;
text-align: left;
font-style: normal;
z-index: 2;
position: relative;
}
.time-picker-content__datas__date__item__text.active {
color: #ffffff;
}
.time-picker-content__datas__date__item__box {
width: 214rpx;
height: 74rpx;
position: absolute;
z-index: 1;
margin-bottom: 8rpx;
}
.time-picker-content__datas__date__item__box__img {
width: 214rpx;
height: 74rpx;
}
.time-picker-content__time__list {
width: 690rpx;
display: flex;
flex-direction: row;
flex-wrap: wrap;
}
.time-picker-content__time__list__item {
width: 114rpx;
height: 66rpx;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
margin-bottom: 26rpx;
}
.time-picker-content__time__list__item__text {
font-weight: 400;
font-size: 30rpx;
color: #333333;
line-height: 66rpx;
text-align: center;
font-style: normal;
}
.time-picker-content__time__list__item__state {
font-size: 20rpx;
}
/* 状态样式 */
.state-available {
color: #3c3638;
/* background: #f7f8fa; */
}
.state-full {
color: #3c3638;
background: #e4e9f0;
}
.state-rest {
color: #cdcdcd;
background: #f7f8f9;
}
.state-locked {
color: #3c3638;
background: #e4e9f0;
}
.state-unavailable {
color: #ffffff;
background: #e4e9f0;
}
.state-unknown {
color: #999999;
background: #f7f8fa;
}
.isActive {
background: rgba(252, 67, 124, 0.08);
color: #e8101e !important;
}
.isActive .time-picker-content__time__list__item__text {
color: #e8101e !important;
}
/* 选中样式前后弧度 */
.firstActive {
border-radius: 51rpx 0rpx 0rpx 51rpx;
}
.lastActive {
border-radius: 0rpx 51rpx 51rpx 0rpx}
.time-picker-content__time__sure {
padding: 39rpx 0;
display: flex;
flex-direction: row;
width: 690rpx;
justify-content: center;
}
.time-picker-content__time__sure__box {
width: 648rpx;
height: 94rpx;
background: #E8101E;
border-radius: 48rpx;
display: flex;
align-items: center;
justify-content: center;
}
.time-picker-content__time__sure__box__text {
font-family: PingFangSC, PingFang SC;
font-weight: 400;
font-size: 30rpx;
color: #ffffff;
line-height: 42rpx;
text-align: center;
font-style: normal;
}