Rock, Paper, Scissors, (Lizard, Spock) game with SCSS, Vanilla JS

Community feedback

• 

  Mojtaba Mosavi•3,760

  @MojtabaMosaviPosted over 2 years ago

  Hi Kaung!, Congrats on completing this, it's not a easy beast to sly. I think the the sound effects a positively supplemental to the interactivity, it's always fun and inspirational to see individuals mark up the interactivity (pun intended) and get creative.

  • Using ES6 module system you can easily split this into sperate chunks by functionality something like:

  game:
      modal.js
      rockPaperScissors.js
      rockPaperScissors-extended.js
      main.js 
  

  • The close icon in the modal has a simple hover state where the bg color is changed to red.

  • Upon tabbin the game button excute the styles of the hover state, it would be benefiery to visual user if the aslo had some kind of visual marker like a ouline:

  game-button{
  
      &:hover,&:focus{
          outline: 1px solid color;
          outline-offset: 0.25rem; 
  
  } 
  }
  

  • A note about you implentation of the mode, using a unordered list has accessibility implication such as a screen reader would take much longer time to read all the five list item reather tha a simple heading one therefore the mode is semantically better descriebed be a <h1>.

  • The pluse animation is key visual, suggetively it should be amplified.

  Keep coding :=)

  Marked as helpful

  1

  ---

  

  Kaung Zin Hein•720

  @K4UNGPosted over 2 years ago

  @MojtabaMosavi Hey Mojataba! Thanks a lot for you feedback. Happy to hear that you liked the sound effects. I didn't know about the module system as I'm relatively new to JS. Will definitely check it out. For the buttons, I actually removed the outlines intentionally but I'll increase the size to make it more noticeable. I'll also work on the ul of the mode. Thanks a lot and Happy Coding!

  0