Add indeterminate-state in sass

Author: DimaSavchenko

awesome-bootstrap-checkbox.scss

@@ -20,6 +20,20 @@ $check-icon: $fa-var-check !default;
   }
 }
 
+@mixin checkbox-variant-indeterminate($parent, $color) {
+  #{$parent} input[type="checkbox"]:indeterminate + label,
+  #{$parent} input[type="radio"]:indeterminate + label {
+    &::before {
+      background-color: $color;
+      border-color: $color;
+    }
+    &::after{
+      background-color: #fff;
+    }
+  }
+}
+
+
 
 .checkbox{
   padding-left: 20px;
@@ -73,6 +87,17 @@ $check-icon: $fa-var-check !default;
       content: $check-icon;
     }
 
+    &:indeterminate + label::after{
+      display: block;
+      content: "";
+      width: 10px;
+      height: 3px;
+      background-color: #555555;
+      border-radius: 2px;
+      margin-left: -16.5px;
+      margin-top: 7px;
+    }
+
     &:disabled + label{
       opacity: 0.65;
 
@@ -99,6 +124,13 @@ $check-icon: $fa-var-check !default;
 @include checkbox-variant('.checkbox-warning', $brand-warning);
 @include checkbox-variant('.checkbox-success', $brand-success);
 
+
+@include checkbox-variant-indeterminate('.checkbox-primary', $brand-primary);
+@include checkbox-variant-indeterminate('.checkbox-danger', $brand-danger);
+@include checkbox-variant-indeterminate('.checkbox-info', $brand-info);
+@include checkbox-variant-indeterminate('.checkbox-warning', $brand-warning);
+@include checkbox-variant-indeterminate('.checkbox-success', $brand-success);
+
 //
 // Radios
 // --------------------------------------------------