fix: better play button color

This commit is contained in:
Fredrik Burmester
2024-09-10 13:14:29 +03:00
parent 23eaddf87c
commit f48e0348ad
3 changed files with 23 additions and 7 deletions

View File

@@ -48,6 +48,19 @@ const calculateRelativeLuminance = (rgb: number[]): number => {
return 0.2126 * r + 0.7152 * g + 0.0722 * b;
};
const isCloseToBlack = (color: string): boolean => {
const r = parseInt(color.slice(1, 3), 16);
const g = parseInt(color.slice(3, 5), 16);
const b = parseInt(color.slice(5, 7), 16);
// Check if the color is very dark (close to black)
return r < 20 && g < 20 && b < 20;
};
const adjustToNearBlack = (color: string): string => {
return "#212121"; // A very dark gray, almost black
};
const baseThemeColorAtom = atom<ThemeColors>({
primary: "#FFFFFF",
secondary: "#000000",
@@ -59,12 +72,15 @@ export const itemThemeColorAtom = atom(
(get) => get(baseThemeColorAtom),
(get, set, update: Partial<ThemeColors>) => {
const currentColors = get(baseThemeColorAtom);
const newColors = { ...currentColors, ...update };
let newColors = { ...currentColors, ...update };
// Adjust primary color if it's too close to black
if (newColors.primary && isCloseToBlack(newColors.primary)) {
newColors.primary = adjustToNearBlack(newColors.primary);
}
// Recalculate text color if primary color changes
if (update.average) {
newColors.text = calculateTextColor(update.average);
}
if (update.primary) newColors.text = calculateTextColor(newColors.primary);
set(baseThemeColorAtom, newColors);
}