css-viewport-units-transform
Version:
Transform CSS viewport units of a style object to pixels based on window dimensions
65 lines (51 loc) • 1.49 kB
Markdown
# css-viewport-units-transform
[](https://travis-ci.org/kristerkari/css-viewport-units-transform)
[](https://ci.appveyor.com/project/kristerkari/css-viewport-units-transform/branch/master)
[](https://coveralls.io/github/kristerkari/css-viewport-units-transform?branch=master)
[](https://egghead.io/courses/how-to-contribute-to-an-open-source-project-on-github)
Transform CSS viewport units of a Javascript style object to pixels based on window dimensions.
Supports `vw`, `vh`, `vmin` and `vmax` units.
```js
import { transform } from "css-viewport-units-transform";
// or const transform = require("css-viewport-units-transform").transform;
transform(
{
fontSize: "10vw"
},
{
width: 480,
height: 100
}
);
```
↓ ↓ ↓ ↓ ↓ ↓
```js
{
fontSize: 48;
}
```
or
```js
transform(
{
myClass: {
fontSize: "10vh"
}
},
{
width: 480,
height: 100
}
);
```
↓ ↓ ↓ ↓ ↓ ↓
```js
{
myClass: {
fontSize: 10,
}
}
```
## Dependencies
- None