docs: define requisitos do header

This commit is contained in:
marlon passos 2023-03-29 15:53:05 -03:00
parent f6e83f5b83
commit bee9fe1d05
2 changed files with 76 additions and 1 deletions

View File

@ -40,3 +40,5 @@ Após a finalização do projeto, o mesmo deverá ser enviado para uma plataform
Parte do desafio será corrigido por meio de testes automatizados. É importante que o projeto passe pelos testes para garantir o seu funcionamento correto.
# Critérios de avaliação
[veja os requisitos do desafio nesse documento](REQUISITOS.md)

73
REQUISITOS.md Normal file
View File

@ -0,0 +1,73 @@
# 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"