jantimon / next-yak

🦀 Zero-runtime CSS-in-JS powered by Rust. Write styled-components syntax, get build-time CSS extraction and full RSC compatibility
https://yak.js.org
139 stars 4 forks source link

inline negative numbers #192

Closed jantimon closed 1 month ago

jantimon commented 1 month ago

currently negative numbers in styled components were being converted to CSS variables and evaluated at runtime, even though they are constant values

This PR fixes this by inlining negative numbers directly into the CSS output

For example:

const Button = styled.button`
  margin-top: ${-1}px;
`;

Now correctly outputs:

.Button_xyz {
  margin-top: -1px;
}

Instead of using CSS variables and runtime evaluation

Fixes #191