Merge pull request #93 from ryanalexander/patch-4

This commit is contained in:
Paul Makles 2021-08-19 13:49:27 +01:00 committed by GitHub
commit 762cad1614
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23

View file

@ -372,7 +372,13 @@ export function Component(props: Props) {
} }
/> />
</div> </div>
<span style={`color: ${getContrastingColour(theme[x])}`}>{x}</span> <span
style={`color: ${getContrastingColour(
theme[x],
theme["primary-background"],
)}`}>
{x}
</span>
<div className={styles.override}> <div className={styles.override}>
<div <div
className={styles.picker} className={styles.picker}
@ -446,11 +452,13 @@ export const Appearance = connectState(Component, (state) => {
}; };
}); });
function getContrastingColour(hex: string){ function getContrastingColour(hex: string, fallback: string): string {
hex = hex.replace("#", ""); hex = hex.replace("#", "");
const r = parseInt(hex.substr(0,2),16); const r = parseInt(hex.substr(0, 2), 16);
const g = parseInt(hex.substr(2,2),16); const g = parseInt(hex.substr(2, 2), 16);
const b = parseInt(hex.substr(4,2),16); const b = parseInt(hex.substr(4, 2), 16);
const cc = ((r*299)+(g*587)+(b*114))/1000; const cc = (r * 299 + g * 587 + b * 114) / 1000;
return (cc >= 128) ? 'black' : 'white'; if (isNaN(r) || isNaN(g) || isNaN(b) || isNaN(cc))
return getContrastingColour(fallback, "#fffff");
return cc >= 175 ? "black" : "white";
} }