fix(postcss-colormin): preserve CSS variables

Fix #1120
cssnano · May 21, 2021 · 59d545b · 59d545b
1 parent 9684747
commit 59d545b
Show file tree

Hide file tree

Showing 2 changed files with 8 additions and 0 deletions.
diff --git a/packages/postcss-colormin/src/__tests__/index.js b/packages/postcss-colormin/src/__tests__/index.js
@@ -318,3 +318,8 @@ test(
   'should not attempt to convert variables',
   passthroughCSS(':root{--some-color: 200 255 0}')
 );
+
+test(
+  'should respect CSS variables',
+  passthroughCSS('div{background-color:rgba(51,153,255,var(--tw-bg-opacity))}')
+);
diff --git a/packages/postcss-colormin/src/colours.js b/packages/postcss-colormin/src/colours.js
@@ -5,6 +5,9 @@ import toShorthand from './lib/toShorthand';
 extend([namesPlugin]);
 
 export default (colour, isLegacy = false) => {
+  if (colour.includes('var(')) {
+    return colour;
+  }
   /* check that it is a valid CSS value
      https://www.w3.org/TR/css-color-4/#rgb-functions */
   if (getFormat(colour) === 'rgb') {