How to convert n-th child to a mixin

Question

In scss, I have a code as below. I will like to convert that to a mixin with parameters passed for rotate and skew degrees... May somehow help me in converting this to a mixin?

    &:first-child {
      @include transform(rotate(0deg) skew(60deg));
    }

    &:nth-child(2) {
      @include transform(rotate(30deg) skew(60deg));
    }

    &:nth-child(3) {
      @include transform(rotate(60deg) skew(60deg));
    }

    &:nth-child(4) {
      @include transform(rotate(90deg) skew(60deg));
    }

    &:nth-child(5) {
      @include transform(rotate(120deg) skew(60deg));
    }

    &:nth-child(6) {
      @include transform(rotate(150deg) skew(60deg));
    }

I thought of doing like below. However, it does not seem to be working

   @include widget-angle(n);

and the mixin

@mixin widget-angle($num) {
  &:nth-child(#{$num}n) {
    @include transform(rotate((30 *(#{$num}n-1)) deg) skew(60deg));
  }
}

Answer 1

You have a mistake here: (30 *(#{$num}n-1), you have to remove the n and don't use interpolation if you are operating with numbers, leave a space before and after the subtraction sign:

  @include transform(rotate((30 *($num - 1))deg) skew(60deg));