Cards
box-shadow: 0 0.25rem 0.75rem rgba(0, 0, 0, 0.2);
}
box-shadow: 0 0.25rem 0.75rem rgba(0, 0, 0, 0.2);
}
header
box-shadow: 0 0 0.625rem rgba(0, 0, 0, 0.2);
botões
box-shadow:0 0.25rem 0.375rem rgba(0, 0, 0, 0.1);
modais
box-shadow: 0 0.25rem 0.375rem rgba(0, 0, 0, 0.1);
Ei, Estanislau! Tudo bem?
Fico feliz em ver você praticando a atividade, isso é ótimo para o seu desenvolvimento técnico. Está certinho. Você aplicou box-shadow em vários componentes, o que é ótimo para consistência visual!
Uma dica legal para deixar seu código estruturado é criar uma function ou mixin para padronizar essas sombras, evitando repetição, por exemplo:
@function shadow($opacity: 0.2) {
@return 0 0.25rem 0.75rem rgba(0, 0, 0, $opacity);
}
.card {
box-shadow: shadow();
}
Assim, você centraliza o estilo e facilita ajustes futuros! Se quiser se explorar mais sobre o tema, dá uma olhada neste artigo sobre Organize seu CSS com SMACSS, BEM e SASS e Noções básicas de Sass
Estes conteúdos podem abrir em inglês e se preferir ler em português, recomendo que utilize o tradutor automático do navegador.
Continue se dedicando aos estudos e qualquer dúvida, compartilhe no fórum.
Conte com o apoio da comunidade Alura na sua jornada. Abraços e bons estudos!