MetaPhase-Consulting/State-TalentMAP

View on GitHub
src/sass/_checkbox.scss

Summary

Maintainability
Test Coverage
.tm-checkbox-small {
  [type=checkbox] + label::before,
  [type=radio] + label::before {
    $size: 13px;
    background-size: 100%;
    height: $size;
    line-height: $size;
    width: $size;
  }
}

.tm-checkbox-transparent {
  [type=checkbox]:not(:checked) + label::before,
  [type=radio]:not(:checked) + label::before {
    background-color: transparent;
  }

  [disabled]:checked + label::before {
    background-image: url('#{$asset-path}assets/img/check-gray.svg');
    background-size: 2em;
  }
}

.tm-checkbox-disabled-alternate {
  * {
    cursor: initial;
  }

  label {
    cursor: initial;

    > span {
      color: initial;
    }
  }

  [type=checkbox]:disabled + label::before,
  [type=radio]:disabled + label::before {
    background: transparent;
    box-shadow: initial;
  }

  [disabled]:checked + label::before {
    background-color: $color-white;
    background-image: url('#{$asset-path}assets/img/check-black.svg');
    background-size: 1em;
    border-color: initial;
    box-shadow: initial;
    cursor: initial;
  }
}