2.7 KiB
2.7 KiB
Requisitos do projetos
Aqui estão os requisitos que serão avaliados:
Header
- Replicar os estilos do layout no Figma em cada breakpoint
-
[ ] ultra wide
-
[ ] desktop
-
[ ] tablet
-
[ ] mobile
- deve manter a responsividade entre os breakpoints
Header - Logo
- Replicar o tamanho para cada breakpoint
-
[ ] ultra wide
-
[ ] desktop
-
[ ] tablet
-
[ ] mobile
- deve conter textos alternativos para a logo
- deve conter um link para a home ("/")
- algum efeito de hover ao passar o mouse sobre a logo
Header - Search Bar
- Replicar os estilos do layout no Figma em cada breakpoint
-
[ ] ultra wide
-
[ ] desktop
-
[ ] tablet
-
[ ] mobile
- a estilização deve ser feita no tag input (textos, cores, espaçamentos)
- texto de placeholder deve ser o mesmo do layout
- deve manter a responsividade entre os breakpoints
- ao passar o mouse sobre o ícone de busca, deve haver um efeito.
- devo conseguir fazer a submissão do formulário clicando no o botão de busca ou com o apertando da tecla enter
- ao fazer a busca o usuário deve ser redirecionado para a página com o resultado da busca
- nao precisa implementar a pagina de resultado, apenas o redirecionar com a url correta
- para o termo "iphone" deve redirecianar para a url
/search?q=iphone
- para o termo "iphone vermelho" deve redirecianar para a url
/search?q=iphone%20vermelho
- esse padrão de url deve ser seguido para todos os termos de busca
- esse padrão e' conhecido como query string
Header - Login
- Replicar os estilos do layout no Figma em cada breakpoint
-
[ ] ultra wide
-
[ ] desktop
-
[ ] tablet
-
[ ] mobile
- deve manter a responsividade entre os breakpoints
- deve conter um link para a página de login (
"/login"
) - dever ter um efeito de hover ao passar o mouse sobre o link
Header - Cart
- Replicar os estilos do layout no Figma em cada breakpoint
-
[ ] ultra wide
-
[ ] desktop
-
[ ] tablet
-
[ ] mobile
- deve manter a responsividade entre os breakpoints
- ao clicar no botão de carrinho, deve redirecionar para a página de carrinho (
"/cart"
) - dever ter um efeito de hover ao passar o mouse sobre o botão
Header - menuBottom
- Replicar os estilos do layout no Figma em cada breakpoint
-
[ ] ultra wide
-
[ ] desktop
-
[ ] tablet
-
[ ] mobile
- deve manter a responsividade entre os breakpoints
- Os links devem conter efeitos de hover
- A url para os textos deve ser:
- "Cursos" -> "/Cursos"
- "Saiba mais" -> "/saiba-mais"
- "Institucional" -> "/institucional"