postcss / postcss-custom-properties

Use Custom Properties in CSS
https://postcss.github.io/postcss-custom-properties
MIT License
597 stars 77 forks source link

Doesn't convert variable with postcss mixin #230

Closed movie4 closed 2 years ago

movie4 commented 3 years ago

Hello! In new versions: postcss-custom-properties 10.0.0 and postcss-mixins 7.0.

I have mixin like below:

@define-mixin font $weight, $minFont, $maxFont, $minLine, $maxLine, $family {
  font-size: responsive $minFont $maxFont;
  font-range: var(--min-max);
  font-weight: $weight;
  font-family: $family;
  line-height: responsive $minLine $maxLine;
  line-height-range: var(--min-max);
}

and var like:

:root {
  --font: 'Arial', helvetica, sans-serif;
  --min-max: 320px 2560px;
}

in css file - use

@mixin font normal, 14px, 24px, 20px, 24px, var(--font);

output:

  font-size: responsive 14px 24px;
  font-range: 320px 2560px;
  font-weight: normal;
  font-family: var(--font); <------ Not Converted
  line-height: responsive 20px 24px;
  line-height-range: 320px 2560px;