src/js/components/style-search/style.scss
.input-container {
position: relative;
}
.input {
width: 100%;
padding-left: 35px !important;
padding-inline: 35px 0 !important;
&-open {
border-bottom-left-radius: 0 !important;
border-bottom-right-radius: 0 !important;
}
}
.input-icon > * {
position: absolute;
margin: 0;
top: calc(50% - 9px);
left: 10px;
@at-root [dir='rtl'] & {
left: 0;
right: 10px;
}
}
.suggestions-container-open {
margin: -1px -1px 0 1px;
border-bottom-left-radius: 4px;
border-bottom-right-radius: 4px;
border: 1px solid #8d96a0;
border-top: 0;
max-height: 200px;
overflow-y: auto;
}
.suggestions-list {
display: grid;
margin: 0;
}
.suggestion {
cursor: pointer;
margin: 0;
padding: 5px 8px;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
&-highlighted {
font-weight: bold;
}
}