{"_id":"rework-custom-media","_rev":"4539090","name":"rework-custom-media","description":"W3C-style custom media queries for Rework","dist-tags":{"latest":"0.2.0"},"maintainers":[{"name":"necolas","email":"nicolasgallagher@gmail.com"}],"time":{"modified":"2026-04-09T15:07:27.000Z","created":"2014-06-20T00:40:23.419Z","0.2.0":"2014-09-05T23:16:53.481Z","0.1.1":"2014-06-22T01:38:37.132Z","0.1.0":"2014-06-20T00:40:23.419Z"},"users":{},"repository":{"type":"git","url":"https://github.com/reworkcss/rework-custom-media.git"},"versions":{"0.2.0":{"name":"rework-custom-media","version":"0.2.0","description":"W3C-style custom media queries for Rework","files":["index.js"],"devDependencies":{"mocha":"^1.21.0","rework":"^1.0.0"},"scripts":{"test":"mocha --no-colors","test-watch":"mocha --slow 30 --reporter spec --watch"},"keywords":["css","custom-media","rework","media-queries","media-query","preprocessor","rework-plugin"],"license":"MIT","repository":{"type":"git","url":"https://github.com/reworkcss/rework-custom-media.git"},"bugs":{"url":"https://github.com/reworkcss/rework-custom-media/issues"},"homepage":"https://github.com/reworkcss/rework-custom-media","_id":"rework-custom-media@0.2.0","dist":{"shasum":"fd42516377350c4229d6a5fd7f66032d1f3d16e7","size":1764,"noattachment":false,"key":"/rework-custom-media/-/rework-custom-media-0.2.0.tgz","tarball":"http://registry.cnpm.dingdandao.com/rework-custom-media/download/rework-custom-media-0.2.0.tgz"},"_from":".","_npmVersion":"1.4.3","_npmUser":{"name":"necolas","email":"nicolasgallagher@gmail.com"},"maintainers":[{"name":"necolas","email":"nicolasgallagher@gmail.com"}],"directories":{},"publish_time":1409959013481,"_hasShrinkwrap":false,"_cnpm_publish_time":1409959013481,"_cnpmcore_publish_time":"2021-12-18T19:39:21.739Z"},"0.1.1":{"name":"rework-custom-media","version":"0.1.1","description":"W3C-style custom media queries for Rework","files":["index.js"],"devDependencies":{"mocha":"~1.14.0","rework":"^1.0.0"},"scripts":{"test":"mocha --no-colors","test-watch":"mocha --slow 30 --reporter spec --watch"},"keywords":["css","custom-media","rework","media-queries","media-query","preprocessor","rework-plugin"],"license":"MIT","repository":{"type":"git","url":"https://github.com/reworkcss/rework-custom-media.git"},"bugs":{"url":"https://github.com/reworkcss/rework-custom-media/issues"},"homepage":"https://github.com/reworkcss/rework-custom-media","_id":"rework-custom-media@0.1.1","dist":{"shasum":"b6b2b3d70bd960b819d323b075da2b6f18c27f39","size":1627,"noattachment":false,"key":"/rework-custom-media/-/rework-custom-media-0.1.1.tgz","tarball":"http://registry.cnpm.dingdandao.com/rework-custom-media/download/rework-custom-media-0.1.1.tgz"},"_from":".","_npmVersion":"1.4.3","_npmUser":{"name":"necolas","email":"nicolasgallagher@gmail.com"},"maintainers":[{"name":"necolas","email":"nicolasgallagher@gmail.com"}],"directories":{},"publish_time":1403401117132,"_hasShrinkwrap":false,"_cnpm_publish_time":1403401117132,"_cnpmcore_publish_time":"2021-12-18T19:39:21.976Z"},"0.1.0":{"name":"rework-custom-media","version":"0.1.0","description":"W3C-style custom media queries for Rework","files":["index.js"],"devDependencies":{"mocha":"~1.14.0","rework":"^1.0.0"},"scripts":{"test":"mocha --no-colors","test-watch":"mocha --slow 30 --reporter spec --watch"},"keywords":["css","custom-media","rework","media-queries","media-query","preprocessor","rework-plugin"],"license":"MIT","repository":{"type":"git","url":"https://github.com/reworkcss/rework-vars.git"},"bugs":{"url":"https://github.com/reworkcss/rework-vars/issues"},"homepage":"https://github.com/reworkcss/rework-vars","_id":"rework-custom-media@0.1.0","dist":{"shasum":"886fe8c3824fe093cee7073980deca3be74ee408","size":1605,"noattachment":false,"key":"/rework-custom-media/-/rework-custom-media-0.1.0.tgz","tarball":"http://registry.cnpm.dingdandao.com/rework-custom-media/download/rework-custom-media-0.1.0.tgz"},"_from":".","_npmVersion":"1.4.3","_npmUser":{"name":"necolas","email":"nicolasgallagher@gmail.com"},"maintainers":[{"name":"necolas","email":"nicolasgallagher@gmail.com"}],"directories":{},"publish_time":1403224823419,"_hasShrinkwrap":false,"_cnpm_publish_time":1403224823419,"_cnpmcore_publish_time":"2021-12-18T19:39:22.242Z"}},"readme":"# rework-custom-media [![Build Status](https://travis-ci.org/reworkcss/rework-custom-media.png)](https://travis-ci.org/reworkcss/rework-custom-media)\n\nA [Rework](https://github.com/reworkcss/rework) (`>=1.0.0`) plugin to add support for the\n[W3C-style CSS Custom Media Queries](http://dev.w3.org/csswg/mediaqueries/#custom-mq) syntax.\n\n## Installation\n\n```\nnpm install rework-custom-media\n```\n\n## Use\n\nAs a Rework plugin:\n\n```js\n// dependencies\nvar fs = require('fs');\nvar rework = require('rework');\nvar media = require('rework-custom-media');\n\n// css to be processed\nvar css = fs.readFileSync('build/build.css', 'utf8').toString();\n\n// process css using rework-custom-media\ncss = rework(css).use(media()).toString();\n```\n\n## Options\n\n### map\n\nOptionally, you may define the `<media-query-list>` for each `<extension-name>`\nin a JavaScript object that is passed to the function.\n\n```js\nvar options = {\n  map: {\n    '--wide-screen': 'screen and (min-width:900px)'\n  }\n}\n\nvar out = rework(css).use(media(options)).toString();\n```\n\n## CSS syntax\n\nA custom media query is defined with the `@custom-media` rule. Its scope is\nglobal.\n\n```css\n@custom-media <extension-name> <media-query-list>;\n```\n\nThis defines that the custom media query named by the `<extension-name>`\nrepresents the given `<media-query-list>`.\n\nThe `<extension-name>` can then be used in a media feature. The alias must be\nwrapped in parentheses.\n\n```css\n@custom-media --narrow-window screen and (max-width: 30em);\n\n@media (--narrow-window) {\n  /* narrow window styles */\n}\n```\n\nIf an undefined `<extension-name>` is used by a media feature, the media\nfeature will be stripped from the output, and a warning will be logged to the\nconsole.\n\n## License\n\nMIT\n","_attachments":{},"homepage":"https://github.com/reworkcss/rework-custom-media","bugs":{"url":"https://github.com/reworkcss/rework-custom-media/issues"},"license":"MIT"}