I am encountering an issue while attempting to interpolate values passed into a mixin.
positionModifier( key, x, y)
&.{key}
background-position: {x}px {y}px;
An error is being thrown, which is shown below:
351| positionModifier( key, x, y)
352| &.{key}
353| background-position: {x}px {y}px;
------------------------------------------------^
354|
355|
356| // positionModifier( recyclebin, 4, 86 );
expected ":", got "}"
The desired code output, as displayed on line 356, should be:
&.recyclebin { background-position: 4px 86px; }
I am transitioning from using SASS for CSS compilation and decided to give Stylus a try. This mixin functions correctly in SASS.
SASS version:
@mixin positionModifier( $key, $x, $y) {
&.#{$key} {
background-position: #{$x}px #{$y}px;
}
}