add defineHS()L, remove defineColorAlpha()

This commit is contained in:
Ray Elliott 2021-02-17 17:44:17 +02:00
parent 370921f23e
commit 30f18de039
1 changed files with 16 additions and 19 deletions

View File

@ -1,31 +1,28 @@
// eslint-disable-next-line import/no-extraneous-dependencies
const toHSL = require('hex-to-hsl');
// defines a custom property with identifier name, along with individual hue,
// saturation and lightness components
function defineColor(mixin, name, hex) {
const [hue, sat, light] = toHSL(hex);
// untested TODO - test
function defineHSL(mixin, name, hue, sat, light) {
const obj = {};
obj[name] = hex;
// need to convert hue to string otherwise postcss (is it postcss?) appends
// 'px' to the property's value.
obj[`${name}__h`] = hue.toString();
obj[`${name}__s`] = `${sat}%`;
obj[`${name}__l`] = `${light}%`;
return obj;
obj[name] = name;
// need to ensure hue is a string otherwise postcss (is it postcss?) appends
// 'px' to the property's value.
obj[`${name}__h`] = hue.toString();
obj[`${name}__s`] = `${sat}%`;
obj[`${name}__l`] = `${light}%`;
return obj;
}
// defines a custom property with identifier name, along with individual hue,
// saturation, lightness and alpha components
function defineColorAlpha(mixin, name, hex, alpha) {
const obj = defineColor(mixin, name, hex);
obj[`${name}-a`] = alpha;
return obj;
// saturation and lightness components
function defineHex(mixin, name, hex) {
const [hue, sat, light] = toHSL(hex);
return defineHSL(name, hue, sat, light)
}
const postcssMixins = {
defineColor,
defineColorAlpha,
defineHSL,
defineHex,
};
module.exports = postcssMixins;