UNPKG

motion

Version:

motion - moving development forward

71 lines (70 loc) 4.96 kB
{ "_args": [ [ "postcss-calc@https://registry.npmjs.org/postcss-calc/-/postcss-calc-5.2.0.tgz", "/Users/nw/flint/packages/flint" ] ], "_from": "postcss-calc@>=5.0.0 <6.0.0", "_id": "postcss-calc@5.2.0", "_inCache": true, "_location": "/postcss-calc", "_phantomChildren": {}, "_requested": { "name": "postcss-calc", "raw": "postcss-calc@https://registry.npmjs.org/postcss-calc/-/postcss-calc-5.2.0.tgz", "rawSpec": "https://registry.npmjs.org/postcss-calc/-/postcss-calc-5.2.0.tgz", "scope": null, "spec": "https://registry.npmjs.org/postcss-calc/-/postcss-calc-5.2.0.tgz", "type": "remote" }, "_requiredBy": [ "/cssnano" ], "_resolved": "https://registry.npmjs.org/postcss-calc/-/postcss-calc-5.2.0.tgz", "_shasum": "0b6153b79390ba3b7b98eaddff63f179ffe6faf5", "_shrinkwrap": null, "_spec": "postcss-calc@https://registry.npmjs.org/postcss-calc/-/postcss-calc-5.2.0.tgz", "_where": "/Users/nw/flint/packages/flint", "author": { "name": "Maxime Thirouin" }, "bugs": { "url": "https://github.com/postcss/postcss-calc/issues" }, "dependencies": { "postcss": "^5.0.2", "postcss-message-helpers": "^2.0.0", "reduce-css-calc": "^1.2.0" }, "description": "PostCSS plugin to reduce calc()", "devDependencies": { "eslint": "^1.0.0", "postcss-custom-properties": "^5.0.0", "tape": "^3.0.0" }, "files": [ "index.js" ], "homepage": "https://github.com/postcss/postcss-calc#readme", "keywords": [ "calc", "calculation", "css", "postcss", "postcss-plugin" ], "license": "MIT", "name": "postcss-calc", "optionalDependencies": {}, "readme": "# postcss-calc [![Build Status](https://travis-ci.org/postcss/postcss-calc.png)](https://travis-ci.org/postcss/postcss-calc)\n\n> [PostCSS](https://github.com/postcss/postcss) plugin to reduce `calc()`.\n\nThis plugin reduce `calc()` references whenever it's possible.\nThis can be particularly useful with the [postcss-custom-properties](https://github.com/postcss/postcss-custom-properties) plugin.\n\n**Note:** When multiple units are mixed together in the same expression, the `calc()` statement is left as is, to fallback to the [w3c calc() feature](http://www.w3.org/TR/css3-values/#calc).\n\n## Installation\n\n```console\n$ npm install postcss-calc\n```\n\n## Usage\n\n```js\n// dependencies\nvar fs = require(\"fs\")\nvar postcss = require(\"postcss\")\nvar calc = require(\"postcss-calc\")\n\n// css to be processed\nvar css = fs.readFileSync(\"input.css\", \"utf8\")\n\n// process css\nvar output = postcss()\n .use(calc())\n .process(css)\n .css\n```\n\n**Example** (with [postcss-custom-properties](https://github.com/postcss/postcss-custom-properties) enabled as well):\n\n```js\n// dependencies\nvar fs = require(\"fs\")\nvar postcss = require(\"postcss\")\nvar customProperties = require(\"postcss-custom-properties\")\nvar calc = require(\"postcss-calc\")\n\n// css to be processed\nvar css = fs.readFileSync(\"input.css\", \"utf8\")\n\n// process css\nvar output = postcss()\n .use(customProperties())\n .use(calc())\n .process(css)\n .css\n```\n\nUsing this `input.css`:\n\n```css\n:root {\n --main-font-size: 16px;\n}\n\nbody {\n font-size: var(--main-font-size);\n}\n\nh1 {\n font-size: calc(var(--main-font-size) * 2);\n height: calc(100px - 2em);\n}\n```\n\nyou will get:\n\n```css\nbody {\n font-size: 16px\n}\n\nh1 {\n font-size: 32px;\n height: calc(100px - 2em)\n}\n```\n\nCheckout [tests](test) for more examples.\n\n### Options\n\n#### `precision` (default: `5`)\n\nAllow you to definine the precision for decimal numbers.\n\n```js\nvar out = postcss()\n .use(calc({precision: 10}))\n .process(css)\n .css\n```\n\n#### `preserve` (default: `false`)\n\nAllow you to preserve calc() usage in output so browsers will handle decimal precision themselves.\n\n```js\nvar out = postcss()\n .use(calc({preserve: true}))\n .process(css)\n .css\n```\n\n#### `warnWhenCannotResolve` (default: `false`)\n\nAdds warnings when calc() are not reduced to a single value.\n\n```js\nvar out = postcss()\n .use(calc({warnWhenCannotResolve: true}))\n .process(css)\n .css\n```\n\n#### `mediaQueries` (default: `false`)\n\nAllows calc() usage as part of media query declarations.\n\n```js\nvar out = postcss()\n .use(calc({mediaQueries: true}))\n .process(css)\n .css\n```\n\n---\n\n## Contributing\n\nWork on a branch, install dev-dependencies, respect coding style & run tests before submitting a bug fix or a feature.\n\n```console\n$ git clone https://github.com/postcss/postcss-calc.git\n$ git checkout -b patch-1\n$ npm install\n$ npm test\n```\n\n## [Changelog](CHANGELOG.md)\n\n## [License](LICENSE)\n", "readmeFilename": "README.md", "repository": { "type": "git", "url": "git+https://github.com/postcss/postcss-calc.git" }, "scripts": { "test": "eslint . && tape test" }, "version": "5.2.0" }