/* components/drop-down-fliter/index.wxss */
|
.drop-down-select {
|
position: relative;
|
padding: 0 var(--padding-my);
|
z-index: 100;
|
}
|
|
.drop-down-select-menu {
|
position: relative;
|
background-color: #fff;
|
padding: 24rpx 32rpx;
|
border-radius: var(--border-radius-card-sm);
|
}
|
|
.menu-title {
|
overflow: hidden;
|
text-overflow: ellipsis;
|
white-space: nowrap;
|
}
|
|
.active .menu-title {
|
color: var(--main-color);
|
}
|
|
.arrow {
|
transition: transform 1s;
|
transform: rotate(90deg);
|
}
|
|
.active .arrow {
|
transform: rotate(-90deg);
|
color: var(--main-color);
|
}
|
|
.drop-down-select-submenu {
|
position: absolute;
|
left: var(--padding-my);
|
right: var(--padding-my);
|
top: 89rpx;
|
padding: 24rpx 32rpx 0;
|
background-color: #fff;
|
animation: move 0.5s 0s;
|
z-index: 99;
|
border-radius: var(--border-radius-card-sm);
|
margin-top: 16rpx;
|
max-height: 800rpx;
|
overflow-y: auto;
|
}
|
|
@keyframes move {
|
0% {
|
top: 0;
|
}
|
100% {
|
top: 89rpx;
|
}
|
}
|
|
.submenu-item {
|
margin-bottom: 24rpx;
|
}
|
|
.active .submenu-title {
|
color: var(--main-color);
|
}
|
|
.submenu-title-h5 {
|
font-weight: 600;
|
}
|
|
.tick {
|
display: none;
|
margin-left: 12rpx;
|
color: var(--main-color);
|
}
|
|
.active .tick {
|
display: inline;
|
}
|
|
.cover {
|
position: fixed;
|
top: 0;
|
left: 0;
|
bottom: 0;
|
width: 100%;
|
height: 100%;
|
background-color: var(--gray-7);
|
opacity: 0.4;
|
z-index: 99;
|
animation: covermove 0.5s 0s;
|
}
|
|
@keyframes covermove {
|
0% {
|
height: 0;
|
}
|
100% {
|
height: 100%;
|
}
|
}
|
