// default setting
.sa-scale {
  transform: scale(2);
}

.sa-scale.sa-animated.sa-animation {
  transform: scale(1);
}

// // element option separate X Y scale
// // sa-scale-x="15"
// // sa-scale-y="20"

.sa-scale {
  @for $i from 1 through 30 {
    &[sa-scale='#{$i * 0.1}'] {
      transform: scale(#{$i * 0.1});
    }

    &[sa-scale-x='#{$i * 0.1}'] {
      transform: scaleX(#{$i * 0.1});
    }

    &[sa-scale-y='#{$i * 0.1}'] {
      transform: scaleY(#{$i * 0.1});
    }
  }
}

// // element option both X Y scale
// // sa-scale-x="12" sa-scale-y="20"

@for $i from 1 through 30 {
  @for $j from 1 through 30 {
    .sa-scale[sa-scale-x='#{$i}'][sa-scale-y='#{$j}']:not(.sa-animated) {
      transform: scale(#{$i * 0.1}, #{$j * 0.1});
    }
  }
}