Release note - v1.5.0

Nesta versão, foi introduzido um novo recurso: o Modal de Alerta. Esse modal visa melhorar a interação do usuário, fornecendo mensagens de alerta visuais com uma interface atraente e funcional.

Novidades

• Modal de Alerta:
  • Estrutura e Design: Adicionado um modal estilizado com uma caixa de alerta centralizada. A caixa é visualmente atraente, com bordas arredondadas e uma sombra sutil para destacar o alerta.
  • Transições e Animações: Implementada uma animação suave para a exibição do modal, aumentando a opacidade de 0 a 1, para uma transição mais fluida e agradável.
  • Barra de Progresso: Incluída uma barra de progresso na parte inferior do modal para indicar visualmente o tempo restante ou o progresso do alerta.

Alterações Detalhadas

CSS (assets/css/index.css):

• Modal:

  • Adicionados estilos para o modal, incluindo background-color, padding, border-radius, width, text-align, e box-shadow.
  • Implementada a classe .modal com propriedades de opacidade e transição para animação suave.

• Barra de Progresso:

  • Criada uma progress-bar com altura definida e cor de fundo. Incluída uma progress interna para indicar o progresso.

• Outras Alterações:

  • Atualizado o design geral da página de login, incluindo alterações nas cores e espaçamentos para harmonizar com o novo modal.

HTML (index.html):

• Estrutura do Modal:
  • Adicionado um novo bloco div com a classe modal para a estrutura do modal de alerta.
  • Inserido um elemento p com a id alert-message para exibir o texto do alerta.
• Scripts Adicionais:
  • Incluído um novo script alert.js para gerenciar a lógica de exibição e controle do modal.

JavaScript (assets/js/alert.js):

• Controle do Modal:
  • Implementada a lógica para mostrar e esconder o modal com base em eventos ou condições específicas.
  • Gerenciado o comportamento da barra de progresso para refletir o tempo ou progresso do alerta.

Notas de Implementação

• Testes: Recomenda-se testar o modal em diferentes navegadores e dispositivos para garantir que a animação e a exibição funcionem conforme o esperado.
• Customização: A barra de progresso e o estilo do modal são facilmente personalizáveis através do arquivo CSS. Ajuste as propriedades conforme necessário para se adequar à sua marca ou necessidades específicas.

Observações

• Esta versão pode incluir algumas alterações no layout e no estilo que podem impactar a aparência geral da página de login. Certifique-se de revisar e ajustar conforme necessário para manter a consistência visual com o restante do aplicativo.