https://github.com/neurosnap/postcss-scale-media-query

Scale media query `-width` by some percentage
https://github.com/neurosnap/postcss-scale-media-query

media-query postcss postcss-plugin scale

Last synced: 19 days ago
JSON representation

Scale media query `-width` by some percentage

• Host: GitHub
• URL: https://github.com/neurosnap/postcss-scale-media-query
• Owner: neurosnap
• Created: 2017-04-08T14:05:17.000Z (over 7 years ago)
• Default Branch: master
• Last Pushed: 2017-04-26T20:58:13.000Z (over 7 years ago)
• Last Synced: 2024-10-06T07:21:38.881Z (about 1 month ago)
• Topics: media-query, postcss, postcss-plugin, scale
• Language: JavaScript
• Homepage:
• Size: 12.7 KB
• Stars: 1
• Watchers: 2
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • Changelog: CHANGELOG.md

Awesome Lists containing this project

README

        
Postcss Scale Media Query [![Build Status](https://travis-ci.org/neurosnap/postcss-scale-media-query.svg?branch=master)](https://travis-ci.org/neurosnap/postcss-scale-media-query)

=========================

The goal of this postcss plugin is to scale all media query `-width` by some percentage.

This will only alter the values of the following media query features:

* min-width

* max-width

* min-device-width

* max-device-width

Install

-------

```bash

npm install postcss-scale-media-query

```

Use

---

```js

const postcss = require('postcss');

const ScaleMediaQuery = require('postcss-scale-media-query');

const css = '@media (min-width:480px) { color: red; }';

const updatedCss = postcss([

  ScaleMediaQuery({ scale: 1.5 }),

]).process(css).css;

console.log(updatedCss);

// '@media (min-width:720px) { color: red; }'

```