mirror of
https://github.com/cpvalente/ontime.git
synced 2026-08-08 08:53:51 +00:00
Alex Christoffer Rasmussen
1343818917
* fix: jsdoc comments * more human casting of string values to boolean * add coerceColour to get named colors to work * cue can't pass isKeyOfType event check * dont mutate value * alloow cue in eventDef * lint * css named or hex formatting * "sideEffects": false * test colour hex regex * roll eventDef back to master * parse property * don't export cssColour names * remove import * only allow string types to colour * handle transparent colour * mix alpha with bg colour * only allow updating events * descriptive names * add test for getAccessibleColour * readability * move isColourHex to regex-utils * simplify and add test
32 lines
1008 B
TypeScript
32 lines
1008 B
TypeScript
import Color from 'color';
|
|
|
|
type ColourCombination = {
|
|
backgroundColor: string;
|
|
color: string;
|
|
};
|
|
|
|
/**
|
|
* @description Selects text colour to maintain accessible contrast
|
|
* @param bgColour
|
|
* @return {{backgroundColor, color: string}}
|
|
*/
|
|
export const getAccessibleColour = (bgColour?: string): ColourCombination => {
|
|
if (bgColour) {
|
|
try {
|
|
const originalColour = Color(bgColour);
|
|
const backgroundColorMix = originalColour.alpha(1).mix(Color('#1a1a1a'), 1 - originalColour.alpha());
|
|
const textColor = backgroundColorMix.isLight() ? 'black' : '#fffffa';
|
|
return { backgroundColor: backgroundColorMix.hexa(), color: textColor };
|
|
} catch (_error) {
|
|
/* we do not handle errors here */
|
|
}
|
|
}
|
|
return { backgroundColor: '#1a1a1a', color: '#fffffa' };
|
|
};
|
|
|
|
/**
|
|
* @description Creates a list of classnames from array of css module conditions
|
|
* @param classNames - css modules objects
|
|
*/
|
|
export const cx = (classNames: any[]) => classNames.filter(Boolean).join(' ');
|