You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
 
 
 

66 lines
1.2 KiB

.searchresults {
position: fixed;
top: 50px;
left: 0;
right: 0;
margin: 0 auto;
width: 500px;
z-index: 1;
background-color: darken(mc('blue-grey', '900'), 2%);
border: 1px solid mc('blue-grey', '900');
box-shadow: 0 0 5px mc('blue-grey', '500');
color: #FFF;
transition: max-height 1s ease;
&-enter-active, &-leave-active {
overflow: hidden;
}
&-enter-to, &-leave {
max-height: 500px;
}
&-enter, &-leave-to {
max-height: 0px;
}
.searchresults-label {
background-color: mc('blue-grey', '800');
color: mc('blue-grey', '300');
padding: 8px;
font-size: 13px;
letter-spacing: 1px;
text-transform: uppercase;
box-shadow: 0 0 5px rgba(0,0,0,0.3);
}
.searchresults-list {
padding-bottom: 5px;
> li {
display: flex;
font-size: 14px;
transition: background-color .2s linear;
&:nth-child(odd) {
background-color: mc('blue-grey', '900');
}
&.is-active, &:hover {
background-color: mc('blue-grey', '600');
color: #FFF;
}
a {
color: mc('blue-grey', '50');
display: flex;
align-items: center;
height: 30px;
padding: 0 20px;
width: 100%;
cursor: pointer;
}
}
}
}