@luminati-io/css-mediaquery

CSS Media Query
===============


Parses and determines if a given CSS Media Query matches a set of values via
JavaScript.

Installation
------------

Install via npm:

``shell
$ npm install css-mediaquery
`

Usage
-----

This package has two exports: parse(), and match() which can parse CSS Media
Queries and determine if a media query matches a given set of values.

$3

The match() method lets you compare a media query expression with a JavaScript
object and determine if a media query matches a given set of values.

`javascript
var mediaQuery = require('css-mediaquery');

var isMatch = mediaQuery.match('screen and (min-width: 40em)', {
type : 'screen',
width: '1024px'
});

console.log(isMatch); // => true
`

The values specified to check a media query string against should be thought of
as if they are the current state of a device/browser. A type value _must_ be
specified, and it can _not_ be "all".

$3

Existing CSS Parsers don't do a great job at parsing the details of media
queries. That's where css-mediaquery shines. You can parse a media query
expression and get an AST back by using the parse() method.

`javascript
var mediaQuery = require('css-mediaquery'),
ast = mediaQuery.parse('screen and (min-width: 48em)');
`

The ast variable will have the following payload:

`javascript
[
{
inverse: false,
type : 'screen',

expressions: [
{
modifier: 'min',
feature : 'width',
value : '48em'
}
]
}
]
``

This package was written with care to following the W3C Recommendations for
[CSS3 Media Queries][w3c-mq] and [CSS3 Values and Units][w3c-vu]. It supports
all of the [Media Features][w3c-mq-features] and will properly convert values to
a common unit before comparing them.

[w3c-mq]: http://www.w3.org/TR/css3-mediaqueries/
[w3c-mq-features]: http://www.w3.org/TR/css3-mediaqueries/#media1
[w3c-vu]: http://www.w3.org/TR/css3-values/

License
-------

This software is free to use under the Yahoo! Inc. BSD license.
See the [LICENSE file][] for license text and copyright information.

[LICENSE file]: https://github.com/ericf/css-mediaquery/blob/master/LICENSE