Aproveitei para fazer uso das pseudoclasses no botão quando ele estiver desativado e gostaria de compartilhar no intuito de mais aprendizado e de trocar conhecimento. Podemos usar assim dentro do estilos.css:
#button-restart-the-game:disabled {
background-color: white;
color: lightgray;
}Ou assim:
#button-restart-the-game[disabled] {
background-color: white;
color: lightgray;
}Pseudoclasses são usadas em CSS para aplicar estilos a elementos com base em seu estado ou características. Nesse caso, o atributo disabled é usado como uma pseudoclasse para aplicar um estilo específico ao botão quando ele é desativado.
PS: Para que disabled continue funcionando, quando for configurar a classe do botão por meio do 'materializecss', troque a tag < a > pela tag < button >, isso não vai interferir nas configurações do materialize e você não perde a funcionalidade do disabled. Dessa forma:
<button id="button-restart-the-game" class="btn-floating btn-large waves-effect waves-light blue"><i class="material-icons">restore</i></button>Se você fez algo diferente ou tem alguma outra sugestão a agregar, será muito bem recebida. :)
