- Select and submit a number rating
- See the "Thank you" card state after submitting a rating
- See hover and focus states for all interactive elements on the page
To create the rating buttons and to ensure that they were fully accessible, they were built ⚒️ using a form along with five radio inputs (each with their own label); this also prevents users from making more than one selection.
To announce any changes, when the thank you screen appears, I wrapped the "thank you" content in its own container along with a aria-live="polite".
For the JS, my eventListener is on the form as a submit.