postcss-em-media-query

PostCSS plugin for transforming min/max-width/height media queries to ems.

Install

npm install postcss postcss-em-media-query --save

Usage

import postcss from 'postcss';
import emMediaQuery from 'postcss-em-media-query';

postcss([
    emMediaQuery({
        /* options */
    })
]);

/* Before */

@media screen and (min-width: 600px) and (max-width: 739px) {
    .foo {
        color: red;
    }
}

/* After */

@media screen and (min-width: 37.5em) and (max-width: 46.1875em) {
    .foo {
        color: red;
    }
}

Options

precision

Type: Integer
Default: 5

Rounding precision for values.

License

MIT © Ivan Nikolić

Changelog

[Unreleased][]

4.1.1 - 2024-05-07

Fixed

• Prevent possible infinite loops when processing nodes

4.1.0 - 2020-10-21

Changed

• Upgrade em-media-query (Closes #3)

4.0.0 - 2020-10-20

Changed

• Properly export plugin function (reference)

3.0.0 - 2020-10-07

Added

• Support for PostCSS 8

[unreleased]: https://github.com/niksy/postcss-em-media-query/compare/v3.0.0...HEAD

[unreleased]: https://github.com/niksy/postcss-em-media-query/compare/v4.0.0...HEAD

[unreleased]: https://github.com/niksy/postcss-em-media-query/compare/v4.1.0...HEAD

[unreleased]: https://github.com/niksy/postcss-em-media-query/compare/v4.1.1...HEAD