All solutions

Tried my best to make it look the best on all screen sizes. Don't know about 2xl screens as I finished this on my laptop which had an xl screen.

Learned a lot about styling in tailwind and how to use the different screen size selectors to make the app responsive.

Also learned more about the validation method for each input. I only had practice validating one input field before, where this project had 5 input fields.

There is probably work that could be done to optimize the code such as mapping the inputs, but I wanted to move on to a different project.

Any tips would be appreciated.

The biggest problem I had was the validation check after the user stops typing for a second. Because I wanted the error to go away when the user started typing again. I know its not the most responsive but its way better than my previous work. I wanted to change more of the font sizes with the screen sizes but was too lazy. Learned more about Next.js and tailwind thanks to this.

Had a surprisingly easy time with this one. Thanks for brushing up my skills. Although I think I went overboard with the nth-child usage, but I guess it would be the same with classnames.

Is using clamp and flex the correct way? Because I know there is grid and other ways to size the box. I just didn't want to use pixels but I guess I still did.