React Multistep Form

Hi, @Kamelek1337

I took a look at your solution and I have some thoughts:

• Your body covers the full viewport because of min-height: 100vh, but your #app and .container don’t. In situations like this, I usually apply Flexbox to the body and #app, with flex-direction set to column, and use flex: 1 on #app and .container to make them stretch properly.

body {
  display: flex;
  flex-direction: column;
  min-height: 100vh;
}

#app {
  display: flex;
  flex-direction: column;
  flex: 1;
}

.container {
  flex: 1;
/* Your styles here*/
}

This setup ensures both #app and .container expand to fill the available space of the body.

• You're hardcoding the width and height of .container and <main>. It also looks like you're not using media queries to make the form responsive (it seems like you're using React state to change its class, which is another valid approach). However, on viewports between 601px and 1200px, the form isn't centered or responsive. I'd suggest removing the hardcoded width and height, and using media queries to handle responsiveness.

Hope this helps!