{"_id":"klei-rework-plugins","_rev":"4539060","name":"klei-rework-plugins","description":"Some nice plugins for rework the css preprocessing library","dist-tags":{"latest":"0.3.0"},"maintainers":[{"name":"joakimbeng","email":"joakim@klei.se"}],"time":{"modified":"2026-04-09T15:07:19.000Z","created":"2013-03-08T18:32:31.081Z","0.3.0":"2013-12-13T09:21:43.755Z","0.2.1":"2013-03-08T21:34:57.492Z","0.2.0":"2013-03-08T21:16:02.649Z","0.1.0":"2013-03-08T18:32:31.081Z"},"users":{},"author":{"name":"Joakim Bengtson","email":"joakim@klei.se"},"repository":{"type":"git","url":"git://github.com/klei-dev/rework-plugins.git"},"versions":{"0.3.0":{"name":"klei-rework-plugins","version":"0.3.0","description":"Some nice plugins for rework the css preprocessing library","main":"index.js","scripts":{"test":"./node_modules/.bin/mocha -R spec"},"repository":{"type":"git","url":"git://github.com/klei-dev/rework-plugins.git"},"keywords":["rework","rework-plugins","css"],"author":{"name":"Joakim Bengtson","email":"joakim@klei.se"},"license":"MIT","devDependencies":{"mocha":"~1.15.1","rework":"~0.18.3","chai":"~1.8.1"},"bugs":{"url":"https://github.com/klei-dev/rework-plugins/issues"},"_id":"klei-rework-plugins@0.3.0","dist":{"shasum":"5635ad5bfa5fdba6d4b672826431b278ce061a70","size":6030,"noattachment":false,"key":"/klei-rework-plugins/-/klei-rework-plugins-0.3.0.tgz","tarball":"http://registry.cnpm.dingdandao.com/klei-rework-plugins/download/klei-rework-plugins-0.3.0.tgz"},"_from":".","_npmVersion":"1.3.11","_npmUser":{"name":"joakimbeng","email":"joakim@klei.se"},"maintainers":[{"name":"joakimbeng","email":"joakim@klei.se"}],"directories":{},"deprecated":"Replaced with rework-calc and rework-breakpoints","_cnpmcore_publish_time":"2021-12-21T00:59:30.152Z","publish_time":1386926503755,"_cnpm_publish_time":1386926503755},"0.2.1":{"name":"klei-rework-plugins","version":"0.2.1","description":"Some nice plugins for rework the css preprocessing library","main":"index.js","scripts":{"test":"./node_modules/.bin/mocha -R spec"},"repository":{"type":"git","url":"git://github.com/klei-dev/rework-plugins.git"},"keywords":["rework","rework-plugins","css"],"author":{"name":"Joakim Bengtson","email":"joakim@klei.se"},"license":"MIT","devDependencies":{"mocha":"~1.8.1","rework":"~0.13.2","chai":"~1.5.0"},"_id":"klei-rework-plugins@0.2.1","dist":{"shasum":"6c2f826b43fb5c730d862762624828d550ed1eba","size":5953,"noattachment":false,"key":"/klei-rework-plugins/-/klei-rework-plugins-0.2.1.tgz","tarball":"http://registry.cnpm.dingdandao.com/klei-rework-plugins/download/klei-rework-plugins-0.2.1.tgz"},"_from":".","_npmVersion":"1.2.10","_npmUser":{"name":"joakimbeng","email":"joakim@klei.se"},"maintainers":[{"name":"joakimbeng","email":"joakim@klei.se"}],"directories":{},"deprecated":"Replaced with rework-calc and rework-breakpoints","_cnpmcore_publish_time":"2021-12-21T00:59:29.846Z","publish_time":1362778497492,"_cnpm_publish_time":1362778497492},"0.2.0":{"name":"klei-rework-plugins","version":"0.2.0","description":"Some nice plugins for rework the css preprocessing library","main":"index.js","scripts":{"test":"./node_modules/.bin/mocha -R spec"},"repository":{"type":"git","url":"git://github.com/klei-dev/rework-plugins.git"},"keywords":["rework","rework-plugins","css"],"author":{"name":"Joakim Bengtson","email":"joakim@klei.se"},"license":"MIT","devDependencies":{"mocha":"~1.8.1","rework":"~0.13.2","chai":"~1.5.0"},"_id":"klei-rework-plugins@0.2.0","dist":{"shasum":"7d602fda8e34d5fb4dfbe7ea6c035ae31c3a91ac","size":5900,"noattachment":false,"key":"/klei-rework-plugins/-/klei-rework-plugins-0.2.0.tgz","tarball":"http://registry.cnpm.dingdandao.com/klei-rework-plugins/download/klei-rework-plugins-0.2.0.tgz"},"_from":".","_npmVersion":"1.2.10","_npmUser":{"name":"joakimbeng","email":"joakim@klei.se"},"maintainers":[{"name":"joakimbeng","email":"joakim@klei.se"}],"directories":{},"deprecated":"Replaced with rework-calc and rework-breakpoints","_cnpmcore_publish_time":"2021-12-21T00:59:28.945Z","publish_time":1362777362649,"_cnpm_publish_time":1362777362649},"0.1.0":{"name":"klei-rework-plugins","version":"0.1.0","description":"Some nice plugins for rework the css preprocessing library","main":"index.js","scripts":{"test":"./node_modules/.bin/mocha -R spec"},"repository":{"type":"git","url":"git://github.com/klei-dev/rework-plugins.git"},"keywords":["rework","rework-plugins","css"],"author":{"name":"Joakim Bengtson","email":"joakim@klei.se"},"license":"MIT","devDependencies":{"mocha":"~1.8.1","rework":"~0.13.2","chai":"~1.5.0"},"_id":"klei-rework-plugins@0.1.0","dist":{"shasum":"330b9be06c2e51e3e18b7a31509a4e3995d447b3","size":3591,"noattachment":false,"key":"/klei-rework-plugins/-/klei-rework-plugins-0.1.0.tgz","tarball":"http://registry.cnpm.dingdandao.com/klei-rework-plugins/download/klei-rework-plugins-0.1.0.tgz"},"_from":".","_npmVersion":"1.2.10","_npmUser":{"name":"joakimbeng","email":"joakim@klei.se"},"maintainers":[{"name":"joakimbeng","email":"joakim@klei.se"}],"directories":{},"deprecated":"Replaced with rework-calc and rework-breakpoints","_cnpmcore_publish_time":"2021-12-21T00:59:28.866Z","publish_time":1362767551081,"_cnpm_publish_time":1362767551081}},"readme":"klei-rework-plugins\n===================\n\n## **DEPRECATED!** _This repository is deprecated in favor of [rework-calc](https://github.com/klei-dev/rework-calc) and [rework-breakpoints](https://github.com/klei-dev/rework-breakpoints)!_\n\nA collection of plugins for the CSS Preprocessor [rework](https://github.com/visionmedia/rework).\n\n## Installation\n\n```bash\nnpm install klei-rework-plugins\n```\n\n## Usage\n\nAn example of how to use `klei-rework-plugins`:\n\n```javascript\nvar rework = require('rework'),\n    plugins = require('klei-rework-plugins');\n\nvar css = rework(cssString).use(plugins.<pluginname>()).toString();\n```\n\nFor available plugins see plugins section below.\n\n## Plugins\n\n### .calc()\n\nAdd calculations support. A feature to do simple calculations, and can be\nparticularly useful together with the rework core .vars() plugin.\n\nWhen multiple units are mixed together in the same expression, the calc() statement\nis left as is, to fallback to the CSS3 Calc feature.\n\n**Example** (with .vars() enabled as well):\n\n```css\n:root {\n  var-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\n**yields**:\n\n```css\n:root {\n  var-main-font-size: 16px\n}\n\nbody {\n  font-size: 16px\n}\n\nh1 {\n  font-size: 32px;\n  height: calc(100px - 2em)\n}\n```\n\n### .breakpoints()\n\nGives you a maintainable solution to handling media query breakpoints\nfor different devices, with a syntax that's easy to remember.\n\nA breakpoint is declared with: `breakpoint-<name>: <type> <point>`, where:\n\n  * `<name>` - is the name for the breakpoint (to use in your media query)\n  * `<type>` - values: `min` or `max`\n  * `<point>` - the actual breakpoint value in pixels (px)\n\n**Example 1 - max breakpoint**:\n\n```css\n:root {\n  breakpoint-mobile: max 340px;\n}\n\n@media mobile {\n  /* all your mobile device styles goes here */\n}\n```\n\n**yields**:\n\n```css\n@media only screen and (max-device-width: 340px) {\n  /* styles... */\n}\n```\n\n**Example 2 - min breakpoint**:\n\n```css\n:root {\n  breakpoint-desk: min 1000px;\n}\n\n@media desk {\n  /* all your desktop styles goes here */\n}\n```\n\n**yields**:\n\n```css\n@media only screen and (min-device-width: 1000px) {\n  /* styles... */\n}\n```\n\n**Example 2 - multiple breakpoints**:\n\n```css\n:root {\n  breakpoint-palm: max 340px;\n  breakpoint-tab: max 700px;\n  breakpoint-desk: min 1000px;\n  breakpoint-desk-wide: min 1200px;\n}\n\n@media palm {\n  /* all your palm device styles goes here */\n}\n@media tab {\n  /* all tablet styles */\n}\n@media tab-and-down {\n  /* styles for tablets and smaller devices */\n}\n@media tab-and-up {\n  /* styles for tablets and bigger screens */\n}\n@media desk-and-down {\n  /* styles for desktops and smaller devices */\n}\n@media desk-and-up {\n  /* styles for desktop and bigger screens */\n}\n@media desk-wide {\n  /* styles for big screens */\n}\n```\n\n**yields**:\n\n```css\n@media only screen and (max-device-width: 340px) {\n  /* styles... */\n}\n@media only screen and (min-device-width: 341px) and (max-device-width: 700px) {\n  /* all tablet styles */\n}\n@media only screen and (max-device-width: 700px) {\n  /* styles for tablets and smaller devices */\n}\n@media only screen and (min-device-width: 341px) {\n  /* styles for tablets and bigger screens */\n}\n@media only screen and (max-device-width: 1199px) {\n  /* styles for desktops and smaller devices */\n}\n@media only screen and (min-device-width: 1000px) {\n  /* styles for desktop and bigger screens */\n}\n@media only screen and (min-device-width: 1200px) {\n  /* styles for big screens */\n}\n```\n\n*You get the point...*\n\n## Unit tests\n\nMake sure the dev-dependencies are installed, and then run:\n\n```bash\nnpm test\n```\n\n## Contributing\n\n`klei-rework-plugins` uses the [Git Flow](http://nvie.com/posts/a-successful-git-branching-model/) branching model so make your pull requests to the `develop` branch.\n\n## License\n\nMIT\n","_attachments":{},"bugs":{"url":"https://github.com/klei-dev/rework-plugins/issues"},"license":"MIT"}