Use real LESS power by factorizing the rzslider element.

src/rzslider.less

@@ -6,7 +6,6 @@
  *
  * Licensed under the MIT license
  */
-
 @import 'variables.less';
 
 rzslider {
@@ -29,21 +28,19 @@ rzslider {
       background-color: @handleDisabledColor;
     }
   }
-}
 
-rzslider span {
+  span {
     white-space: nowrap;
     position: absolute;
     display: inline-block;
-}
 
-rzslider span.rz-base {
+    &.rz-base {
       width: 100%;
       height: 100%;
       padding: 0;
-}
+    }
 
-rzslider span.rz-bar-wrapper {
+    &.rz-bar-wrapper {
       left: 0;
       box-sizing: border-box;
       margin-top: -@handleSize / 2;
@@ -51,24 +48,24 @@ rzslider span.rz-bar-wrapper {
       width: 100%;
       height: @handleSize;
       z-index: 1;
-}
+    }
 
-rzslider span.rz-bar {
+    &.rz-bar {
       left: 0;
       width: 100%;
       height: @barHeight;
       z-index: 1;
       background: @barNormalColor;
       .rounded(@barHeight/2);
-}
+    }
 
-rzslider span.rz-bar.rz-selection {
+    &.rz-bar.rz-selection {
       z-index: 2;
       background: @barFillColor;
       .rounded(@barHeight/2);
-}
+    }
 
-rzslider span.rz-pointer {
+    &.rz-pointer {
       cursor: pointer;
       width: @handleSize;
       height: @handleSize;
@@ -80,9 +77,9 @@ rzslider span.rz-pointer {
       //  -moz-transition:all linear 0.15s;
       //  -o-transition:all linear 0.15s;
       //  transition:all linear 0.15s;
-}
+    }
 
-rzslider span.rz-pointer:after {
+    &.rz-pointer:after {
       content: '';
       width: @handlePointerSize;
       height: @handlePointerSize;
@@ -91,32 +88,33 @@ rzslider span.rz-pointer:after {
       left: @handleSize/2 - @handlePointerSize/2;
       .rounded(@handlePointerSize/2);
       background: @handleInnerColor;
-}
+    }
 
-rzslider span.rz-pointer:hover:after {
+    &.rz-pointer:hover:after {
       background-color: @handleHoverColor;
-}
+    }
 
-rzslider span.rz-pointer.rz-active:after {
+    &.rz-pointer.rz-active:after {
       background-color: @handleActiveColor;
-}
+    }
 
-rzslider span.rz-bubble {
+    &.rz-bubble {
       cursor: default;
       bottom: @handleSize/2;
       padding: @bubblePadding;
       color: @labelTextColor;
-}
+    }
 
-rzslider span.rz-bubble.rz-selection {
+    &.rz-bubble.rz-selection {
       top: @handleSize/2;
-}
+    }
 
-rzslider span.rz-bubble.rz-limit {
+    &.rz-bubble.rz-limit {
       color: @limitLabelTextColor;
-}
+    }
+  }
 
-rzslider .rz-ticks {
+  .rz-ticks {
     box-sizing: border-box;
     width: 100%;
     position: absolute;
@@ -145,4 +143,5 @@ rzslider .rz-ticks {
         transform: translate(-50%, 0);
       }
     }
+  }
 }
\ No newline at end of file