Files
bincio-activity/mobile/theme.ts
T
Davide Scaini dfe5307ab4 feat: seasonal race palette (Giro/Tour/Vuelta) + mobile picker
- theme.ts: useTheme() hook with race calendar (May–Sep windows),
  auto-detects Giro/Tour/Vuelta by date; stores override in SQLite
- All screens (feed, import, activity, tab bar) now use accent/dim
  from useTheme() instead of hardcoded #60a5fa
- Settings: Palette section with Auto/Default/Giro/Tour/Vuelta buttons
  to override the auto-detected palette for testing
2026-04-25 15:41:20 +02:00

37 lines
1.6 KiB
TypeScript
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
import { useSetting } from '@/db/queries';
export type PaletteKey = 'auto' | 'default' | 'giro' | 'tour' | 'vuelta';
export const PALETTES = {
default: { accent: '#60a5fa', dim: 'rgba(96,165,250,0.15)', label: 'Default' },
giro: { accent: '#f472b6', dim: 'rgba(244,114,182,0.15)', label: "Giro d'Italia" },
tour: { accent: '#facc15', dim: 'rgba(250,204,21,0.15)', label: 'Tour de France' },
vuelta: { accent: '#ef4444', dim: 'rgba(239,68,68,0.15)', label: 'Vuelta a España' },
} as const satisfies Record<string, { accent: string; dim: string; label: string }>;
export type Theme = (typeof PALETTES)[keyof typeof PALETTES];
// Race windows [month 0-indexed, day inclusive] — update each year
const RACES: Array<{ key: Exclude<PaletteKey, 'auto' | 'default'>; start: [number, number]; end: [number, number] }> = [
{ key: 'giro', start: [4, 8], end: [5, 1] }, // May 8 Jun 1
{ key: 'tour', start: [5, 27], end: [6, 19] }, // Jun 27 Jul 19
{ key: 'vuelta', start: [7, 15], end: [8, 6] }, // Aug 15 Sep 6
];
export function autoKey(): Exclude<PaletteKey, 'auto'> {
const now = new Date();
const y = now.getFullYear();
for (const r of RACES) {
const start = new Date(y, r.start[0], r.start[1]);
const end = new Date(y, r.end[0], r.end[1] + 1);
if (now >= start && now < end) return r.key;
}
return 'default';
}
export function useTheme(): Theme {
const override = (useSetting('palette_override') ?? 'auto') as PaletteKey;
const key = override === 'auto' ? autoKey() : override;
return PALETTES[key as keyof typeof PALETTES] ?? PALETTES.default;
}