Generated by SassMeister.com.
<div class="icon"></div>
Invalid CSS after "...ckground-image(": expected ")", was "@if $checked {"
// ----
// Sass (v3.3.0.rc.1)
// Compass (v0.13.alpha.10)
// ----
@import "compass";
$color-white: #fff;
$cascading-preference-color: rgba($color-white, 0.6);
$bg-image: (url('/images/form.checkbox-check.svg'));
$bg-pattern: (
linear-gradient(
135deg,
transparent 20%,
$cascading-preference-color 20%,
$cascading-preference-color 40%,
transparent 40%,
transparent 70%,
$cascading-preference-color 70%,
$cascading-preference-color 90%,
transparent 90%
)
);
@mixin cascading-preference($checked:false) {
@include background-image(
@if $checked {
$bg-pattern
} else {
append($bg-image, $bg-pattern, comma);
}
)
}
.icon {
@include cascading-preference();
height: 100px;
width: 100px;
border: 1px solid blue;
}
<div class="icon"></div>