css-mediaquery icon indicating copy to clipboard operation
css-mediaquery copied to clipboard

css-mediaquery does not work with comments in media queries and with Opera's device pixel ratio

Open rvock opened this issue 11 years ago • 4 comments
trafficstars

Two samples which fail to parse:

@media (-o-min-device-pixel-ratio: 3 / 2) {
    body { background: url('hd-background.png'); }
}
@media (-webkit-min-device-pixel-ratio: 1.5),
    (min--moz-device-pixel-ratio: 1.5),
    /* Opera Device Pixel ratio not supported by css-mediaquery 0.1.2 */
    /* (-o-min-device-pixel-ratio: 3 / 2), */
    (min-device-pixel-ratio: 1.5) {
    body { background: url('hd-background.png'); }
}

This works:

@media (min-device-pixel-ratio: 1.5) {
    body { background: url('hd-background.png'); }
}

rvock avatar Feb 03 '14 20:02 rvock

I'll work on doing the pragmatically-correct thing for these. I held off on adding support for vendor prefixes, because the best practice is to include a non-prefix query in the set, like you have in the second example.

I will add support for comments, since those are a valid part of the spec.

ericf avatar Feb 04 '14 09:02 ericf

Support for vendor prefixes: -webkit-… -o-… …-moz-…

Usage: Compare it with a non-prefix query…

Changes (@ericf please revisit): https://github.com/ericf/css-mediaquery/blob/master/index.js#L16

RE_MQ_FEATURE      = /^(?:-(webkit|moz|o)-)?(?:(min|max)-)?(?:-(moz)-)?(.+)/,

https://github.com/ericf/css-mediaquery/blob/master/index.js#L131-L132

modifier: feature[2],
feature: feature[4],

maltewassermann avatar Jun 21 '14 00:06 maltewassermann

+1

mahnunchik avatar Nov 06 '14 13:11 mahnunchik

Any news?

mahnunchik avatar Dec 23 '14 11:12 mahnunchik