Variables fail when used in font declaration

[tohuw]

I want this:

:root {
    --fontFamilyPrimary: Metropolis;
    --fontSizePrimary: 18px;
    --lineHeightPrimary: 1.5;
}

body {
    font: var(--fontSizePrimary)/var(--lineHeightPrimary) var(--fontFamilyPrimary);
}

But when compiling I receive:

{ CssSyntaxError: /Users/rscottadams/Projects/tohuwnet/themes/anew/build/css/anew/base.css:2:3: Font declaration is invalid.

However, if I substitute the value for font size and line height like so:

body {
    font: 18px/1.5 var(--fontFamilyPrimary);
}

It works fine. Why is this the case?

[jonathantneal]

This is likely coming from another tool and not this plugin. I just tested the following:

Source CSS:

:root {
  --fontFamilyPrimary: Metropolis;
  --fontSizePrimary: 18px;
  --lineHeightPrimary: 1.5;
}

body {
  font: var(--fontSizePrimary)/var(--lineHeightPrimary) var(--fontFamilyPrimary);
}

Result CSS:

body {
  font: 18px/1.5 Metropolis;
}