desafio-pontos-turisticos/REQUISITOS.md

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
  • 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
  • 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"