Today...
I finished redoing my layout. First, I commented out my original HTML code up to the grid-container class so I could experiment with using CSS grid. I created some temporary divs to make a 3x3 again to test the grid layout
Once I got the grid set up how I wanted it, I uncommented and removed the parent elements I used to group my original classes. Now I have 9 block level classes which equated to my 3x3 grid container instead of redundant groupings.
When I was messing with the mobile view, I got frustrated because grid container not responding to its parent flex container sizing. I wasn't able to figure it out and plan to revisit it at a later time.
Next, I used images for my rock, paper, and scissors buttons I got for free from Pixabay. I added the Orbitron font from Google Fonts to my file and used it to style my text.
I am almost done with the UI. I just need to do a few more style edits and also have the game use the images when a selection is made.
Resources
The Odin Project
Revisiting Rock Paper Scissors
https://pixabay.com/images/search/rock-paper-scissors/
Top comments (0)