Interactive rating component using React (CRA), TypeScript & CSS3

Community feedback

• 

  Santiago Moraga Caldera•710

  @Remy349

  Posted over 1 year ago

  Congratulations, it is an incredible result. Just a couple of recommendations for you to consider:

  • Modify a couple of styles in the css, in the responsive design for phones comes a point where it does not adapt very well, this is because of the min-width: 420px you have in the body, remove it :)

  • There are many ways to center an element, one of them is the following and consider using in your <main class="page"> tag:

  /* USING FLEX */
  
  .page {
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 100vh;
  }
  
  /* USING GRID */
  .page {
    display: grid;
    place-content: center;
    min-height: 100vh;
  }
  

  I recommend that you use min-height instead of just height.

  • In your react code I reviewed it and it is very well done, although there are many things you can improve, such as creating a component for the thank you card, separate from the component you have in the card component.

  I hope this will help you to continue improving your learning.

  Keep it up :)

  01

  Marked as helpful