@mixin on-circle($item-count, $circle-size, $item-size) {
position: relative;
width: $circle-size;
height: $circle-size;
padding: 0;
border-radius: 50%;
list-style: none;
> * {
display: block;
position: absolute;
top: 50%;
left: 50%;
width: $item-size;
height: $item-size;
margin: -($item-size / 2);
$angle: (360 / $item-count);
$rot: 0;
@for $i from 1 through $item-count {
&:nth-of-type(#{$i}) {
transform:
rotate($rot * 1deg)
translate($circle-size / 2)
rotate($rot * -1deg);
}
$rot: $rot + $angle;
}
}
}