PostCSS Modify Numbers

PostCSS plugin that performs math operations on all numbers with a certain property.

Installation

$ npm install postcss-modify-numbers

Usage

postcss([
    require('postcss-modify-numbers')({
        property: "width",
        operation: "multiply",
        number: 1.3
    })
])

/* Input example */
.foo {
    width: 50px; 
    height: 30px;
}

.bar {
    width: 100px;
    height: 60px;
}

/* Output example */
.foo {
  width: 65px; /* Multiplied by 1.3 */
  height: 30px;
}

.bar {
    width: 130px; /* Multiplied by 1.3 */
    height: 60px;
}

Options

Property

What CSS property you would like to affect, currently only supports one.

Operation

What operation you would like to perform ('add','subtract','divide','multiple')

Number

The number you would like modify the number by

Decimals

The number of decimal places to round to (default is 3)

See PostCSS docs for examples for your environment.