-
Criar o HTML/CSS responsivo com base no layout navegável.
-
Nós queremos avaliar o seu nível de conhecimento em design responsivo (Responsive Web Design) usando HTML5, CSS3 e grids. Caso queira, utilize pré-processadores (Less, Stylus ou SASS, esse último é o nosso favorito :D).
-
O grid do layout é baseado no Grid System do Bootstrap 4, mas não copie todo o bootstrap 4 para o projeto. Nós queremos ver você fazendo os breakpoints e as modificações dependendo do device <3.
-
Não tenha pressa! Iremos avaliar a qualidade do seu código, mesmo incompleto e principalmente a sua semântica.
- Desktop: https://invis.io/VHVMB5IYMB6#/401397052_Inicio
- Mobile: ( Dá um tapinha nos elementos, queremos ver como você se sai )
- OBS: as imagens ficam na pasta "assets".
Resultado final: http://10anos.mentores.com.br/
- Os arquivos como icones e imagem estão na pasta assets presente no repositório! ;)>.
- Hospede o CSS dentro da pasta "css".
- Não é necessário fazer o carrossel funcionar, mas se quiser mostrar seu conhecimento em JS, usa um SLICK que vai ser da hora.
- Caso não consiga usar o carrosel não tem problema, deixa a pagina com scroll =)).
- Não é necessário que a fonte seja exatamente a mesma usada na arte. ;)
- É permitido usar qualquer editor de código, ( Nos usamos o Visual Code ) e consultar a internet.
- Suporte de Browsers: IE11+, Chrome, Safari, Firefox.
- Grid: https://getbootstrap.com/docs/4.0/layout/grid/
- Mussum Ipsum (gerador de lorem ipsum do Mussum): http://mussumipsum.com/
Ao terminar o teste, solicite um pull request ou mande para o e-mail: [email protected].
Boa sorte!