@mixin circleScaleAnimation($color, $state) {
  &:before {
    content: " ";
    position: absolute;
    width: 1px;
    height: 1px;
    top: 50%;
    left: 50%;
    transition: all 200ms ease-in;
    -moz-transition: all 200ms ease-in;
    -webkit-transition: all 200ms ease-in;
    background-color: $color;
    border-radius: 100%;
    transform: scale(0);
  }
  &#{$state}:not([disabled]) {
    &:before {
      width: 300px;
      height: 300px;
      margin-top: -150px;
      margin-left: -150px;
      border-radius: 2px;
      transform: scale(1);
    }
  }
}