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

Form select elements don't match styling when disabled #885

Open
stephaniehobson opened this issue Jun 19, 2023 · 6 comments · May be fixed by #959
Open

Form select elements don't match styling when disabled #885

stephaniehobson opened this issue Jun 19, 2023 · 6 comments · May be fixed by #959
Labels
Bug 🪲 Something isn't working

Comments

@stephaniehobson
Copy link
Contributor

Description

When a select drop down is disabled it gains a filled blue triangle as the down arrow. This is incongruous with the carrot the select uses for other states and I would expect it to be grey.

Steps to reproduce

  1. Add disabled to the select element

Expected result

Screenshot 2023-06-19 at 14 06 10

Actual result

Screenshot 2023-06-19 at 14 06 10

Environment

MacOS, Firefox Nightly.

@stephaniehobson stephaniehobson added the Bug 🪲 Something isn't working label Jun 19, 2023
@Ayushsunny
Copy link

Hey @stephaniehobson , is this fixed?

@reemhamz
Copy link
Contributor

@Ayushsunny Doesn't seem like it, feel free to pick it up if you'd like

@Ayushsunny
Copy link

@reemhamz How to reproduce this issue?

@janbrasna janbrasna linked a pull request Jul 27, 2024 that will close this issue
2 tasks
@janbrasna
Copy link
Contributor

janbrasna commented Jul 29, 2024

There are two options. The caret colour can match the border like it does in all other states (currently drafted in #959):

Screen Shot 2024-07-29 at 19 53 24

or it can be simplified even more, and for better contrast with the disabled grey background the caret can just default to its initial colour:

Screen Shot 2024-07-29 at 19 54 17

(I briefly preferred the latter, but after some time went with the former for consistency…)

@stephaniehobson Do you have a preference?

@stephaniehobson
Copy link
Contributor Author

I don't have much of an opinion here either but since my vague leaning is also your vague leaning let's go with the latter for better contrast and more simplicity.

@janbrasna
Copy link
Contributor

Ack. The explicit fourth state variable can always be added later if deemed necessary, for now this saves one sass:string-based recursive uriencoding when compiling.

@stephaniehobson For comparison the former preview was here, the latter can now be testdriven here, feel free to torture the controls to your liking and whenever you're happy with what you see you can always hit that green button…

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Bug 🪲 Something isn't working
Projects
None yet
Development

Successfully merging a pull request may close this issue.

4 participants