Apologies for the unconventional terminology in the query, but I am struggling to find better words to describe it. Hopefully, this example will clarify my intention:
scss-syntax
.my-smug-selector {
@include my-smug-mixin(30px);
}
desired css-output
.my-smug-selector{
// some styles
}
.another-smug-selector-on-base-lvl{
// some other styles
}
.smug-non-nested-selector{
// some other styles
}
This concept intrigues me in general, but let me elaborate on why I am interested in exploring this: I aim to define a keyframe animation that is applied to the specified selector, for instance:
scss-syntax
.my-smug-selector {
@include my-smug-mixin($vars);
}
desired css-output
.my-smug-selector{
animation: most-smugish-animation 5s;
}
@keyframes most-smugish-animation {
from {background:red;}
to {background:yellow;}
}