Esse projeto é uma landing page da empresa Blizzard, ela é composta por um menu de navegação, um banner hero com as informações dos principais jogos da empresa(Diablo, HearthStone e World of Warcraft), a listagem dos jogos exclusivos e um rodapé com informações do download do app battle.net.
Para facilitar a codificação do projeto foi usado um protótipo do figma como base, o autor do layout é o design Gilberto Prado, clique aqui para saber mais detalhes do desafio.
- NextJs
- TypeScript
- Tailwind
-
Criar as seções: Menu, Banner hero, Footer.
-
O texto e o ícone do botão “Baixar jogo” devem ser alterados conforme o sistema operacional do usuário que estiver acessando a página. ( material de apoio)
-
Aplicar efeito de hover nas opções do menu de navegação.
-
Aplicar responsividade para as seguintes resoluções: 1920px, 1440px, 768px e 375px.
-
Todos os requisitos do nivel fácil.
-
Criar as seções: Menu, Banner hero, Jogos Exclusivo, Footer.
-
Buscar a lista de jogos via api. (acessar endpoint)
-
Aplicar efeito de hover nas imagens dos jogos da seção Jogos Exclusivos.
-
Alterar as informações da seção Banner Hero ao selecionar uma opção no menu lateral. Os jogos disponíveis são Diablo, HearthStone e World of Warcraft.
-
Todos os requisitos do nivel fácil e médio.
-
Ao clicar no botão Logar do menu de navegação, deverá ser exibido o modal de login.
-
Criar componente de dropdown para as opções Jogos e Esportes do menu de navegação.
-
Deverá ser executado um gif do jogo quando ocorrer o evento de hover na capa do trailer
##
Blizzard-Web.mp4
##