Move CSS over to grid - Githubissues

Mclilzee / zap-simulator

Zap Matrix Simulator

https://mclilzee.github.io/zap-simulator/

Other

4 stars 16 forks source link

Move CSS over to grid #11

Closed DigitalKnight0 closed 2 years ago

DigitalKnight0 commented 2 years ago

Because: The table currently currently is hard to style and make responsive resulting in a bloated css. Grid would be much more suitable here. Also, grid alone can scale down nicely own it's own so we probably don't need those media queries

Tasks:

[ ] Move the markup to grid
[ ] Move CSS to grid
[ ] Add a suitable query to change the view on phone
[ ] Refactor the buttons setup a bit to work with the new feature

Mclilzee commented 2 years ago

I got an idea, what if we discontinue the grid. and make it into 5 sections of Zap tier's each section have the offenses to the left of them each a zap corresponding color with a progress bar to the right with the same color filling up. in the middle of the Bar we can type the number of zap points they gonna recieve. what you think?

DigitalKnight0 commented 2 years ago

@Mclilzee Not sure i fully grasp the idea? Do you have a drawing of some sort to depict it? Btw here's our progress so far

Mclilzee commented 2 years ago

Yeah forget about it, your new update is great i'm loving it. I'll work on responsive fonts and padding later on.