Na aula 05.02 Estado disabled observei que apesar de ter feito tudo conforme o professor fez no vídeo, o botão não mudava de aspecto (não ficava cinza) ao ser desabilitado. O comportamento de disabled funciona perfeitamente. O atributo disabled também está lá no HTML. Porém devido às cores colocadas no CSS para o componente o disabled não aplicava o estilo padrão de desabilitar o botão (colocar o botão cinza). Removendo as cores do .button (border e color) funcionou o comportamento padrão do browser de mudar o aspecto visual do botão para demonstrar que está desabilitado.
1
resposta
resposta
Botão desabilitado não fica cinza
Olá, Daniel!
Obrigada por compartilhar a solução que encontrou e colaborar aqui no fórum! :)
Parece que nesse caso, as cores personalizadas definidas no CSS estavam sobrescrevendo o estilo padrão do botão desabilitado. Isso pode acontecer, porque os estilos que você define no CSS têm prioridade sobre os estilos padrão do navegador.
Você também pode definir um estilo específico para o botão quando ele está desabilitado. No CSS, você pode fazer isso usando o seletor :disabled. Aqui está um exemplo:
.button:disabled {
background-color: cinza;
border-color: cinza;
}
Neste exemplo, quando o botão estiver desabilitado, o fundo e a borda do botão ficarão cinzas. Você pode alterar as cores conforme achar melhor.
Esta é apenas uma sugestão e pode não funcionar perfeitamente dependendo do restante do seu código. Mas é um bom ponto de partida.
Abraços e bons estudos!