Media queries se repetindo - Houve algum atualização ?

Olá, Galera! Estava com uma dúvida sobre a criação de forma separada das media queries ao longo do css. Há uma pergunta aqui no fórum sobre esse ponto e que inclusive teve participação do Natan, mas que já faz um bom tempo (20/01/2017).

Gostaria de saber se ao longo do tempo houve alguma mudança sobre esse ponto. Acredito que seja mais fácil de ler o css quando há a separação bem definida sobre o comportamento do site em cada resolução. Ter o código separado por todo código me faz pensar que compromete um pouco a leitura e manutenção, tendo em vista que querendo realizar alterações do comportamento da pagina em um max-width: 980px, teria que sair dando Ctrl + f para encontrar cada parte onde tem essa resolução.

Houve um amadurecimento desse ponto ou mudança ?

Fala ai Jair, tudo bem? Vamos lá:

Houve um amadurecimento desse ponto ou mudança ?

Bom, não sei como foi a resposta dessa dúvida ou como foi feita na aula (já fiz esse curso há muito tempo).

Mas, o que eu gosto de fazer em projetos profissionais ou particulares é deixar a media query junto com o contexto que ela se refere, exemplo:

.algum-elemento {
    @media ($mobile) {}
    @media ($tablet) {}
    @media ($desktop) {}
}

O que eu deixo separado em variáveis são os valores de como aplico elas, no caso as variáveis $mobile, $tablet e $desktop. Já vi gente criando mixin para deixar isso mais automatizado, porém, eu não gosto de tanta abstração à esse ponto.

E deixando junto, você bate o olho e já vi os diferentes comportamentos do elemento. Caso fosse um arquivo separado apenas para responsivo iria dificultar um pouco visualizar os diferentes cenários.

Espero ter ajudado.

Mergulhe em programação