Change grid layout ordering

geerlingguy / beast-challenge

A control system for MrBeast's 1-100 challenge

GNU General Public License v3.0

26 stars 1 forks source link

Change grid layout ordering #25

Closed geerlingguy closed 1 year ago

geerlingguy commented 1 year ago

@theNetworkChuck left a message with the following graphic in Slack:

telegram-cloud-photo-size-1-4915711777216506671-y

The idea being the layout would go in columns downward, starting with 1 at the top left, going down to 10, then to number 2 in the 2nd column, and so on.

Right now I'm laying out the grid using flex, with a 10x10 grid going left to right horizontally. Can flex do vertical?

geerlingguy commented 1 year ago

ha! Just set a max-height and use flex-column in bootstrap, and boom:

geerlingguy commented 1 year ago

PR is here: https://github.com/geerlingguy/beast-game/pull/26

geerlingguy commented 1 year ago

So the final layout (for now at least, lol): 1 is bottom left corner, counts up (vertically) to 10

geerlingguy commented 1 year ago

Fixing this in a separate commit...