Add variable fallback to fix Chrome issue

Author: thecrypticace

src/util/removeAlphaVariables.js

@@ -18,6 +18,8 @@ export function removeAlphaVariables(container, toRemove) {
     for (let varName of toRemove) {
       if (decl.value.includes(`/ var(${varName})`)) {
         decl.value = decl.value.replace(`/ var(${varName})`, '')
+      } else if (decl.value.includes(`/ var(${varName}, 1)`)) {
+        decl.value = decl.value.replace(`/ var(${varName}, 1)`, '')
       }
     }
   })

src/util/withAlphaVariable.js

@@ -21,7 +21,7 @@ export default function withAlphaVariable({ color, property, variable }) {
       [variable]: '1',
       ...Object.fromEntries(
         properties.map((p) => {
-          return [p, color({ opacityVariable: variable, opacityValue: `var(${variable})` })]
+          return [p, color({ opacityVariable: variable, opacityValue: `var(${variable}, 1)` })]
         })
       ),
     }
@@ -42,7 +42,7 @@ export default function withAlphaVariable({ color, property, variable }) {
     [variable]: '1',
     ...Object.fromEntries(
       properties.map((p) => {
-        return [p, formatColor({ ...parsed, alpha: `var(${variable})` })]
+        return [p, formatColor({ ...parsed, alpha: `var(${variable}, 1)` })]
       })
     ),
   }