/layout_catalog_grid

Primary LanguageHTMLGNU General Public License v3.0GPL-3.0

Frontend practice with catalog page using grid

Replace <your_account> with your Github username and copy the links to Pull Request description:

Follow this instructions

The task

Implement layout using grid layout

  • Replace flex with grid
  • Media queries
    • There should be four columns starting at 1024px
    • There should be three columns starting at 768px
    • There should be two columns starting at 488px
  • Gap between cards should be 48px
  • Do not modify header
  • Blocks should start from the left

Requirements:

  • write styles in src/styles/main.scss
  • use SCSS in this task
  • pay attention to the responsive
  • card's width is 200px including borders

Common mistakes

  • IMPORTANT Save and push your changes to GitHub manually after deploy
  • Do not use tabs. Use 2 spaces for indentation.
  • Don't use repeated styles.