Interactive Rating Component using Sass and JavaScript

Solution retrospective
Hi there!
I added a validation to the form. It was not required but I wanted to explore some contents I learned while doing this and it worked.
I wrote down about my difficulties doing this project on the read.me file because I felt there I had more space to talk about it, I would be glad if you guys could check them. But to summarize:
- I want to display a message if there is no option selected when submitting the form. Visually speaking is it better to: just push it into the container and let the flexbox do its magic or create a container big enough so it won't redistribute its elements?
- I had to do a "magic number" kind of solution to hide the radio input on the Thank You Card. I used the
innerHTML
from JS to export the chosen option to that span, but since I put the input inside the label, the output contains an option (because that exported the button itself without css styles). I had to hid the input with something likeinput {display: none)}
so it would hide the radio input but keep the label text. Is there a better way to this?
- And this one is about some other thing I wanted to implement on this project but I did not know how to do it, so I need some help on this. I wanted keybord users to send the form as well. I do not know how relevant is this, but I thought it would be a nice touch (since we can usually type someting and press enter when filing a form). I have tried out some things but it did not work, so I left it out of the submission.
Please log in to post a comment
Log in with GitHubCommunity feedback
No feedback yet. Be the first to give feedback on Nicholas Albuquerque's solution.
Join our Discord community
Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!
Join our Discord