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

Rework options

License

MIT © Daniel Husar