:bulb: example updates

10 files changed, 85 insertions, 196 deletions

diff --git a/examples/less/gulp/dest/main.css b/examples/less/gulp/dest/main.css
index 3cbc50c..28a98aa 100644
--- a/examples/less/gulp/dest/main.css
+++ b/examples/less/gulp/dest/main.css
@@ -2,10 +2,6 @@
 .selector-1 {
   background-color: red;
   width: 300px;
-}
-.selector-1,
-.disable-responsive-font-size .selector-1,
-.selector-1.disable-responsive-font-size {
   font-size: 2rem ;
 }
 @media (max-width: 1200px) {
@@ -14,9 +10,7 @@
   }
 }
 /* responsive-font-size property with `rem` unit */
-.selector-2,
-.disable-responsive-font-size .selector-2,
-.selector-2.disable-responsive-font-size {
+.selector-2 {
   font-size: 2rem ;
 }
 @media (max-width: 1200px) {
@@ -25,9 +19,7 @@
   }
 }
 /* responsive-font-size property with !important */
-.selector-3,
-.disable-responsive-font-size .selector-3,
-.selector-3.disable-responsive-font-size {
+.selector-3 {
   font-size: 2rem  !important;
 }
 @media (max-width: 1200px) {
@@ -36,9 +28,7 @@
   }
 }
 /* rfs shorthand */
