lightningcss icon indicating copy to clipboard operation
lightningcss copied to clipboard

Stripping quotes breaks font-family with double spaces

Open heypiotr opened this issue 3 months ago • 2 comments

We have CSS that defines a font face, which we we minify using Lightning CSS:

@font-face {
  font-family: "HW Impey  Bold";
  src: url("https://framerusercontent.com/assets/eHJXMAuuWuyUyN6atg5CoJTAWRo.woff2");
  font-display: block;
}

Note the double space after "Impey".

Then in another place, we have CSS that uses the font, which we don't minify:

h1 {
  font-family: "HW Impey  Bold", sans-serif;
}

The font-face rule gets minfied to font-family:HW Impey Bold, which seems to cause a mis-match and the font doesn't work:

https://codesandbox.io/p/sandbox/gg67sx https://gg67sx.csb.app/

Would it make sense to keep the quotes if the font-family includes multiple consecutive (white-)spaces?

heypiotr avatar Sep 17 '25 08:09 heypiotr

wow, that's quite an edge case. is this a real font? 😂

Would it make sense to keep the quotes if the font-family includes multiple consecutive (white-)spaces?

yeah I guess so. code is here if you want to take a crack at it: https://github.com/parcel-bundler/lightningcss/blob/9879b91986eaee08a4edc3550f7ada7dcc703aa9/src/properties/font.rs#L414-L441

devongovett avatar Sep 29 '25 16:09 devongovett

Have the same issue. Font names with spaces is pretty normal I guess.

wazum avatar Nov 21 '25 17:11 wazum