Objetivo: criar um landing page, com link a partir do header, na qual explicamos um pouco do serviço como parceiro Zé e solicitamos informações para que o Usuário possa se mostrar como interessado em fazer entregas via Zé Delivery
Tarefa 1: Refazer header do site
Adicionar ao header existente (em anexo) o novo menu “seja um parceiro”. Alterar o layout dos menus existem para que a imagem fique acima do nome. Na versão mobile os menus somem do header e vão para um menu lateral estilo app mobile.
[
https://share.sketch.cloud/elpq/p/z-delivery/desktop]
Tarefa 2: Landing page de informações
Página com informações sobre como o Zé opera. O layout do desktop deve seguir a imagem [
https://share.sketch.cloud/elpq/p/z-delivery/pdv-sign-up-desktop-hd] e o layout do mobile deve seguir a imagem [
https://share.sketch.cloud/elpq/p/z-delivery/pdv-sign-up-mobile]. Os textos são exatamente os mesmos das imagens e devem ser inseridos no HTML de forma estática.
Depois dos textos há dois checks que devem iniciar desmarcados. Ao final há um botão que irá levar ao formulário. O botão deve iniciar desabilitado, assim que o usuário marcar os dois checks o botão é habilitado com o fundo igual a imagem.
O botão deve ter um hover que inverte as cores do texto e do botão.
Tarefa 3: Formulário de cadastro
Página formado por um formulário onde o PDV vai se cadastrar como interessado. O layout do desktop está na imagem [
https://share.sketch.cloud/elpq/p/z-delivery/pdf-sign-up-form-desktop-hd] e o do mobile na imagem [
https://share.sketch.cloud/elpq/p/z-delivery/pdf-sign-up-form-mobile].
Pontos importantes:
- Todos os campos até a pergunta “Já trabalha com entregas” são obrigatórios com exceção do complemento.
- Se o usuário selecionar “SIM” na pergunta “Já trabalha com entregas”, todos os campos abaixo são obrigatórios, caso contrário nenhum deles deve ser preenchido.
- Os campos preenchidos devem ficar iguais ao campo nome na imagem, com o fundo preto e o texto branco.
- Os campos com erro devem ter borda e fundo vermelhos e o texto de erro logo abaixo também em vermelho.
Validação dos campos:
- Nome: texto mínimo 10 caracteres
- CEP: validação de formato com mascara
- Cidade: texto
- Estado: texto
- Endereço: texto
- Número: apenas números
- Horários: apenas números com mascara (99:99)
Prazo de Entrega: 13 de Agosto de 2016