Empire Burger
Esse projeto é uma landing page de uma hamburgueria fictícia chamada Empire Burger, nela há seções sobre as ofertas especiais, horário de funcionamento, cardápio contendo os ingredientes e preços, cards com os feedbacks dos clientes e a localização do estabelecimento. O seu desafio é construir este layout e deixá-lo o mais próximo possível do design.
Você pode usar qualquer ferramenta que deseja para ajudá-lo a completar o desafio, não será avaliado o código, mas sim a fidelidade ao layout e a implementação das funcionalidades solicitadas. Então, se você tem algo que gostaria de praticar, sinta-se à vontade para tentar.
Para deixar o desafio mais justo o layout e os critérios de aceite foram separados em três níveis de dificuldade(fácil, médio e difícil). Conforme a dificuldade aumente, você deverá considerar a implementação das dificuldades anteriores, ou seja, se optar pelo dificuldade média, deverá levar em conta todos os critérios da dificuldade fácil e caso prefira a dificuldade difícil, deverá levar em conta todos os critérios da dificuldade fácil e média.
Agora vamos para os critérios de aceite(funcionalidades):
Nível Fácil
- Criar as seguintes seções: Menu, Banner hero, Ofertas especiais, Onde fica o nosso castelo, Footer.
- Ao clicar em um item do menu, o usuário deverá ser levado para a seção correspondente. (material de apoio)
- Na seção Ofertas especiais os elementos devem ser organizados com o uso da propriedade display:grid do css. (material de apoio)
- As informações do card da oferta(nome do prato e gramagem) devem estar no html, a única imagem deve ser a foto do prato com o preço.
- Na seção Onde fica o nosso castelo você deverá incorporar uma localização do google maps.
Nível Médio
- Todos os requisitos do nivel fácil.
- Criar as seguintes seções: Cardápio, Atendimento, Nossas entregas.
- Na seção Cardápio os preços devem ser formatados com o método Intl.NumberFormat. (material de apoio)
- O card Horário de funcionamento deverá ter os estados aberto e fechado, o estado será alterado conforme o horário do navegador do usuário. (material de apoio)
Nível Difícil
- Todos os requisitos do nivel fácil e médio
- Criar as seguintes seções: Nossa realeza, Publicações do instagram.
- Buscar a lista de itens do cardápio via api. (acessar endpoint)
- Buscar a lista de depoimentos via api. (acessar endpoint)
- Na seção Nossa realeza os depoimentos deverão estar em um carrousel funcional.
- O texto de cada depoimento deverá estar limitado em quatro linhas, você pode usar a propriedade clamp do css. (material de apoio)
Foi criado um repositório template no github com os assets e um README de base, clique aqui para acessar.
