Files
myep/assets/styles/components/autocomplete.css
T

34 lines
784 B
CSS

.autocomplete {
@apply relative w-full;
}
.autocomplete[data-loading="true"]:after {
@apply block absolute top-0 right-0;
@apply absolute w-4 h-4 rounded-full right-0 mr-4;
content: "";
border: 3px solid rgba(0, 0, 0, 0.12);
border-right: 3px solid rgba(0, 0, 0, 0.48);
top: 50%;
transform: translateY(-50%);
animation: rotate 1s infinite linear;
}
.autocomplete-icon {
@apply absolute top-1/2 right-0 transform -translate-y-1/2 mr-4;
}
.autocomplete[data-loading="true"] .autocomplete-icon {
@apply hidden;
}
.autocomplete-result-list {
@apply bg-white shadow-md max-h-64 overflow-y-auto;
}
.autocomplete-result {
@apply p-2;
}
.autocomplete-result:hover,
.autocomplete-result[aria-selected="true"] {
@apply bg-gray-200;
}