Open Semigradsky opened 7 years ago
Is this a formatting issue? A plugin should not concern itself with formatting. At most, the newly generated @media
at-rules could take in the raws of another element.
https://github.com/SuperOl3g/postcss-image-set-polyfill/blob/master/index.js#L113-L116
Actually I don't know how to fix this correctly. As far as i understand problem is in this lines.
If I replace append
with insertAfter
order of rules brokens.
I can add \n
to 2 last append
but is it correct?
@jonathantneal, maybe you could help with this question too?))
Possible relative bug: input
.foo {
background-image: image-set(
url('../../backgrounds/image.jpg') 1x,
url('../../backgrounds/image@2x.jpg') 2x
);
}
@media (max-width: 640px) {
.foo {
background-image: none;
}
}
output
.foo {
background-image: url('../../backgrounds/image.jpg');
}
@media (max-width: 640px) {
.foo {
background-image: none;
}
}
@media (min-resolution: 192dpi) {
.foo {
background-image: url('../../backgrounds/image@2x.jpg');
}
}
input
background-image: image-set(url(../assets/img/cash_bg.jpg) 1x,
url(../assets/img/cash_bg@2x.png) 2x);
Actual output:
background-image: url(/static/img/cash_bg.ae8cf5a.jpg);
background-image: url(/static/img/cash_bg.ae8cf5a.jpg);
@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
....
}
@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
....
}
why output two ?
Input:
Expected output:
Actual output: