node-pixrem
node-pixrem copied to clipboard
Cleanup "IE8 only" file
I'm using node-pixrem to generate a seperate IE8 file and include it with a conditional comment.
That means that the browser is parsing the mainIE8.css after main.css.
It would be nice if the mainIE8.css could only contain the needed px values and not all of the same declarations in main.css
How about adding a option like uniqueDecl (strage name...) and doing it like this:
var options = typeof options !== 'undefined' ? options : {
replace: false,
uniqueDecl: false
};
var postprocessor = postcss(function (css) {
css.eachDecl(function (decl, i) {
var rule = decl.parent;
var value = decl.value;
if (value.indexOf('rem') != -1) {
value = value.replace(remgex, function ($1) {
// Round decimal pixels down to match webkit and opera behavior:
// http://tylertate.com/blog/2012/01/05/subpixel-rounding.html
return Math.floor(parseFloat($1) * toPx(rootvalue)) + 'px';
});
if (options.replace) {
decl.value = value;
} else {
rule.insertBefore(i, decl.clone({ value: value }));
}
} else if(options.uniqueDecl) {
// remove declarations without rem
decl.removeSelf();
}
});
if(options.uniqueDecl) {
// remove empty rules
css.eachRule(function (rule) {
var empty = !rule.some(function (i) { return i; });
if (empty) {
rule.removeSelf();
}
});
}
});
There is for sure a way to do this with just one eachRule/eachDecl, but i hope you understand what i mean.
I agree It would be a great option to have. :+1: