Solucionado
Galera, estava tendo dificuldades em alterar a classe "botao-lilas" do CSS. Eu mudava a cor no "styles.css" e a cor não alterava de jeito nenhum. o que você pode fazer é ir no arquivo CSS e utilizar o "!important". Segue abaixo o código:
botao-lilas {
background-color: #9353FF !important;
color: white;
}
Não sei se seria a maneira mais eficiente, inclusive gostaria de saber a opinião dos instrutores, mas realizando desta forma funcionou! Obrigado.
Oi Pedro! Tudo bem?
A utilização do !important é uma maneira de garantir que o estilo que você deseja aplicar tenha prioridade sobre outros estilos que possam estar interferindo. No entanto, é sempre bom usá-lo com cautela, pois pode dificultar a manutenção do código no futuro. Mas no seu caso, foi uma boa alternativa sim.
Uma alternativa ao uso do !important é verificar se há alguma outra regra CSS com especificidade maior que a sua, que possa estar sobrepondo o estilo que você está tentando aplicar. A especificidade é determinada pela quantidade de seletores e o tipo de seletores que você usa. Por exemplo, se você tem algo como:
.button-container .botao-lilas {
background-color: #9353FF;
color: white;
}
Isso pode ter mais prioridade do que apenas .botao-lilas.
Outra dica é verificar se o arquivo styles.css está sendo carregado corretamente e se não há outros arquivos CSS que possam estar sobrepondo suas regras. Você também pode usar as ferramentas de desenvolvedor do navegador (como o "Inspecionar" do Chrome) para ver quais estilos estão sendo aplicados e de onde vêm.
Muito obrigada por compartilhar sua sugestão com o fórum, ela pode ajudar muitos outros estudantes!
Conte com o apoio da comunidade Alura na sua jornada. Abraços e bons estudos!