-
Notifications
You must be signed in to change notification settings - Fork 435
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
YlvaK-W6-Survey-with-React #449
base: master
Are you sure you want to change the base?
Conversation
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
You seem to have met the requirements for the assignment and there are no errors in the console log and according to Lighthouse the score for Accessibility and Best Practices are 100% and there are no errors in the Wave check. You did a really great job on the survey, be proud!
<label htmlFor="favoriteplace" className="favoriteplace-label"> | ||
<p>What is your favorite place/surrounding?</p> | ||
<br /> | ||
<input |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
If you add a unique label to each radio button the radio buttons will be accessible and more user-friendly. That way you can click on the question and check the radio button and you don't have to click on the radio button.
setSlider(event.target.value); | ||
} | ||
return ( | ||
<div className="slide-container"> |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Nice addition with the slider!
</div> | ||
)} | ||
<div className="progress-bar"> | ||
<div className="progress-bar-fill" style={{ width: `${progress}% ` }} /> |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I like the progress bar!
align-items: center; | ||
min-height: 100vh; | ||
padding: 25px; | ||
background-image: url('../public/background-survey.jpg'); |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Pretty background image and colors on the form.
https://ylva-karlsson-week6-survey.netlify.app/