<===> input.scss
div {
color: #181818;
}
@-webkit-keyframes uiDelayedFadeIn {
0% { opacity: 0; }
50% { opacity: .5; }
100% { opacity: 1; }
}
@-webkit-keyframes bounce {
from {
left: 0px;
}
to {
left: 200px;
}
}
$name: bounce;
@-webkit-keyframes #{$name} {
blah: blee;
}
@mixin fudge() {
@content;
}
foo {
@include fudge() {
div {
color: red;
}
}
}
<===> output.css
div {
color: #181818;
}
@-webkit-keyframes uiDelayedFadeIn {
0% {
opacity: 0;
}
50% {
opacity: .5;
}
100% {
opacity: 1;
}
}
@-webkit-keyframes bounce {
from {
left: 0px;
}
to {
left: 200px;
}
}
@-webkit-keyframes bounce {
blah: blee;
}
foo div {
color: red;
}
<===> output-dart-sass.css
div {
color: #181818;
}
@-webkit-keyframes uiDelayedFadeIn {
0% {
opacity: 0;
}
50% {
opacity: 0.5;
}
100% {
opacity: 1;
}
}
@-webkit-keyframes bounce {
from {
left: 0px;
}
to {
left: 200px;
}
}
@-webkit-keyframes bounce {
blah: blee;
}
foo div {
color: red;
}