All comments

• 

  Saad Rahman•120

  @TechGuySaadSubmitted over 1 year ago

  

  Interactive rating component using React, TailwindCSS and Redux

  1

  31
  

  Paulo Dandrea•80

  @Paulo-DandreaPosted over 1 year ago

  Very nice solution using Redux and Router. It was very clarifying for me. This challenge is very good train that.

  For the buttons on Rating.jsx, don't you think using a .map() would be cleaner? Less repeatable? Also, could be a good idea to componetize that. I think. What do you think?

  Anyway, I'm favoriting here to help me with Redux or Router if I would use later.

  Marked as helpful

  0

  This comment has received 2 repliesShow
• 

  France•100

  @LanXhanSubmitted over 1 year ago

  

  Responsive 3 column component

  2

  20
  

  Paulo Dandrea•80

  @Paulo-DandreaPosted over 1 year ago

  Congratulations for the solution.

  I've noticed that you're using the indentation to nest things, right? They do not use this way in the industry.

  • You could use commentary to separate the concerns (there's a VSCODE extension called 'Comment Headers').
  • You could use Prettier(another extension) to indent and standardize your css.
  • Try learning SASS for your nesting intention :D
  • What do you think of using box-sizing:border-box for your reset as well? It is a more intuitive way to layout things.

  *,
  *::before,
  *::after {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  }
  

  0
• 

  Ramon Leopoldo•40

  @RamonlleopoldoSubmitted over 1 year ago

  Bom desafio para iniciantes, bem rápido de fazer.

  

  QR code desafio Front-end mentor

  3

  40
  

  Paulo Dandrea•80

  @Paulo-DandreaPosted over 1 year ago

  Parabéns pela solução!

  Vi que acabou não colocando as cores das fontes. Por que não aproveita e cria variáveis com as cores e aí pode usar onde quiser.

  Exemplo:

  :root {
  /* Color variables  */
  --color-dark-blue: hsl(218, 44%, 22%);
  
  /* Font variables  */
  --font-primary: "Outfit", sans-serif;
  }
  
  h1 {
  color: var(--color-dark-blue)
  } 
  

  Tente organizar seu CSS em que os seletores fiquem ordenados por tipo ou especificidade, por exemplo:

  body {} h1,h2, etc{} .display{}

  0