Grid

Os grids são usados para orientar a construção da página através de uma série de linhas e colunas que organizam seu conteúdo. O uso consistente de um sistema de grids fornece a base para uma página harmônica com elementos bem posicionados na tela. O Lemonade usa um sistema de 12 colunas, variando o gutter e o tamanho das colunas de acordo com a resolução da página.

Menu lateral

Quando a página tiver um menu lateral fixo, ele será posicionada fora dos limites do grid, incluindo as margens. O conteúdo principal é movido de lado para fornecer espaço para o menu lateral e o grid e a área de conteúdo são condensadas.

Breakpoints

O número de colunas é independente do tamanho da página, e é sempre 12.

Boas práticas:

• Use múltiplos de 8px ao definir tamanhos, espaçamento e posições do elemento;
• Sempre que possível, alinhe os elementos na vertical e na horizontal;
• Use um bom espaçamento entre os blocos de conteúdo da página. Isso cria um agrupamento visual entre itens semelhantes e facilita a navegação.