Oi, Raynara! Como vai?
Agradeço por compartilhar seu código com a comunidade Alura.
Seu uso de @include
e &:hover
mostra que você está dominando bem os recursos do SASS para reaproveitamento de código e interatividade. A estrutura das classes também está bem organizada!
Uma dica interessante para o futuro é explorar o uso do @extend
para evitar duplicações em botões parecidos. Veja este exemplo:
%btn-base {
padding: 1rem;
border-radius: 100px;
border: none;
font-family: variaveis.$fonte-textos;
font-size: 1.375rem;
line-height: 1.125rem;
}
.btn-main {
@extend %btn-base;
background-color: variaveis.$cor-default;
color: white;
font-weight: 600;
&:hover {
background-color: variaveis.$cor-secundaria;
}
}
Esse código cria uma base reutilizável para diferentes estilos de botões. O @extend
ajuda a manter o código limpo e mais fácil de manter.
Conte com o apoio da comunidade Alura na sua jornada. Abraços e bons estudos!