init
This commit is contained in:
+33
@@ -0,0 +1,33 @@
|
||||
/**
|
||||
* This function removes any uses of CSS variables used as an alpha channel
|
||||
*
|
||||
* This is required for selectors like `:visited` which do not allow
|
||||
* changes in opacity or external control using CSS variables.
|
||||
*
|
||||
* @param {import('postcss').Container} container
|
||||
* @param {string[]} toRemove
|
||||
*/ "use strict";
|
||||
Object.defineProperty(exports, "__esModule", {
|
||||
value: true
|
||||
});
|
||||
Object.defineProperty(exports, "removeAlphaVariables", {
|
||||
enumerable: true,
|
||||
get: function() {
|
||||
return removeAlphaVariables;
|
||||
}
|
||||
});
|
||||
function removeAlphaVariables(container, toRemove) {
|
||||
container.walkDecls((decl)=>{
|
||||
if (toRemove.includes(decl.prop)) {
|
||||
decl.remove();
|
||||
return;
|
||||
}
|
||||
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)`, "");
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
+79
@@ -0,0 +1,79 @@
|
||||
"use strict";
|
||||
Object.defineProperty(exports, "__esModule", {
|
||||
value: true
|
||||
});
|
||||
function _export(target, all) {
|
||||
for(var name in all)Object.defineProperty(target, name, {
|
||||
enumerable: true,
|
||||
get: all[name]
|
||||
});
|
||||
}
|
||||
_export(exports, {
|
||||
withAlphaValue: function() {
|
||||
return withAlphaValue;
|
||||
},
|
||||
default: function() {
|
||||
return withAlphaVariable;
|
||||
}
|
||||
});
|
||||
const _color = require("./color");
|
||||
function withAlphaValue(color, alphaValue, defaultValue) {
|
||||
if (typeof color === "function") {
|
||||
return color({
|
||||
opacityValue: alphaValue
|
||||
});
|
||||
}
|
||||
let parsed = (0, _color.parseColor)(color, {
|
||||
loose: true
|
||||
});
|
||||
if (parsed === null) {
|
||||
return defaultValue;
|
||||
}
|
||||
return (0, _color.formatColor)({
|
||||
...parsed,
|
||||
alpha: alphaValue
|
||||
});
|
||||
}
|
||||
function withAlphaVariable({ color , property , variable }) {
|
||||
let properties = [].concat(property);
|
||||
if (typeof color === "function") {
|
||||
return {
|
||||
[variable]: "1",
|
||||
...Object.fromEntries(properties.map((p)=>{
|
||||
return [
|
||||
p,
|
||||
color({
|
||||
opacityVariable: variable,
|
||||
opacityValue: `var(${variable}, 1)`
|
||||
})
|
||||
];
|
||||
}))
|
||||
};
|
||||
}
|
||||
const parsed = (0, _color.parseColor)(color);
|
||||
if (parsed === null) {
|
||||
return Object.fromEntries(properties.map((p)=>[
|
||||
p,
|
||||
color
|
||||
]));
|
||||
}
|
||||
if (parsed.alpha !== undefined) {
|
||||
// Has an alpha value, return color as-is
|
||||
return Object.fromEntries(properties.map((p)=>[
|
||||
p,
|
||||
color
|
||||
]));
|
||||
}
|
||||
return {
|
||||
[variable]: "1",
|
||||
...Object.fromEntries(properties.map((p)=>{
|
||||
return [
|
||||
p,
|
||||
(0, _color.formatColor)({
|
||||
...parsed,
|
||||
alpha: `var(${variable}, 1)`
|
||||
})
|
||||
];
|
||||
}))
|
||||
};
|
||||
}
|
||||
Reference in New Issue
Block a user