Tarefas+ (HTML/CSS/JS puro)

Aplicativo To‑Do simples, porém completo, construído com HTML, CSS e JavaScript sem dependências externas.

• ✅ CRUD de tarefas (criar, editar, excluir, concluir)
• 🔎 Busca e filtros (categoria, status, prioridade)
• 🧭 Ordenação (criação, prazo, prioridade, título)
• 🌓 Tema claro/escuro (respeita prefers-color-scheme + persistência)
• 💾 Persistência local (LocalStorage)
• 🔄 Exportar/Importar em JSON
• ♿ Acessibilidade (semântica, foco visível, aria-live)
• ⌨️ Atalhos de teclado

Como executar

Basta abrir index.html no navegador. Não há dependências.

Estrutura

todo-plus/
  index.html
  assets/
    css/ (reset, variables, main, components)
    js/  (app, storage, state, dom, utils, keyboard)
    img/icons/
  README.md
  LICENSE

Atalhos de teclado

• t Alternar tema
• ? ou / Abrir ajuda
• / ou Ctrl + K Focar busca
• Ctrl + Enter Adicionar tarefa
• Alt + E Exportar JSON
• Alt + I Importar JSON

Guia de Testes Manuais

1) Fluxo básico

1. Adicione uma tarefa com título e opcionalmente categoria/prioridade/prazo.
2. Marque como concluída e verifique a atualização dos contadores.
3. Edite uma tarefa (título, categoria, prioridade, prazo) e confirme a atualização.
4. Exclua uma tarefa e verifique se saiu da lista e dos contadores.

2) Busca, filtros e ordenação

1. Digite um termo em Buscar e verifique o filtro em tempo real.
2. Aplique Categoria/Status/Prioridade e observe a lista.
3. Altere Ordenar por para Prazo, depois Prioridade, depois Título e confirme a ordenação.

3) Tema e acessibilidade

1. Use t para alternar tema e recarregue a página: a preferência deve persistir.
2. Navegue via teclado (Tab/Shift+Tab) e confirme o foco visível.
3. Verifique que a lista anuncia mudanças (atributo aria-live).

4) Persistência, exportação e importação

1. Recarregue a página e confirme que as tarefas persistem (LocalStorage).
2. Clique em Exportar (Alt+E) e baixe o JSON.
3. Edite o JSON e execute Importar (Alt+I). Teste Substituir e Mesclar.

5) Casos de borda

• Tentar adicionar sem título → deve bloquear com aviso.
• Prazo vazio é aceito e exibido como Sem prazo.
• Importar arquivo inválido → deve exibir erro.

Personalização

• Paleta de cores baseada na identidade da Villares (#045494, #d6e2ed, #4a83b6, #387db4, #7caccc).
• Ajuste variáveis em assets/css/variables.css.

Licença

MIT — veja LICENSE.