Interactive Rating Component with React, TypeScript, Vite and SCSS

Community feedback

• 

  Hassan El Jebyly•490

  @hassaneljebylyPosted about 1 year ago

  Congrats on finishing this, looks neat and solid, just one suggestion put display: grid; place-items: center; on the <button> tag with the star icon (why not a div tho ? a button tag that's not used as a button will just confuse screen readers), plus you may want to add cursor: pointer on rating buttons, other than that it all looks great.

  Marked as helpful

  1

  ---

  

  P

  Jeremy Helsel•670

  @JIH7Posted about 1 year ago

  @hassaneljebyly

  Thank you! I'll incorporate that. I have it as a button because it appeared to be one in the design. I figured that this being a just a small component, the star was there to serve some function in part of a larger app. Although I have noticed that most solutions don't make it one so you're probably right on that one.

  Edit: Thanks again for the feedback! I reworked the button into a div like you suggested. Instead of using a grid and centering the image that way though, I just gave it margin: auto and that seemed to do the trick.

  1

  

  Hassan El Jebyly•490

  @hassaneljebylyPosted about 1 year ago

  @JIH7 never thought about it that way tbh, It makes perfect sense, you could say It's the button that opened the rating component :)

  0