Skip to content

Latest commit

 

History

History
executable file
·
75 lines (38 loc) · 2.8 KB

File metadata and controls

executable file
·
75 lines (38 loc) · 2.8 KB

Frontend To-do

PDF do template: Tarefas.pdf

Link no figma: Figma

Arquivos de imagens: template.zip

Estilização

  • Cor primária: #6033DF

  • Fonte: Poppins

Home

  • O conteúdo central do template tem 980px de largura e é centralizado no meio.

  • Criar header com nome do projeto (Tarefas), e link para página de login.

  • O header tem 100px de altura

  • Adicione ilustração com mais ou menos 430px de largura.

  • Adicione o título e subtítulo.

  • Adicione o botão começar agora e os valores abaixo do botão, fictícios.

  • Adicione o painel com a cor primária, que tem 350px de altura e ocupa toda a tela.

  • Adicione as duas nuvens flutuando do lado esquerdo.

  • Adicione os itens fictícios.

  • Adicione o box "nosso time" também com dados fictícios.

  • Adicione o box "depoimentos do time" também com dados fictícios.

  • O usuário poderá navegar clicando nas bolinhas.

  • Criar rodapé. O link do github por enquanto será o link para o site github.

Login e Cadastro

  • Ambas as páginas devem ser criadas com o form com método POST, e o action sendo o mesmo arquivo.

  • O login deverá possuir dois inputs, um de email com o name "email" e outro password com o name "password".

  • O cadastro deverá possuir um input type "text" com o name "name", outro com o type "email" com o name "email", e outro type "password" com o name "password".

  • Logo acima do primeiro input, em ambas as páginas, coloque um box de alerta, para que os erros do backend sejam exibidos. Por exemplo: "Conta não existe!".

  • Ambas possui um link para a outra: 

  • Não possui uma conta: direcionada para o cadastro

  • Já possui uma conta: direciona para o login

Dashboard

  • Criar o header como o da home

  • Adicione a imagem e um nome de exemplo.

  • O "Fazer logout" precisa ser um link com o seguinte href: "#"

  • O conteúdo deve ter 400px, estar centralizado horizontalmente e ter 50px de margem do topo.

  • O input deve ser um form com method POST, e action para a mesma página.

  • O input deve ter o name "new_item".

  • Quando o usuário clicar em um item da lista, seja no checkbox ou no texto, o checkbox deve mudar o status de checked. O texto deverá alterar o CSS "text-decoration: line-through;" para ficar com o riscado no texto quando o checkbox estiver marcado.