Fix bug precompiling a CSS file that contains a min() expression

When I run `bin/deploy:precompile` on the previous version, I get an
error from libsass that `vw` and `vh` are incompatible units. I don't
get this error in development, only when compiling for production.

My inference is:
1. For the production build, Sass is trying to preprocess even non-SASS
   files, maybe to help minify them?
2. In Sass, their `min()` existed before CSS's `min()`, so it's
   treating it Like That, and returning a reasonable-in-some-cases-but-
   not-here error that `min(100vw, 100vh)` can't be *precomputed*.

Anyway, wrapping it in `calc()` isn't a *problem*, and helps the Sass
compiler not try to precompute it, so. Okay!
https://github.com/sass/node-sass/issues/2815#issuecomment-575926329
This commit is contained in:
Emi Matchu 2024-09-06 11:00:49 -07:00
parent 6f08abc3aa
commit 30eced448d

View file

@ -4,6 +4,9 @@
position: absolute;
left: 0;
top: 0;
width: min(100vw, 100vh);
height: min(100vw, 100vh);
/* HACK: `calc` isn't needed, but works around a bug in our asset pipeline,
* where libsass is trying to preprocess it. (We're not SASS tho?) */
width: calc(min(100vw, 100vh));
height: calc(min(100vw, 100vh));
}