Nesting mixins
Opened this issue · 2 comments
Deleted user commented
I've got a mixin like this:
@define-mixin device-width $width {
@media only screen and (min-width: $width) {@mixin-content;}
}
The @mixin works, and when using normal css and variables in the @mixin-content it works fine, but if I try to use another mixin inside the @mixin-content such as this:
h1 {
@mixin font-size 1.5;
@mixin device-size $breakpoint__small {
@mixin font-size 2.5;
}
}
The CSS I get out of it is this:
h1 {
font-size: 24px;
font-size: 1.5rem;
}
@media only screen and (min-width: 768px) {
h1 {
@mixin font-size 2.5;
}
}
As you can see, the first time the mixin works fine, but not if within another mixin. Is this feature supported, or am I doing something wrong?
joshmobley commented
Confirmed - experiencing the same issue.
jonathantneal commented
The non-Sass-like @define-mixin
syntax has been dropped in v3 in favor of the Sass-like @mixin
syntax.