Desenvolver a página de cadastro de trials da Voxus, a interface deve ser responsiva e com todas as mecânicas de interações ativas.
- Os inputs texts devem, ao entrar em focus, subir uma label como identificação para o usuário de qual informação aquele campo se refere.
- O dropdown "Verba mensal em mídia" deve conter exatamente os mesmos valores fornecidos.
- Ao sinal de erro, seja pela falta do dados obrigatórios (que são todos os campos) ou pelo dado incorreto com o campo, deve-se criar uma label inferior informando o motivo daquele campo estar inválido.
- Aplicar hover ao botão "experimentar gratuitamente" e, com todas as condições corretas, aplicar a transição fade out-in entre "experimentar gratuitamente" (CTA) para um "Obrigado!" e o mesmo botão se torna inativo além de um label em fade in para baixo informando sobre o contato do nosso time comercial.
- Adicione o texto sobre termos e requisitos.
Todos os assets e design das interações tanto mobile, quanto desktop, estão contidas no link Figma: Layout
- Execução fiel ao design, incluindo todos detalhes
- HTML5 escrito da maneira mais semântica possível
- Garantir a viabilidade técnica do UI/UX
- Realizar a engenharia de design de interação dos elementos na UI
- Layout responsivo compatível com dispositivos móveis
- Alguma metodologia para definição e organização do código CSS
- Proporcionar uma experiência com alto desempenho, segurança e capacidade de resposta
yarn or npm install
yarn serve or npm run serve
yarn build or npm run build
The website can be visited here: Voxus Challenge