.checkbox input[type="checkbox"]:checked + label::after {
font-size: 18px;
padding-top: 0px;
- font-family: 'Font Awesome 5 Free 400';
+ font-family: 'Font Awesome 5 Free';
+ /* change the font - uses the filled one */
font-weight: 900;
color: #5cb85c;
content: "\f14a";
.checkbox input[type="checkbox"]:disabled + label {
opacity: 0.65;
}
-.checkbox input[type="checkbox"]:disabled + label::before {
- background-color: #eeeeee;
+.checkbox input[type="checkbox"]:disabled + label::after {
+ color: #eeeeee;
cursor: not-allowed;
}
.checkbox.checkbox-circle label::before {
border-radius: 50%;
}
-.checkbox-primary input[type="checkbox"]:checked + label::before {
- background-color: #337ab7;
- border-color: #337ab7;
-}
.checkbox-primary input[type="checkbox"]:checked + label::after {
- color: #ffffff;
-}
-.checkbox-danger input[type="checkbox"]:checked + label::before {
- background-color: #d9534f;
- border-color: #d9534f;
+ color: #337ab7;
}
.checkbox-danger input[type="checkbox"]:checked + label::after {
- color: #ffffff;
-}
-.checkbox-info input[type="checkbox"]:checked + label::before {
- background-color: #5bc0de;
- border-color: #5bc0de;
+ color: #d9534f;
}
.checkbox-info input[type="checkbox"]:checked + label::after {
- color: #ffffff;
-}
-.checkbox-warning input[type="checkbox"]:checked + label::before {
- background-color: #f0ad4e;
- border-color: #f0ad4e;
+ color: #5bc0de;
}
.checkbox-warning input[type="checkbox"]:checked + label::after {
- color: #ffffff;
-}
-.checkbox-success input[type="checkbox"]:checked + label::before {
- background-color: #5cb85c;
- border-color: #5cb85c;
+ color: #f0ad4e;
}
.checkbox-success input[type="checkbox"]:checked + label::after {
- color: #ffffff;
+ color: #5cb85c;
}
/* before is the outer cicle */
/* after is the inner circle.. */