Este é meu repositório para o curso CSS: Dispondo Elementos com Flexbox e Grid da Alura
Toda a estilização usada no projeto está dentro do figma.
Open Sans:
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Open+Sans:wght@400;600;700&display=swap">
corpo: #1D232A
cabeçalho: #1D232A
cabeçalho mobile: #15191C
menu lateral: #15191C
cartão: #2C343A
fonte: #FFFFFF
fonte alternativa: #95999C
links: #0480DC
botão: #0480DC
sombras: 0px 4px 4px rgba(0, 0, 0, 0.16)
Estão dentro do arquivo de fonte icones.ttf
. Para usar, primeiro importe a fonte no projeto usando @font-face
e depois utilize os códigos abaixo para exibir o ícone.
@font-face {
font-family: 'icones';
src: url(../font/icones.ttf);
}
Cuidado com a localização do arquivo
icones.ttf
Camisas = \e900
Carrinho = \e901
Inicio = \e902
Integrantes = \e903
Menu = \e904
Moeda = \e905
Notificação = \e906
Pico = \e908
Picos = \e909
Pinturas = \e90a
Play = \e90b
Relogio = \e90c
Seta-baixo = \e90d
Videos = \e90e
Visualizacao = \e90f
Espaço interno botão: 8px
Espaço entre elementos do botão: 8px
Espaço entre elementos: 16px/8px
Espaçamento interno do corpo: 16px
Espaçamento entre o título do cartão de recentes e seus itens: 24px
Tamanho do dispositivo mobile: 360px
Tamanho do dispositivo desktop: 1440px
Largura máxima do conteúdo principal: 1120px
Largura máxima de um cartão desktop: 256px
Altura mínima de um cartão: 320px
- HTML / CSS
Rafael Cecyn Mendes