Ações (Ideias sobre o projeto) 1: Colocar no item animação, ou seja, a imagem do cantor ficará exporta até o momento do mouse ir nele e as informações (título, descrição e abrir) aparecerá. Ocorrer somente quando o mouse ficar em cima da imagem do cantor.
2: Colocar na página onde fica o vídeo, ícones das plataformas de música. (Colocar no lugar da informação de diretores e produtores).
REQUISITOS GERAIS:
- Todo o site deve estar responsivo.
- Opcionalmente, o site pode ser feito com Bootstrap.
- O site deve ter hover e transições.
- O site deve ter rolagem suave (scroll behavior - smooth).
- O title deve variar de acordo com a página atual. Ex: Em um cenário hipotético de filmes, na página do filme peter pan ficaria: DH Flix | Peter Pan.
- Todas as páginas devem ter o mesmo header e footer.
HEADER:
- Header deve conter 4 itens além da logo (Home, itens, login e sobre nós). Cada item deve linkar com uma parte do site ou uma página externa.
- O header deverá sempre estar no topo da página.
BANNER:
- A home deverá ter um banner e este deve ter o efeito parallax, (pesquise por background-attachment).
- O banner tem de ter um botão e uma breve descrição do site.
- O banner vai ocupar toda área da viewport (VH) do usuário.
LISTAGEM DE ITENS:
- A home terá uma listagem de itens.
- O link do header para os itens, devem levar para essa seção da página.
- A listagem dos itens deve ter uma animação como por exemplo um scale no hover, mas se quiser fazer outro efeito.
- Mínimo de itens para listagem é 6.
- Os itens devem ter: título, foto, descrição e um botão que leva para a página de detalhe deste item.
FOOTER
- No footer deve haver informações sobre a equipe e sobre contato. Bem como ano de desenvolvimento do trabalho.
PÁGINA DE DETALHE:
- Seu site tem de ter uma página de detalhes para cada item listado onde haverá uma explicação sobre o mesmo. No exemplo dos filmes, a página de um filme teria sua sinopse, link para o trailer e ficha técnica.
PÁGINA OU MODAL DE LOGIN:
- Formulário de login deverá ter uma logo, um campo de user e um campo de senha e um botão de submit.
Figma: https://www.figma.com/file/hSgsjjoM7Mc88WVtQ5i9QV/Checkpoint-3?node-id=0%3A1