Add indeterminate-state in less

jscontrust · Nov 27, 2015 · e14cffc · e14cffc
1 parent e8c453d
commit e14cffc
Showing 1 changed file with 30 additions and 0 deletions.
diff --git a/awesome-bootstrap-checkbox.less b/awesome-bootstrap-checkbox.less
@@ -19,6 +19,19 @@
   }
 }
 
+.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;
@@ -72,6 +85,17 @@
       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;
 
@@ -98,6 +122,12 @@
 .checkbox-variant(checkbox-warning, @brand-warning);
 .checkbox-variant(checkbox-success, @brand-success);
 
+.checkbox-variant-indeterminate(checkbox-primary, @brand-primary);
+.checkbox-variant-indeterminate(checkbox-danger, @brand-danger);
+.checkbox-variant-indeterminate(checkbox-info, @brand-info);
+.checkbox-variant-indeterminate(checkbox-warning, @brand-warning);
+.checkbox-variant-indeterminate(checkbox-success, @brand-success);
+
 //
 // Radios
 // --------------------------------------------------