mrr.sj.front/unpackage/dist/dev/mp-weixin/pages/user/components/project-tabs.wxss

125 lines
3.0 KiB
Plaintext

.project {
padding-left: 10rpx;
}
.project .project-tabs {
position: relative;
z-index: 500;
margin-bottom: 30rpx;
margin-top: 30rpx;
/* 分类弹框 */
}
.project .project-tabs .tab-scroll .tab-container {
display: flex;
flex-wrap: nowrap;
gap: 130rpx;
}
.project .project-tabs .tab-scroll .tab-container .tab-card {
position: relative;
padding-bottom: 12rpx;
}
.project .project-tabs .tab-scroll .tab-container .tab-card .tab-text {
font-weight: 500;
font-size: 28rpx;
color: #000;
line-height: 40rpx;
}
.project .project-tabs .tab-scroll .tab-container .tab-card .tab-card-price-img {
width: 13rpx;
height: 18rpx;
}
.project .project-tabs .tab-scroll .tab-container .tab-card .active {
color: #e8101e;
}
.project .project-tabs .tab-scroll .tab-container .tab-card .tab-active-indicator {
position: absolute;
bottom: 0;
left: 50%;
-webkit-transform: translateX(-50%);
transform: translateX(-50%);
width: 32rpx;
height: 6rpx;
background: linear-gradient(107deg, #f84c63 0%, #e8101e 100%);
border-radius: 10rpx;
}
.project .project-tabs .time-filter-popup {
width: 710rpx;
background-color: #fff;
opacity: 0;
height: 0;
transition: all 0.3s ease;
box-shadow: 0 4rpx 12rpx rgba(0, 0, 0, 0.1);
border-radius: 0 0 20rpx 20rpx;
overflow: hidden;
position: absolute;
top: 77rpx;
left: -30rpx;
}
.project .project-tabs .time-filter-popup.show {
height: auto;
opacity: 1;
visibility: visible;
}
.project .project-tabs .time-filter-popup .time-filter-popup-tabs {
display: flex;
flex-wrap: wrap;
padding: 20rpx 15rpx;
/* 调小左右边距 */
gap: 20rpx 20rpx;
/* 改小间距 */
}
.project .project-tabs .time-filter-popup .time-filter-popup-tabs .time-filter-popup-tab {
width: 155rpx;
height: 60rpx;
background: #f6f4f5;
border-radius: 10rpx;
font-size: 26rpx;
color: #333;
display: flex;
align-items: center;
justify-content: center;
transition: all 0.25s ease;
}
.project .project-tabs .time-filter-popup .time-filter-popup-tabs .active {
background: #ffecf0;
color: #e8101e;
font-weight: 500;
-webkit-transform: scale(1.05);
transform: scale(1.05);
}
.project .project-tabs .time-filter-popup .popup-big-btns {
display: flex;
justify-content: space-between;
gap: 30rpx;
padding: 20rpx 30rpx 30rpx 30rpx;
background: #fff;
}
.project .project-tabs .time-filter-popup .popup-big-btns .btn-reset,
.project .project-tabs .time-filter-popup .popup-big-btns .btn-confirm {
flex: 1;
width: 350rpx;
height: 80rpx;
line-height: 80rpx;
text-align: center;
border-radius: 10rpx;
font-size: 30rpx;
font-weight: 600;
}
.project .project-tabs .time-filter-popup .popup-big-btns .btn-reset {
color: #333;
background: #f6f4f5;
}
.project .project-tabs .time-filter-popup .popup-big-btns .btn-confirm {
color: #fff;
background: #ff3344;
}
.popMsk {
position: fixed;
top: 0;
left: -20rpx;
right: -20rpx;
bottom: 0;
background: transparent;
z-index: 400;
}