Shurkodr / layout_snake

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Boilerplate for layout tasks

Display six colored blocks on the screen without any extra margins:

  • Each block should be 300px high.
  • Block 1 must be red, block 2 must be 4 fifths red and 1 fifth black, block 3 must be 3 fifths red and 2 fifths black, block 4 must be 2 fifths red and 3 fifths black, block 5 must be 1 fifth red and 4 fifths black, block 6 must be black.
  • Each block should have its number (1 to 6) placed in its center in white Arial 100px font.
  • Blocks must be put in 2 to 6 rows and stretched: each row must fit either 1, 2, or 3 blocks so that the width of each block is not less than its height (300px).
  • The first row is to be read from left ro right, the second row from right to left, the third row again from left to right (this way we have a zigzag, or a snake).

For better clarity, please refer to the reference screenshots at 300, 450, 600, 750, 900, 1050, and 1200 pixel-wide screen.


Read the guideline before start

Guideline

Result

About

License:GNU General Public License v3.0


Languages

Language:JavaScript 63.7%Language:HTML 22.5%Language:Shell 13.8%