metonym / svelte-typeahead

Accessible, fuzzy search typeahead component
https://metonym.github.io/svelte-typeahead
MIT License
225 stars 18 forks source link

styling overrides require more specific CSS selectors #76

Open russellsamora opened 1 year ago

russellsamora commented 1 year ago

For the results you just need:

:global([data-svelte-typeahead] li) {
  background: blue;
}

But for the form elements (input and label) you need:

:global([data-svelte-typeahead] [data-svelte-search] input) {
  background: blue;
}
russellsamora commented 1 year ago

this actually sometimes doesn't work, and requires the !important flag (in the case of the ul element), so maybe worth noting as well.