Margens Lg sobrepostas pelas Sm e Md

[ronanfabio]

Boa tarde,

Percebi que as margens para telas com tamanho "lg" estão sendo sobrepostas pelas margens para "sm" e "md".

[jhonyeduardo]

Boa tarde @ronanfabio

Consegue simular o problema neste (ambiente)[https://stackblitz.com/edit/po-ui], para que possamos entender melhor a situação.

[ronanfabio]

Boa tarde @jhonyeduardo,

Segue código utilizado para a demonstração:

<po-page-default p-title="PO UI">
<div class="po-row">
<p class="po-visible-lg-12 po-ml-lg-5">po-visible-lg-12 po-ml-lg-5</p>
<p class="po-lg-12 po-ml-lg-5 po-ml-md-2">po-lg-12 po-ml-lg-5 po-ml-md-2</p>
</div>
</po-page-default>

Como pode ser visto, o 2° parágrafo na situação de uma tela "lg" não assume a margem correta (po-ml-lg-5), e sim a da tela "md" (po-ml-md-2).

Analisando o css da Po-UI, percebi que a ordem dos blocos que definem as margens não estão na ordem correta.
Po-UI:
@media screen and (min-width:961px) - lg
@media screen and (min-width:481px) - md
@media screen and (max-width:480px) - sm
@media screen and (min-width:1367px) - xl

Como eu ajustei:
@media screen and (max-width:480px) - sm
@media screen and (min-width:481px) - md
@media screen and (min-width:961px) - lg
@media screen and (min-width:1367px) - xl

Qualquer dúvida estou a disposição.
Desde já agradeço.

Link da simulação: https://stackblitz.com/edit/po-ui-bvnv8b

[jhonyeduardo]

Ola @ronanfabio

Que tal contribuir conosco?

Caso possuir alguma dúvida estou a disposição.

[ronanfabio]

Boa tarde,

Analisando melhor o código e os exemplos da página po-spacing.html do po-style, percebi que era minha interpretação que estava incorreta.

Desde já agradeço pela atenção.