@Alex-Archer-I
Posted
Hi!
Your code is quite valid =) You are using controlled components for keep inputs value updated and using states to handle errors and change windows. That's enough for such simple project =)
I can give a couple semantic suggestions. At first - the label element should contain text Email address. You can put the error message there as well, or wrap them with flex.
And you can use picture tag to dynamically switch images on the different versions.
<picture>
<source srcset="mobile.jpg" media="(max-width: 900px)">
<img src="desktop.jpg" alt="">
</picture>
It checks the conditions of source tags and choose one relevant or img there are no matches.
Hope that helps. Good luck =)
Marked as helpful
@rug19
Posted
Thank you so much for the feedback, in this project the image changes in the mobile version, even so, can I use a picture tag? @Alex-Archer-I
@Alex-Archer-I
Posted
@rug19
Yeah, that its main purpose =) Now you change image inside the media query, so you can write this media condition on the source inside picture.
<source srcset="/public/illustration-sign-up-mobile.svg" media="(max-width: 700px)">
I guess that way you can use env variable path you are using for image src in the component.
Marked as helpful
