feat(style): implementa media query com variáveis

[felipepetuco]

spike - grid-system: implementa customização dos breakpoints

SPIKE po-style-service

DTHFUI-9712

Qual o comportamento atual?
Atualmente não é possível implementar regras de media query com referência à variáveis, exemplo:
@media (min-width: var(--gridSystemMdMinWidth)) and (max-width: var(--gridSystemMdMaxWidth)){}

Foi realizado teste com o postcss-custom-properties e outros porém não reconheceram as variáveis quando referenciadas em regra de media query.

Qual o novo comportamento?
O estudo demonstrou como possibilitar a implementação de media query referenciando variáveis no lugar de valores;
A solução contempla dois lados:
1-O projeto Po-Style: Agora possibilita declararmos variáveis e com o auxílio do plugin postcss-simple-vars integrado ao gulp realiza a troca das respectivas variáveis para seus valores.
2-O serviço PoStyleService: Criado um serviço que possibilita ao desenvolver realizar a customização das variáveis informando a regra e qual valor ou valores deverá aplicar.

Simulação