Awesome
No Media Queries
Export the css without mediaqueries matching maximum page width. This library can be used when you cant use respond.js, so you can have separated stylesheet for non responsive layout for IE8.
Also avaiable as gulp/grunt plugin.
Install
Download manually or with a package-manager.
npm
npm install --save no-media-queries
Sample usage
nmq(css, options, reworkOptions);
CLI
You can also use it as a CLI app by installing it globally:
npm install --global no-media-queries
$ nmq --help
Usage:
$ nmq <file> > <new-file>
Example:
$ nmq responsive.css > non-responsive.css
Custom options: (options with one dash, reworkOptions with two dashes)
$ nmq responsive.css > non-responsive.css -width=200px --compress=true
Example
This library will export all the relevant css rules form your css that match proper mediaquery breakpoint passed in.
If we have css like this:
a{
color: blue;
}
@media all and (min-width: 500px){
a{
color: red;
}
}
Running:
nmq(fs.readFileSync('responsive.css'), {width: 600px});
Will result in:
a{
color: red;
}
So we can have in our head css stylesheets like this:
<link rel="stylesheet" href="responsive.css">
<!--[if (lt IE 9)]>
<link rel="stylesheet" href="no-responsive.css">
<![endif]-->
Where no-responsive.css will be output from no-media-queries libarry.
CSS
Type: String
or Buffer
Css to parse.
Options
width
Type: String
Default: '10000px'
Breakpoint for our page width which should match mediaqueries.
type
Type: String
Default: 'all'
Type of device.
ReworkOptions
License
MIT © Daniel Husar