Support for every property (#144)

- Support for all properties
- Shorthand mixins for margins and paddings
- Support for custom properties
- Clearer way to declare `!important` rules: `@include rfs(1rem !important)` instead of `@include rfs(1rem, true)`
- Switched to mobile first approach, still possible to switch to the `max-width` media queries if needed
- Configuration variables are changed:
	- Base font size -> Base value
	- Font size unit -> Unit
- `responsive-font-size` property changed to `rfs()` function (see https://github.com/twbs/rfs/issues/116)
- Dropped `responsive-font-size` mixins
- Dropped Less 2 support since we had to work with lists
- Prevent generation of `/test/expected/main.css`
- Additional tests for new implementations
- Cleanup npm scripts examples
- Code examples in `README.md` are grouped by processor and collapsed

2 files changed, 95 insertions, 16 deletions

diff --git a/test/postcss/main.css b/test/postcss/main.css
index 1540a3b..2a1db4a 100644
--- a/test/postcss/main.css
+++ b/test/postcss/main.css
@@ -1,39 +1,115 @@
 .selector-1 {
   background-color: #f00;
   width: 300px;
-  responsive-font-size: 32px;
+  font-size: rfs(32px);
 }
 
 .selector-2 {
-  responsive-font-size: 2rem;
+  font-size: rfs(2rem);
 }
 
 .selector-3 {
-  responsive-font-size: 2rem !important;
+  font-size: rfs(2rem) !important;
 }
 
 .selector-4 {
-  rfs: 2rem;
+  font-size: rfs(2rem);
 }
 
 .selector-5 {
-  responsive-font-size: 2em;
+  font-size: rfs(2em);
 }
 
 .selector-6 {
-  responsive-font-size: inherit;
+  font-size: rfs(inherit);
 }
 
 @supports (display: flex) {
   .selector-7 {
-    rfs: 28px;
+    font-size: rfs(28px);
   }
 }
 
 .selector-8 {
-  responsive-font-size: 32;
+  flex: rfs(0 999 32rem);
 }
 
 .selector-9 {
-  responsive-font-size: 2rem;
+  padding: rfs(2rem);
+}
+
+.selector-10 {
+  padding: rfs(2rem);
+}
+
+.selector-11 {
+  padding-top: rfs(2rem);
+}
+
+.selector-12 {
+  padding-right: rfs(2rem);
+}
+
+.selector-13 {
+  padding-bottom: rfs(2rem);
+}
+
+.selector-14 {
+  padding-left: rfs(2rem);
+}
+
+.selector-15 {
+  margin: rfs(2rem);
+}
+
+.selector-16 {
+  margin-top: rfs(2rem);
+}
+
+.selector-17 {
+  margin-right: rfs(2rem);
+}
+
+.selector-18 {
+  margin-bottom: rfs(2rem);
+}
+
+.selector-19 {
+  margin-left: rfs(2rem);
+}
+
+.selector-20 {
+  margin: rfs(2rem 3rem);
+}
+
+.selector-21 {
+  margin: rfs(2rem 3rem) !important;
+}
+
+.selector-22 {
+  font-size: rfs(0);
+}
+
+.selector-23 {
+  margin: rfs(0 3rem);
+}
+
+.selector-24 {
+  box-shadow: rfs(0 0 2rem #f00, 0 0 3rem #0f0);
+}
+
+.selector-25 {
+  --value: rfs(3rem);
+}
+
+.selector-26 {
+  font-size: rfs(10px);
+}
+
+.selector-27 {
+  margin: rfs(-3rem);
+}
+
+.selector-28 {
+  margin: rfs(-.5rem);
 }
diff --git a/test/postcss/tests.js b/test/postcss/tests.js
index b5f03d6..304e747 100644
--- a/test/postcss/tests.js
+++ b/test/postcss/tests.js
@@ -3,7 +3,7 @@
 module.exports = {
   'test-1': {},
   'test-2': {
-    enableResponsiveFontSizes: false
+    enableRfs: false
   },
   'test-3': {
     class: 'disable'
@@ -15,17 +15,17 @@ module.exports = {
     breakpointUnit: 'em'
   },
   'test-6': {
-    baseFontSize: '17px'
+    baseValue: '17px'
   },
   'test-7': {
-    fontSizeUnit: 'px'
+    unit: 'px'
   },
   'test-8': {
     twoDimensional: true
   },
   'test-9': {
-    baseFontSize: '12px',
-    fontSizeUnit: 'px',
+    baseValue: '12px',
+    unit: 'px',
     breakpoint: 800,
     breakpointUnit: 'rem',
     twoDimensional: true,
@@ -34,13 +34,16 @@ module.exports = {
     safariIframeResizeBugFix: true
   },
   'test-10': { // Not testable
-    baseFontSize: '12px',
-    fontSizeUnit: 'px',
+    baseValue: '12px',
+    unit: 'px',
     breakpoint: 800,
     breakpointUnit: 'rem',
     twoDimensional: true,
     factor: 5,
     class: true,
     safariIframeResizeBugFix: true
+  },
+  'test-11': {
+    mode: 'max-media-query'
   }
 };