@ebay/skin
Version:
Skin - CSS modules that represent the brand eBay
56 lines (44 loc) • 1.06 kB
CSS
.filter-input {
display: inline-block;
width: 100%;
}
.filter-input__clear-btn {
display: none;
}
.filter-input .textbox {
border-radius: var(--border-radius-150);
max-width: 480px;
min-width: 200px;
}
.filter-input .textbox__control {
height: 40px;
}
.filter-input
.textbox__control:not(:placeholder-shown)
~ .filter-input__clear-btn {
display: block;
}
.filter-input .textbox__control::-webkit-search-cancel-button {
-webkit-appearance: none;
display: none;
}
.filter-input .textbox button.icon-btn.icon-btn--transparent.icon-btn--small {
min-width: 32px;
}
.filter-input .textbox .icon-btn:last-child {
flex-shrink: 0;
margin-inline-end: var(--spacing-50);
margin-inline-start: 0;
}
.filter-input--small .textbox .icon-btn:last-child {
margin-inline-end: 0;
}
.filter-input--large .textbox .icon-btn:last-child {
margin-inline-end: var(--spacing-100);
}
.filter-input--small .textbox__control {
height: 32px;
}
.filter-input--large .textbox__control {
height: 48px;
}