rework - npm Package Compare versions

Comparing version 0.7.0 to 0.8.0

component.json

 {
   "name": "rework",
-  "version": "0.5.1",
+  "version": "0.8.0",
   "description": "CSS manipulations built on CSSOM",
   "keywords": ["css", "manipulation", "preprocess", "transform"],
   "dependencies": {
-    "visionmedia/node-css": "1.0.4",
+    "visionmedia/css": "1.0.7",
     "component/path": "*"
@@ -14,2 +14,5 @@ },
     "lib/utils.js",
+    "lib/plugins/url.js",
+    "lib/plugins/vars.js",
+    "lib/plugins/ease.js",
     "lib/plugins/at2x.js",
@@ -20,4 +23,5 @@ "lib/plugins/keyframes.js",
     "lib/plugins/prefix-value.js",
+    "lib/plugins/media.js",
     "lib/plugins/prefix.js"
   ]
 }

History.md

 
+0.8.0 / 2012-11-21 
+==================
+
+  * add media macros. Closes #10
+  * add background-size: contain to at2x
+
 0.7.0 / 2012-10-10 
@@ -3,0 +9,0 @@ ==================

lib/plugins/at2x.js

@@ -25,3 +25,4 @@
  *     .logo {
- *       background-image: url("/public/images/[e-mail]")
+ *       background-image: url("/public/images/[e-mail]");
+ *       background-size: contain
  *     }
@@ -63,2 +64,6 @@ *   }
                   value: 'url("' + url + '")'
+                },
+                {
+                  property: 'background-size',
+                  value: 'contain'
                 }
@@ -65,0 +70,0 @@ ]

lib/rework.js

@@ -81,2 +81,3 @@
 
+exports.media = require('./plugins/media');
 exports.prefix = require('./plugins/prefix');
@@ -83,0 +84,0 @@ exports.prefixValue = require('./plugins/prefix-value');

package.json

 {
   "name": "rework",
-  "version": "0.7.0",
+  "version": "0.8.0",
   "description": "CSS manipulations built on CSSOM",
@@ -11,3 +11,3 @@ "keywords": ["css", "manipulation", "preprocess", "transform"],
   "dependencies": {
-    "css": "1.0.5",
+    "css": "1.0.7",
     "commander": "1.0.4"
@@ -14,0 +14,0 @@ },

Readme.md

 # rework
 
-  CSS manipulations built on [node-css](//github.com/visionmedia/node-css),
+  CSS manipulations built on [css](//github.com/visionmedia/css),
   allowing you to automate vendor prefixing, create your own properties,
-  inline images, anything you can imagine!
+  inline images, anything you can imagine! Also works in the browser as
+  a [component](https://github.com/component/component).
 
@@ -19,3 +20,3 @@ ## Installation
 
-```js
+```
 
@@ -29,2 +30,4 @@ Usage: rework [options]
   -v, --vendors <list>  specify list of vendors
+  -e, --ease            add additional easing functions
+  --vars                add css variable support
 
@@ -66,2 +69,56 @@ ```
 
+  - [media macros](#mediaobj) — define your own __@media__ queries
+  - [ease](#ease) — several additional easing functions
+  - [at2x](#at2xvendors) — serve high resolution images
+  - [prefix](#prefixpropertyproperties-vendors) — add vendor prefixes to properties
+  - [prefixValue](#prefixvaluevalue-vendors) — add vendor prefixes to values
+  - [prefixSelectors](#prefixselectorsstring) — add prefixes to selectors
+  - [opacity](#opacity) — add IE opacity support
+  - [url](#urlcallback) — rewrite `url()`s with a callback function
+  - [vars](#vars) — add css variable support
+  - [keyframes](#keyframesvendors) — add __@keyframe__ vendor prefixing
+
+### .media(obj)
+
+  Define media macros with the given `obj`.
+
+  For example define two contrived custom media types, "phone" and "phone-landscape":
+
+```js
+style.use(rework.media({
+  'phone': 'only screen and (min-device-width : 320px) and (max-device-width : 480px)',
+  'phone-landscape': '@media only screen and (min-width : 321px)'
+}))
+```
+
+```css
+@media phone {
+  body {
+    background: 'green'
+  }
+}
+
+@media phone-landscape {
+  body {
+    background: 'red'
+  }
+}
+```
+
+yields:
+
+```css
+@media only screen and (min-device-width : 320px) and (max-device-width : 480px) {
+  body {
+    background: 'green'
+  }
+}
+
+@media @media only screen and (min-width : 321px) {
+  body {
+    background: 'red'
+  }
+}
+```
+
 ### .ease()
@@ -68,0 +125,0 @@

No alert changes

Improved metrics

Total package byte prevSize

31366

increased by8.62%

Number of package files

20

increased by5.26%

Lines of code

615

increased by6.03%

Number of lines in readme file

568

increased by11.15%

Dependency changes

• + Addedcss@1.0.7(transitive)

• + Addedcss-stringify@1.0.4(transitive)

• - Removedcss@1.0.5(transitive)

• - Removedcss-stringify@1.0.3(transitive)

• Updatedcss@1.0.7