37 lines
1010 B
JavaScript
37 lines
1010 B
JavaScript
// eslint-disable-next-line import/no-extraneous-dependencies
|
|
const toHSL = require('hex-to-hsl');
|
|
|
|
// TODO - untested
|
|
function defineHSL(mixin, name, hue, sat, light) {
|
|
const obj = {};
|
|
obj[name] = `hsl(${hue}, ${sat}, ${light})`;
|
|
// 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 and lightness components
|
|
function defineHex(mixin, name, hex) {
|
|
const [hue, sat, light] = toHSL(hex);
|
|
return defineHSL(mixin, name, hue, `${sat}%`, `${light}%`);
|
|
}
|
|
|
|
// TODO - untested
|
|
// // font rendering -> useful for light text on dark backgrounds
|
|
function fontSmooth() {
|
|
return {
|
|
'-webkit-font-smoothing': 'antialiased',
|
|
'-moz-osx-font-smoothing': 'grayscale',
|
|
};
|
|
}
|
|
|
|
module.exports = {
|
|
defineHSL,
|
|
defineHex,
|
|
fontSmooth,
|
|
};
|