d3-autocomplete
Version:
Small autocomplete written using D3
43 lines (34 loc) • 951 B
CSS
section.autocomplete {
position: relative;
display: inline-block;
}
ol.suggestions {
display: block;
box-sizing: border-box;
position: absolute;
display: block;
width: 100%;
margin: 0; padding: 0;
box-shadow: 0 0 2px #ccc;
border: 1px solid #ccc;
background: white;
list-style: none;
}
ol.suggestions li {
display: block;
padding: 5px;
cursor: pointer;
}
ol.suggestions li.search-highlight {
background: #eee;
}
@keyframes spin { 100% { -webkit-transform: rotate(360deg); transform:rotate(360deg); } }
section.loading:after {
content: '';
width: 25px;
height: 25px;
display: inline-block;
background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="50px" height="50px"><path fill="#999" d="M25.251,6.461c-10.318,0-18.683,8.365-18.683,18.683h4.068c0-8.071,6.543-14.615,14.615-14.615V6.461z"></path></svg>');
background-size: 100%;
animation:spin 1s ease-out infinite;
}