M3-Academy-Public/desafio-pontos-turisticos
2
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity
b1b98049ad
desafio-pontos-turisticos/REQUISITOS.md

2.6 KiB
Raw Blame History

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

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"