salix/front/core/components/drop-down/style.scss

78 lines
1.7 KiB
SCSS
Executable File

@import "effects";
@import "variables";
.vn-drop-down {
display: flex;
flex-direction: column;
height: inherit;
& > .filter {
position: relative;
& > .search {
display: block;
width: 100%;
box-sizing: border-box;
border: none;
font-size: inherit;
padding: .6em;
margin: 0!important;
&.not-empty label{
display: none;
}
& .selected label {
font-size: inherit;
bottom: 2px;
color: $color-font-secondary;
}
}
& > vn-icon[icon=clear] {
display: none;
cursor: pointer;
position: absolute;
right: .5em;
top: .6em;
height: 1em;
color: #888;
border-radius: 50%;
background-color: rgba(255, 255, 255, .8);
font-size: 18px;
&:hover {
color: $color-font;
}
}
&:hover > vn-icon[icon=clear] {
display: block;
}
}
& > .list {
max-height: 20em;
overflow: auto;
ul {
padding: 0;
margin: 0;
list-style-type: none;
}
li, .status {
@extend %clickable;
padding: .6em;
white-space: nowrap;
display: flex;
& > input[type=checkbox] {
margin: 0;
margin-right: .6em;
}
&.active {
@extend %active;
}
}
.status {
color: $color-main;
font-weight: bold;
}
}
}