1
resposta

Existe alguma maneira de agrupar a s "class"s ?

Boas!

Estava pesando se por acaso existe algum recurso cujo qual seja possível criar uma um grupo de classes .

No caso da aula, ao invés de ter três ou mais class em cada tag artigo, seria colocado as class em algo como um grupo que pode ser chamado no css ou alguma coisa do tipo . Penso que em um projetos mais complexo, não seja interessante colocar 7 ou 8 class várias tag, quando elas são idênticas em propósito.

Faz sentido? Se sim, tem alguma dica para isso ?

1 resposta

Olá Marco, tudo bem com você?

Então, realmente uma das características negativas desse estilo de customização é que você acaba tendo muito código repetido para trazer mesmo comportamento

O que eu vejo como solução, mas não sei se é tão utilizado, é você fazer a combinação do bootstrap com o sass, então você faria um:

npm install bootstrap --D
npm install sass -D

E dentro de um arquivo, por exemplo: main.sass

Você faria a importação do bootstrap:

@import 'node_modules/bootstrap/scss/boostrap';

E utilizaria o recurso de herança de estilos do sass para atingir seu objetivo, então vamos supor que você tinha uma div da seguinte maneira:

<div class="col-md-12 text-success m-5 py-5 alert alert-danger>  [...] </div>

Você pode mudar para:

<div class="customizada"> [...] </div>

E dentro do arquivo sass fazer :

.customizada {
    @extend .col-md-12;
    @extend .text-success;
    @extend .m-5;
    @extend .py-5;
    @extend .alert;
    @extend .alert-danger;
}

Dessa forma sempre que utilizar .customizada terá todos esses comportamentos :)

Agora fora essa maneira eu não consigo pensar em outra forma :)

Abraços e Bons Estudos!