-.selector-4,
-.disable-responsive-font-size .selector-4,
-.selector-4.disable-responsive-font-size {
+.selector-4 {
   font-size: 2rem ;
 }
 @media (max-width: 1200px) {
@@ -53,9 +43,7 @@
 }
 /* responsive-font-size property inside @support-query */
 @supports (display: flex) {
-  .selector-7,
-  .disable-responsive-font-size .selector-7,
-  .selector-7.disable-responsive-font-size {
+  .selector-7 {
     font-size: 1.75rem ;
   }
   @media (max-width: 1200px) {
diff --git a/examples/postcss/gulp/dest/main.css b/examples/postcss/gulp/dest/main.css
index 46e7d9f..0626ed7 100644
--- a/examples/postcss/gulp/dest/main.css
+++ b/examples/postcss/gulp/dest/main.css
@@ -2,10 +2,6 @@
 .selector-1 {
   background-color: red;
   width: 300px;
-}
-.selector-1,
-.disable-responsive-font-size .selector-1,
-.disable-responsive-font-size.selector-1 {
   font-size: 2rem;
 }
 @media (max-width: 1200px) {
@@ -16,10 +12,6 @@
 
 /* responsive-font-size property with `rem` unit */
 .selector-2 {
-}
-.selector-2,
-.disable-responsive-font-size .selector-2,
-.disable-responsive-font-size.selector-2 {
   font-size: 2rem;
 }
 @media (max-width: 1200px) {
@@ -30,10 +22,6 @@
 
 /* responsive-font-size property with !important */
 .selector-3 {
-}
-.selector-3,
-.disable-responsive-font-size .selector-3,
-.disable-responsive-font-size.selector-3 {
   font-size: 2rem !important;
 }
 @media (max-width: 1200px) {
@@ -44,10 +32,6 @@
 
 /* rfs shorthand */
 .selector-4 {
-}
-.selector-4,
-.disable-responsive-font-size .selector-4,
-.disable-responsive-font-size.selector-4 {
   font-size: 2rem;
 }
 @media (max-width: 1200px) {
@@ -69,10 +53,6 @@
 /* responsive-font-size property inside @support-query */
 @supports (display: flex) {
   .selector-7 {
-  }
-  .selector-7,
-.disable-responsive-font-size .selector-7,
-.disable-responsive-font-size.selector-7 {
     font-size: 1.75rem;
   }
   @media (max-width: 1200px) {
diff --git a/examples/postcss/gulp/gulpfile.js b/examples/postcss/gulp/gulpfile.js
index 4e5e41c..fa67284 100644
--- a/examples/postcss/gulp/gulpfile.js
+++ b/examples/postcss/gulp/gulpfile.js
@@ -8,6 +8,7 @@ const options = {
   breakpoint: 1200,
   breakpointUnit: 'px',
   factor: 5,
+  class: false,
   unitPrecision: 6,
   remValue: 16,
   propList: ['responsive-font-size', 'rfs']
diff --git a/examples/postcss/node/dest/main.css b/examples/postcss/node/dest/main.css
index 46e7d9f..0626ed7 100644
--- a/examples/postcss/node/dest/main.css
+++ b/examples/postcss/node/dest/main.css
@@ -2,10 +2,6 @@
 .selector-1 {
   background-color: red;
   width: 300px;
-}
-.selector-1,
-.disable-responsive-font-size .selector-1,
-.disable-responsive-font-size.selector-1 {
   font-size: 2rem;
 }
 @media (max-width: 1200px) {
@@ -16,10 +12,6 @@
 
 /* responsive-font-size property with `rem` unit */
 .selector-2 {
-}
-.selector-2,
-.disable-responsive-font-size .selector-2,
-.disable-responsive-font-size.selector-2 {
   font-size: 2rem;
 }
 @media (max-width: 1200px) {
@@ -30,10 +22,6 @@
 
 /* responsive-font-size property with !important */
 .selector-3 {
-}
-.selector-3,
-.disable-responsive-font-size .selector-3,
-.disable-responsive-font-size.selector-3 {
   font-size: 2rem !important;
 }
 @media (max-width: 1200px) {
@@ -44,10 +32,6 @@
 
 /* rfs shorthand */
 .selector-4 {
-}
-.selector-4,
-.disable-responsive-font-size .selector-4,
-.disable-responsive-font-size.selector-4 {
   font-size: 2rem;
 }
 @media (max-width: 1200px) {
@@ -69,10 +53,6 @@
 /* responsive-font-size property inside @support-query */
 @supports (display: flex) {
   .selector-7 {
-  }
-  .selector-7,
-.disable-responsive-font-size .selector-7,
-.disable-responsive-font-size.selector-7 {
     font-size: 1.75rem;
   }
   @media (max-width: 1200px) {
diff --git a/examples/sass/gulp/dest/main.css b/examples/sass/gulp/dest/main.css
index dd46c10..b2e6783 100644
--- a/examples/sass/gulp/dest/main.css
+++ b/examples/sass/gulp/dest/main.css
@@ -1,40 +1,32 @@
 /* responsive-font-size property with `px` unit */
 .selector-1 {
   background-color: red;
-  width: 300px; }
-  .selector-1,
-  .disable-responsive-font-size .selector-1, .selector-1.disable-responsive-font-size {
-    font-size: 2rem; }
+  width: 300px;
+  font-size: 2rem; }
   @media (max-width: 1200px) {
     .selector-1 {
       font-size: calc(1.2rem + 1.06667vw) ; } }
 
 /* responsive-font-size property with `rem` unit */
-.selector-2,
-.disable-responsive-font-size .selector-2, .selector-2.disable-responsive-font-size {
+.selector-2 {
   font-size: 2rem; }
-
-@media (max-width: 1200px) {
-  .selector-2 {
-    font-size: calc(1.2rem + 1.06667vw) ; } }
+  @media (max-width: 1200px) {
+    .selector-2 {
+      font-size: calc(1.2rem + 1.06667vw) ; } }
 
 /* responsive-font-size property with !important */
-.selector-3,
-.disable-responsive-font-size .selector-3, .selector-3.disable-responsive-font-size {
+.selector-3 {
   font-size: 2rem !important; }
-
-@media (max-width: 1200px) {
-  .selector-3 {
-    font-size: calc(1.2rem + 1.06667vw)  !important; } }
+  @media (max-width: 1200px) {
+    .selector-3 {
+      font-size: calc(1.2rem + 1.06667vw)  !important; } }
 
 /* rfs shorthand */
-.selector-4,
-.disable-responsive-font-size .selector-4, .selector-4.disable-responsive-font-size {
+.selector-4 {
   font-size: 2rem; }
-
-@media (max-width: 1200px) {
-  .selector-4 {
-    font-size: calc(1.2rem + 1.06667vw) ; } }
+  @media (max-width: 1200px) {
+    .selector-4 {
+      font-size: calc(1.2rem + 1.06667vw) ; } }
 
 /* not supported unit */
 .selector-5 {
@@ -46,9 +38,8 @@
 
 /* responsive-font-size property inside @support-query */
 @supports (display: flex) {
-  .selector-7,
-  .disable-responsive-font-size .selector-7, .selector-7.disable-responsive-font-size {
+  .selector-7 {
     font-size: 1.75rem; }
-  @media (max-width: 1200px) {
-    .selector-7 {
-      font-size: calc(1.15rem + 0.8vw) ; } } }
+    @media (max-width: 1200px) {
+      .selector-7 {
+        font-size: calc(1.15rem + 0.8vw) ; } } }
diff --git a/examples/sass/node/dest/main.css b/examples/sass/node/dest/main.css
index dd46c10..b2e6783 100644
--- a/examples/sass/node/dest/main.css
+++ b/examples/sass/node/dest/main.css
@@ -1,40 +1,32 @@
 /* responsive-font-size property with `px` unit */
 .selector-1 {
   background-color: red;
-  width: 300px; }
-  .selector-1,
-  .disable-responsive-font-size .selector-1, .selector-1.disable-responsive-font-size {
-    font-size: 2rem; }
+  width: 300px;
+  font-size: 2rem; }
   @media (max-width: 1200px) {
     .selector-1 {
       font-size: calc(1.2rem + 1.06667vw) ; } }
 
 /* responsive-font-size property with `rem` unit */
-.selector-2,
-.disable-responsive-font-size .selector-2, .selector-2.disable-responsive-font-size {
+.selector-2 {
   font-size: 2rem; }
-
-@media (max-width: 1200px) {
-  .selector-2 {
-    font-size: calc(1.2rem + 1.06667vw) ; } }
+  @media (max-width: 1200px) {
+    .selector-2 {
+      font-size: calc(1.2rem + 1.06667vw) ; } }
 
 /* responsive-font-size property with !important */
-.selector-3,
-.disable-responsive-font-size .selector-3, .selector-3.disable-responsive-font-size {
+.selector-3 {
   font-size: 2rem !important; }
-
-@media (max-width: 1200px) {
-  .selector-3 {
-    font-size: calc(1.2rem + 1.06667vw)  !important; } }
+  @media (max-width: 1200px) {
+    .selector-3 {
+      font-size: calc(1.2rem + 1.06667vw)  !important; } }
 
 /* rfs shorthand */
-.selector-4,
-.disable-responsive-font-size .selector-4, .selector-4.disable-responsive-font-size {
+.selector-4 {
   font-size: 2rem; }
-
-@media (max-width: 1200px) {
-  .selector-4 {
-    font-size: calc(1.2rem + 1.06667vw) ; } }
+  @media (max-width: 1200px) {
+    .selector-4 {
+      font-size: calc(1.2rem + 1.06667vw) ; } }
 
 /* not supported unit */
 .selector-5 {
@@ -46,9 +38,8 @@
 
 /* responsive-font-size property inside @support-query */
 @supports (display: flex) {
-  .selector-7,
-  .disable-responsive-font-size .selector-7, .selector-7.disable-responsive-font-size {
+  .selector-7 {
     font-size: 1.75rem; }
-  @media (max-width: 1200px) {
-    .selector-7 {
-      font-size: calc(1.15rem + 0.8vw) ; } } }
+    @media (max-width: 1200px) {
+      .selector-7 {
+        font-size: calc(1.15rem + 0.8vw) ; } } }
diff --git a/examples/scss/gulp/dest/main.css b/examples/scss/gulp/dest/main.css
index dd46c10..b2e6783 100644
--- a/examples/scss/gulp/dest/main.css
+++ b/examples/scss/gulp/dest/main.css
@@ -1,40 +1,32 @@
 /* responsive-font-size property with `px` unit */
 .selector-1 {
   background-color: red;
-  width: 300px; }
-  .selector-1,
-  .disable-responsive-font-size .selector-1, .selector-1.disable-responsive-font-size {
-    font-size: 2rem; }
+  width: 300px;
+  font-size: 2rem; }
   @media (max-width: 1200px) {
     .selector-1 {
       font-size: calc(1.2rem + 1.06667vw) ; } }
 
 /* responsive-font-size property with `rem` unit */
-.selector-2,
-.disable-responsive-font-size .selector-2, .selector-2.disable-responsive-font-size {
+.selector-2 {
   font-size: 2rem; }
-
-@media (max-width: 1200px) {
-  .selector-2 {
-    font-size: calc(1.2rem + 1.06667vw) ; } }
+  @media (max-width: 1200px) {
+    .selector-2 {
+      font-size: calc(1.2rem + 1.06667vw) ; } }
 
 /* responsive-font-size property with !important */
-.selector-3,
-.disable-responsive-font-size .selector-3, .selector-3.disable-responsive-font-size {
+.selector-3 {
   font-size: 2rem !important; }
-
-@media (max-width: 1200px) {
-  .selector-3 {
-    font-size: calc(1.2rem + 1.06667vw)  !important; } }
+  @media (max-width: 1200px) {
+    .selector-3 {
+      font-size: calc(1.2rem + 1.06667vw)  !important; } }
 
 /* rfs shorthand */
-.selector-4,
-.disable-responsive-font-size .selector-4, .selector-4.disable-responsive-font-size {
+.selector-4 {
   font-size: 2rem; }
-
-@media (max-width: 1200px) {
-  .selector-4 {
-    font-size: calc(1.2rem + 1.06667vw) ; } }
+  @media (max-width: 1200px) {
+    .selector-4 {
+      font-size: calc(1.2rem + 1.06667vw) ; } }
 
 /* not supported unit */
 .selector-5 {
@@ -46,9 +38,8 @@
 
 /* responsive-font-size property inside @support-query */
 @supports (display: flex) {
-  .selector-7,
-  .disable-responsive-font-size .selector-7, .selector-7.disable-responsive-font-size {
+  .selector-7 {
     font-size: 1.75rem; }
-  @media (max-width: 1200px) {
-    .selector-7 {
-      font-size: calc(1.15rem + 0.8vw) ; } } }
+    @media (max-width: 1200px) {
+      .selector-7 {
+        font-size: calc(1.15rem + 0.8vw) ; } } }
diff --git a/examples/scss/node/dest/main.css b/examples/scss/node/dest/main.css
index dd46c10..b2e6783 100644
--- a/examples/scss/node/dest/main.css
+++ b/examples/scss/node/dest/main.css
@@ -1,40 +1,32 @@
 /* responsive-font-size property with `px` unit */
 .selector-1 {
   background-color: red;
-  width: 300px; }
-  .selector-1,
-  .disable-responsive-font-size .selector-1, .selector-1.disable-responsive-font-size {
-    font-size: 2rem; }
+  width: 300px;
+  font-size: 2rem; }
   @media (max-width: 1200px) {
     .selector-1 {
       font-size: calc(1.2rem + 1.06667vw) ; } }
 
 /* responsive-font-size property with `rem` unit */
-.selector-2,
-.disable-responsive-font-size .selector-2, .selector-2.disable-responsive-font-size {
+.selector-2 {
   font-size: 2rem; }
-
-@media (max-width: 1200px) {
-  .selector-2 {
-    font-size: calc(1.2rem + 1.06667vw) ; } }
+  @media (max-width: 1200px) {
+    .selector-2 {
+      font-size: calc(1.2rem + 1.06667vw) ; } }
 
 /* responsive-font-size property with !important */
-.selector-3,
-.disable-responsive-font-size .selector-3, .selector-3.disable-responsive-font-size {
+.selector-3 {
   font-size: 2rem !important; }
-
-@media (max-width: 1200px) {
-  .selector-3 {
-    font-size: calc(1.2rem + 1.06667vw)  !important; } }
+  @media (max-width: 1200px) {
+    .selector-3 {
+      font-size: calc(1.2rem + 1.06667vw)  !important; } }
 
 /* rfs shorthand */
-.selector-4,
-.disable-responsive-font-size .selector-4, .selector-4.disable-responsive-font-size {
+.selector-4 {
   font-size: 2rem; }
-
-@media (max-width: 1200px) {
-  .selector-4 {
-    font-size: calc(1.2rem + 1.06667vw) ; } }
+  @media (max-width: 1200px) {
+    .selector-4 {
+      font-size: calc(1.2rem + 1.06667vw) ; } }
 
 /* not supported unit */
 .selector-5 {
@@ -46,9 +38,8 @@
 
 /* responsive-font-size property inside @support-query */
 @supports (display: flex) {
-  .selector-7,
-  .disable-responsive-font-size .selector-7, .selector-7.disable-responsive-font-size {
+  .selector-7 {
     font-size: 1.75rem; }
-  @media (max-width: 1200px) {
-    .selector-7 {
-      font-size: calc(1.15rem + 0.8vw) ; } } }
+    @media (max-width: 1200px) {
+      .selector-7 {
+        font-size: calc(1.15rem + 0.8vw) ; } } }
diff --git a/examples/stylus/gulp/dest/main.css b/examples/stylus/gulp/dest/main.css
index 07c6246..1693c70 100644
--- a/examples/stylus/gulp/dest/main.css
+++ b/examples/stylus/gulp/dest/main.css
@@ -2,10 +2,6 @@
 .selector-1 {
   background-color: #f00;
   width: 300px;
-}
-.selector-1,
-.disable-responsive-font-size .selector-1,
-.selector-1.disable-responsive-font-size {
   font-size: 2rem;
 }
 @media (max-width: 1200px) {
@@ -14,9 +10,7 @@
   }
 }
 /* responsive-font-size property with `rem` unit */
-.selector-2,
-.disable-responsive-font-size .selector-2,
-.selector-2.disable-responsive-font-size {
+.selector-2 {
   font-size: 2rem;
 }
 @media (max-width: 1200px) {
@@ -25,9 +19,7 @@
   }
 }
 /* responsive-font-size property with !important */
-.selector-3,
-.disable-responsive-font-size .selector-3,
-.selector-3.disable-responsive-font-size {
+.selector-3 {
   font-size: 2rem!important;
 }
 @media (max-width: 1200px) {
@@ -36,9 +28,7 @@
   }
 }
 /* rfs shorthand */
-.selector-4,
-.disable-responsive-font-size .selector-4,
-.selector-4.disable-responsive-font-size {
+.selector-4 {
   font-size: 2rem;
 }
 @media (max-width: 1200px) {
@@ -56,9 +46,7 @@
 }
 /* responsive-font-size property inside @support-query */
 @supports (display: flex) {
-  .selector-7,
-  .disable-responsive-font-size .selector-7,
-  .selector-7.disable-responsive-font-size {
+  .selector-7 {
     font-size: 1.75rem;
   }
 @media (max-width: 1200px) {
diff --git a/examples/stylus/node/dest/main.css b/examples/stylus/node/dest/main.css
index 07c6246..1693c70 100644
--- a/examples/stylus/node/dest/main.css
+++ b/examples/stylus/node/dest/main.css
@@ -2,10 +2,6 @@
 .selector-1 {
   background-color: #f00;
   width: 300px;
-}
-.selector-1,
-.disable-responsive-font-size .selector-1,
-.selector-1.disable-responsive-font-size {
   font-size: 2rem;
 }
 @media (max-width: 1200px) {
@@ -14,9 +10,7 @@
   }
 }
 /* responsive-font-size property with `rem` unit */
-.selector-2,
-.disable-responsive-font-size .selector-2,
-.selector-2.disable-responsive-font-size {
+.selector-2 {
   font-size: 2rem;
 }
 @media (max-width: 1200px) {
@@ -25,9 +19,7 @@
   }
 }
 /* responsive-font-size property with !important */
-.selector-3,
-.disable-responsive-font-size .selector-3,
-.selector-3.disable-responsive-font-size {
+.selector-3 {
   font-size: 2rem!important;
 }
 @media (max-width: 1200px) {
@@ -36,9 +28,7 @@
   }
 }
 /* rfs shorthand */
-.selector-4,
-.disable-responsive-font-size .selector-4,
-.selector-4.disable-responsive-font-size {
+.selector-4 {
   font-size: 2rem;
 }
 @media (max-width: 1200px) {
@@ -56,9 +46,7 @@
 }
 /* responsive-font-size property inside @support-query */
 @supports (display: flex) {
-  .selector-7,
-  .disable-responsive-font-size .selector-7,
-  .selector-7.disable-responsive-font-size {
+  .selector-7 {
     font-size: 1.75rem;
   }
 @media (max-width: 1200px) {