Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found

Submitted

Rock-paper-scissors game with html, css and vanilla js

CarissaAyo 315

@carissaayo

Desktop design screenshot for the Rock, Paper, Scissors game coding challenge

This is a solution for...

  • HTML
  • CSS
  • JS
4advanced
View challenge

Design comparison


SolutionDesign

Solution retrospective


Hey guys, I just completed this project. I will be glad if you guys can spare a minute to check it and give feedback about it. Thanks

Community feedback

Hachy 170

@nikokrainer

Posted

Hi @carissaayo I found some small bugs that are fixable in the code and that would be:

  1. javascript: the counter doesn't update when you lose, also look at some animation js libraries it would make your project look spicy.
  2. css: try to position all elements exactly in the middle with the parent element, or put it on the body, so everything is in center. Use transform: translate(x, y) on the "rock, paper, scissors" images so they are position in the middle of each circle. Use background image on the parent element of the circles, so you could make the triangle visible. In the root folder create a variable for font and then use it on the body so the whole project has the right font.

All in all good job on the project! -Keep coding

Marked as helpful

0

CarissaAyo 315

@carissaayo

Posted

@nikokrainer Thanks for the feedback, I intentionally didn't set the counter to update when the user loses, it isn't a bug. About the rest, I work on them. Thanks for the feedback once again, I really appreciate it

0

Please log in to post a comment

Log in with GitHub
Discord logo

Join our Discord community

Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!

Join our Discord