Comma-Separated Values - Githubissues

css-modules / postcss-icss-values

Pass arbitrary constants between your module files

MIT License

203 stars 18 forks source link

Open alexlafroscia opened 7 years ago

alexlafroscia commented 7 years ago

I'm seeing problems when trying to use an @value with a font-family definition. For example:

@value my-font-fam: 'Some-Custom-Font', Helvetica;

.foo {
  font-family: my-font-fam;
}

Results in:

.foo {
  font-family: 'Some-Custom-Font';
}

A longer @value definition, such as

@value my-font-fam: 'Some-Custom-Font', Helvetica, Arial, 'Lucida Granda', sans-serif;

results in the same output.

Possibly related to #68 (issues with comma-separated media queries) but I'm not sure.

alexlafroscia commented 7 years ago

I see that there's a test here verifying that they should be supported... I'm not sure why I'm running into problems here.

mndewitt commented 7 years ago

Appears to be an issue with the single quotes - I've been able use commas in media queries.

OliverJAsh commented 7 years ago

I've also just been hit by this. Is there any known work around?

TrySound commented 7 years ago

Well, guys. I can't reproduce this issue. Can you help with debugging?

OliverJAsh commented 7 years ago

My example is almost identical to the original post: using @value to store the font family value, which contains commas.

@value fontFamilyValue: foo, bar, baz

body {
  font-family: fontFamilyValue;
}

Result is:

body {
  font-family: foo;
}

I am reproducing this when using CSS Modules via css-loader’s modules option, if that has anything to do with it.