{"_id":"@ashelley/postcss-simple-vars","_rev":"4-46283dde3928efeae4af003373232fc5","name":"@ashelley/postcss-simple-vars","description":"PostCSS plugin for Sass-like variables","dist-tags":{"latest":"0.3.0-warnings"},"versions":{"0.3.0":{"name":"@ashelley/postcss-simple-vars","version":"0.3.0","description":"PostCSS plugin for Sass-like variables","keywords":["postcss","css","postcss-plugin","sass","variables","vars"],"author":{"name":"Andrey Sitnik","email":"andrey@sitnik.ru"},"license":"MIT","repository":{"type":"git","url":"git+https://github.com/postcss/postcss-simple-vars.git"},"dependencies":{"postcss":"^4.1.9"},"devDependencies":{"gulp-eslint":"0.11.1","gulp-mocha":"2.0.1","mocha":"2.2.4","chai":"2.3.0","gulp":"3.8.11"},"scripts":{"test":"gulp"},"gitHead":"d0221361ee423d9cd2e6829e203385199d24cf51","bugs":{"url":"https://github.com/postcss/postcss-simple-vars/issues"},"homepage":"https://github.com/postcss/postcss-simple-vars#readme","_id":"@ashelley/postcss-simple-vars@0.3.0","_shasum":"fc9f27bda01652a7b2fe010492ac07810b8a361c","_from":".","_npmVersion":"2.11.3","_nodeVersion":"0.12.7","_npmUser":{"name":"ashelley","email":"ashelley@retool.co"},"dist":{"shasum":"fc9f27bda01652a7b2fe010492ac07810b8a361c","tarball":"https://registry.npmjs.org/@ashelley/postcss-simple-vars/-/postcss-simple-vars-0.3.0.tgz","integrity":"sha512-33xT5xTbFPATfBU0Ir3UvOBSwaX9bkOVIfTA+P10pvbKsYJyfowJBmaiFHeY3nnYhTTNmkL5mJH1Er6b1R+sMA==","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDTlg2lfcmlKnHyhBQf6nFJif2t+9t4/GA3gkou4Bqi4QIhAMAmt/eVT5g5ERm02q917mzqwKy9uII2Ja6r/OLgjIzS"}]},"maintainers":[{"name":"ashelley","email":"ashelley@retool.co"}]},"0.3.0-warnings":{"name":"@ashelley/postcss-simple-vars","version":"0.3.0-warnings","description":"PostCSS plugin for Sass-like variables","keywords":["postcss","css","postcss-plugin","sass","variables","vars"],"author":{"name":"Andrey Sitnik","email":"andrey@sitnik.ru"},"license":"MIT","repository":{"type":"git","url":"git+https://github.com/ashelley/postcss-simple-vars.git"},"dependencies":{"postcss":"^4.1.9"},"devDependencies":{"gulp-eslint":"0.11.1","gulp-mocha":"2.0.1","mocha":"2.2.4","chai":"2.3.0","gulp":"3.8.11"},"scripts":{"test":"gulp"},"gitHead":"d0221361ee423d9cd2e6829e203385199d24cf51","bugs":{"url":"https://github.com/ashelley/postcss-simple-vars/issues"},"homepage":"https://github.com/ashelley/postcss-simple-vars#readme","_id":"@ashelley/postcss-simple-vars@0.3.0-warnings","_shasum":"9fd47b813fd8e2a2e9169ab9f1755950ed60eaeb","_from":".","_npmVersion":"2.11.3","_nodeVersion":"0.12.7","_npmUser":{"name":"ashelley","email":"ashelley@retool.co"},"dist":{"shasum":"9fd47b813fd8e2a2e9169ab9f1755950ed60eaeb","tarball":"https://registry.npmjs.org/@ashelley/postcss-simple-vars/-/postcss-simple-vars-0.3.0-warnings.tgz","integrity":"sha512-wsTaRVUBmltSrCVKr5DJPNPNAW6AI7Lxqjy/S3fAPrgqA/fWGFggYRgKbziCyaJNXWnBRvWmFfcE5vqZJy0E2A==","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIFrAEqp4lMu+z8B2WJ4pF4kMyZ+Yul8+pCkNJCZNUU+mAiB3NxzxEb5233MtvDIvx0S7EbbNlGev17vD0mQQOBBPzw=="}]},"maintainers":[{"name":"ashelley","email":"ashelley@retool.co"}]}},"readme":"# PostCSS Simple Variables [![Build Status][ci-img]][ci]\r\n\r\n\r\n\r\n[PostCSS] plugin for Sass-like variables.\r\n\r\nYou can use variables inside values, selectors and at-rule’s parameters.\r\n\r\n```css\r\n$blue: #056ef0;\r\n$column: 200px;\r\n\r\n.menu {\r\n width: calc(4 * $column);\r\n}\r\n.menu_link {\r\n background: $blue;\r\n width: $column;\r\n}\r\n```\r\n\r\n```css\r\n.menu {\r\n width: calc(4 * 200px);\r\n}\r\n.menu_link {\r\n background: #056ef0;\r\n width: 200px;\r\n}\r\n```\r\n\r\nIf you want be closer to W3C spec,\r\nyou should use [postcss-custom-properties] plugin.\r\n\r\nAlso you should look at [postcss-map] for big complicated configs.\r\n\r\n[postcss-custom-properties]: https://github.com/postcss/postcss-custom-properties\r\n[postcss-map]: https://github.com/pascalduez/postcss-map\r\n[PostCSS]: https://github.com/postcss/postcss\r\n[ci-img]: https://travis-ci.org/postcss/postcss-simple-vars.svg\r\n[ci]: https://travis-ci.org/postcss/postcss-simple-vars\r\n\r\n## Interpolation\r\n\r\nThere is special syntax if you want to use variable inside CSS words:\r\n\r\n```css\r\n$prefix: my-company-widget\r\n\r\n$prefix { }\r\n$(prefix)_button { }\r\n```\r\n\r\n## Usage\r\n\r\n```js\r\npostcss([ require('postcss-simple-vars') ])\r\n```\r\n\r\nSee [PostCSS] docs for examples for your environment.\r\n\r\n## Options\r\n\r\nCall plugin function to set options:\r\n\r\n```js\r\n.pipe(postcss([ require('postcss-simple-vars')({ silent: true }) ]))\r\n```\r\n\r\n### `variables`\r\n\r\nSet default variables. It is useful to store colors or other constants\r\nin common file:\r\n\r\n```js\r\n// config/colors.js\r\n\r\nmodule.exports = {\r\n blue: '#056ef0'\r\n}\r\n\r\n// gulpfile.js\r\n\r\nvar colors = require('./config/colors');\r\nvar vars = require('postcss-simple-vars')\r\n\r\ngulp.task('css', function () {\r\n return gulp.src('./src/*.css')\r\n .pipe(postcss([ vars({ variables: colors }) ]))\r\n .pipe(gulp.dest('./dest'));\r\n});\r\n```\r\n\r\nYou can set a function returning object, if you want to update default\r\nvariables in webpack hot reload:\r\n\r\n```js\r\npostcss([\r\n vars({\r\n variables: function () {\r\n return require('./config/colors');\r\n }\r\n })\r\n]\r\n```\r\n\r\n### `silent`\r\n\r\nLeft unknown variables in CSS and do not throw a error. Default is `false`.\r\n\r\n### `only`\r\n\r\nSet value only for variables from this object.\r\nOther variables will not be changed. It is useful for PostCSS plugin developers.\r\n","maintainers":[{"name":"ashelley","email":"ashelley@retool.co"}],"time":{"modified":"2022-06-12T14:49:13.950Z","created":"2015-08-19T17:32:53.543Z","0.3.0":"2015-08-19T17:32:53.543Z","0.3.0-warnings":"2015-08-19T17:36:48.118Z"},"homepage":"https://github.com/ashelley/postcss-simple-vars#readme","keywords":["postcss","css","postcss-plugin","sass","variables","vars"],"repository":{"type":"git","url":"git+https://github.com/ashelley/postcss-simple-vars.git"},"author":{"name":"Andrey Sitnik","email":"andrey@sitnik.ru"},"bugs":{"url":"https://github.com/ashelley/postcss-simple-vars/issues"},"license":"MIT","readmeFilename":"README.md"}