Alexander
56d438631b
Unifies PNG and SVG body-part images behind a single CSS-mask render path, so both now colorize with a --accent CSS variable. Accent splits by measurement type: --blue for proportion parts (chest, shoulders, waist, hips) and --nord8 for muscle parts (neck, biceps, forearms, thighs, calves). Stats cards gain a matching 8%-tint fill and accent-colored hover border. History page header image enlarged. Thigh SVG stroke-width bumped to 11 for better mask legibility.
45 lines
2.1 KiB
TypeScript
45 lines
2.1 KiB
TypeScript
export type SingleBodyPartCard = {
|
|
key: string;
|
|
slugDe: string;
|
|
labelKey: string;
|
|
img: string | null;
|
|
paired: false;
|
|
db: string;
|
|
};
|
|
export type PairedBodyPartCard = {
|
|
key: string;
|
|
slugDe: string;
|
|
labelKey: string;
|
|
img: string | null;
|
|
paired: true;
|
|
dbLeft: string;
|
|
dbRight: string;
|
|
};
|
|
export type BodyPartCard = SingleBodyPartCard | PairedBodyPartCard;
|
|
|
|
export const BODY_PART_CARDS: BodyPartCard[] = [
|
|
{ key: 'neck', slugDe: 'hals', labelKey: 'neck', img: 'neck.png', paired: false, db: 'neck' },
|
|
{ key: 'shoulders', slugDe: 'schultern', labelKey: 'shoulders', img: 'back.png', paired: false, db: 'shoulders' },
|
|
{ key: 'chest', slugDe: 'brust', labelKey: 'chest', img: 'shoulders.png', paired: false, db: 'chest' },
|
|
{ key: 'biceps', slugDe: 'bizeps', labelKey: 'biceps', img: 'bicep.png', paired: true, dbLeft: 'leftBicep', dbRight: 'rightBicep' },
|
|
{ key: 'forearms', slugDe: 'unterarme', labelKey: 'forearms', img: null, paired: true, dbLeft: 'leftForearm', dbRight: 'rightForearm' },
|
|
{ key: 'waist', slugDe: 'taille', labelKey: 'waist', img: 'waist.png', paired: false, db: 'waist' },
|
|
{ key: 'hips', slugDe: 'huefte', labelKey: 'hips', img: 'hips.png', paired: false, db: 'hips' },
|
|
{ key: 'thighs', slugDe: 'oberschenkel', labelKey: 'thighs', img: 'thigh.svg', paired: true, dbLeft: 'leftThigh', dbRight: 'rightThigh' },
|
|
{ key: 'calves', slugDe: 'waden', labelKey: 'calves', img: 'calves.png', paired: true, dbLeft: 'leftCalf', dbRight: 'rightCalf' }
|
|
];
|
|
|
|
export function findBodyPart(slug: string): BodyPartCard | null {
|
|
return BODY_PART_CARDS.find((c) => c.key === slug || c.slugDe === slug) ?? null;
|
|
}
|
|
|
|
export function bodyPartSlug(card: BodyPartCard, lang: string): string {
|
|
return lang === 'de' ? card.slugDe : card.key;
|
|
}
|
|
|
|
const PROPORTION_KEYS: ReadonlySet<string> = new Set(['chest', 'shoulders', 'waist', 'hips']);
|
|
|
|
export function bodyPartAccent(key: string): string {
|
|
return PROPORTION_KEYS.has(key) ? 'var(--blue)' : 'var(--nord8)';
|
|
}
|