Este repositório é destinado ao projeto que desenvolvi com base nas aulas do "Curso de CSS Grid: simplificando layouts", da Alura, focado em CSS.
O conteúdo deste curso é voltado exclusivamente para o desenvolvimento da página web Alura Store com layouts e templates complexos, sendo implementada através do CSS Grid Layout.
Além disso, o foco do curso está no desenvolvimento com responsividade.
Objetivos principais:
- Simplificar a criação de layouts complexos;
- Posicionar elementos com mais facilidade;
- Utilizar grid para calcular e alinhar elementos;
- Criar templates com mais eficiência e simplicidade;
- Indicar aos elementos onde eles devem se posicionar;
- Indicar aos elementos onde eles devem começar e terminar.
Neste curso, as seguintes abordagens tiveram foco:
- Definição de templates com
grid-template-areas; - Posicionamento dos elementos em suas áreas;
- Definição de colunas com
grid-template-columns; - Definição de linhas com
grid-template-rows; - Definição de template sem áreas;
- Posicionamento dos elementos com
grid-column-start,grid-column-end,grid-row-startegrid-row-end; - Shorthand
grid-columnegrid-row; - Metodologia BEM;
- Definição de espaçamento entre linhas e colunas;
- Cálculo de espaçamento com
calc(); e - Responsividade (
media queries).
Página web implementada:
Página responsiva/mobile:
Concluído.