Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add class to input when dropdown is active #384

Open
AlecRust opened this issue Oct 9, 2019 · 0 comments

Comments

@AlecRust
Copy link

commented Oct 9, 2019

I'm working with inputs that have a border radius:

screenshot

And when the results are open I'd like to remove the bottom border radius from the input, to achieve:

screenshot

However, there doesn't seem to be a class on the input when the results panel is open for me to do this.

The aria-expanded attribute does change when the results panel has results, so I can do this:

.autocomplete__input[aria-expanded=true] {
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
}

But not when the panel is open for the "no results" message. So it only half works:

screenshot

This seems like a pretty common use case that could warrant adding a class for? Or perhaps aria-expanded should be set to true when the results panel is expanded showing "No results"?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
2 participants
You can’t perform that action at this time.