salix/front/core/components/autocomplete/style.scss

65 lines
1.3 KiB
SCSS
Executable File

@import "effects";
vn-autocomplete {
overflow: hidden;
& > div > .mdl-textfield {
position: relative;
width: 100%;
& > input {
cursor: pointer;
height: 30px;
text-overflow: ellipsis;
white-space: nowrap;
overflow: hidden;
}
& > .icons {
display: none;
position: absolute;
right: 0;
top: 1.3em;
height: 1em;
color: $secondary-font-color;
border-radius: .2em;
& > vn-icon {
cursor: pointer;
font-size: 18px;
&:hover {
color: $main-font-color;
}
}
}
&:hover > .icons,
& > input:focus + .icons {
display: block;
}
}
}
ul.vn-autocomplete {
list-style-type: none;
padding: 1em;
margin: 0;
padding: 0;
overflow: auto;
max-height: 300px;
li {
@extend %clickable;
display: block;
padding: .8em;
margin: 0;
&.active {
background-color: $hover;
}
&.load-more {
color: $main-01;
font-family: vn-font-bold;
padding: .4em .8em;
}
}
}