interactive-rating-component - React App with SCSS styles

Community feedback

• 

  rkrawczyszyn•10

  @rkrawczyszynPosted about 1 year ago

  Hi Philip!

  Thank you for your time and feedback! I love your tip with the body css and I applied it :)

  I think giving the container more max-width is a bad idea. The component looks to wide to my liking and also - fits less to the expected design in the challange.

  And yeah, I could program it to make 1st step to disappear and show only the "thank you" component, but I think it's better to keep them next to each other. Well, it's not an app, it's just a coding challange :)

  Cheers from Poland!

  1
• 

  Philip Droubi•575

  @Philip-DroubiPosted about 1 year ago

  Congratulation on completing this challenge! 🎉

  This is a small tip you can do to improve your solution.

  • For the page body just add this:

      min-height: 100vh;
      display: flex;
      align-items: center;
      justify-content: center;
  

  Doing This will center the rating component for all screens.

  -In background div remove the margin cause now we don't need it:

  .background {
      /* margin-left: 50px; */
      /* margin-top: 50px; */
  }
  

  • Give the .container some more max-width, let's say 380px or 400px would be great.

  • Finally, using js remove the old component when moving to the second screen by setting the display to none, or removing the element by .remove() js function and replace it with new one or by changing the inner-html ...etc, In fact, you have many ways to do this.

  Hope you find this helpful😀

  0