Bug: Checkboxes on the User Settings Page Need Focus States

[nickytonline]

Describe the bug

Checkboxes on the User Settings Page Need Focus States

Steps to reproduce

1. Go to your user settings page, https://app.opensauced.pizza/user/settings
2. Use the TAB key to tab through all the fields. Notice that once you hit a checkbox, you can change it's state with the keyboard, but it never receives a focus state.

Browsers

No response

Additional context (Is this in dev or production?)

No response

Code of Conduct

• I agree to follow this project's Code of Conduct

Contributing Docs

• I agree to follow this project's Contribution Docs

[github-actions]

Thanks for the issue, our team will look into it as soon as possible! If you would like to work on this issue, please wait for us to decide if it's ready. The issue will be ready to work on once we remove the "needs triage" label.

To claim an issue that does not have the "needs triage" label, please leave a comment that says ".take". If you have any questions, please reach out to us on Discord or follow up on the issue itself.

For full info on how to contribute, please check out our contributors guide.

[nickytonline]

We should add default focus states to the base styles for this @isabensusan @OgDev-01 so that the focus states become uniform throughout the site. We can then also probably remove a lot of focus state styles throughout all the components that have them.

[nickytonline]

Relates to https://github.com/open-sauced/internal-team/issues/21

[isabensusan]

@nickytonline Yes!! I'd love to have global focus styles. I think the styling we have for the search component is ideal:

Here's the tailwind classes making this happen:

focus-within:ring 
focus-within:border-orange-500 
focus-within:ring-orange-100

[open-sauced]

🎉 This issue has been resolved in version 1.78.0-beta.4 🎉

The release is available on GitHub release

Your semantic-release bot 📦🚀

[open-sauced]

🎉 This issue has been resolved in version 1.78.0 🎉

The release is available on GitHub release

Your semantic-release bot 📦🚀