v0.6.0
postcss-nesting
is now more strictly following the CSS nesting spec, which means certain syntaxes would break. To work around this, ecsstatic will run postcss-nested
after postcss-nesting
, thus allowing these nonconformant syntaxes to continue to work like they would in Sass.
const foo = css`
animation: blinky 2s;
/* nesting elements like this is not allowed in the spec, but will work in ecsstatic */
span {
color: hotpink;
}
/* same with @keyframes and @font-face */
@keyframes blinky {
0%, 100% { opacity: 1; }
50% { opacity: 0.5; }
}
`;
This behavior should be more predictable during the transition period, as official nesting starts making its way into all browsers and developers start getting used to it.
For more details, see #12