Palette: apply race-calendar accent switching on load, matching bincio_activity
This commit is contained in:
@@ -4,10 +4,33 @@
|
||||
|
||||
const ACTIVITY_URL = import.meta.env.VITE_ACTIVITY_URL ?? 'https://activity.bincio.org';
|
||||
|
||||
const PALETTES = {
|
||||
default: { accent: '#60a5fa', dim: 'rgba(96,165,250,0.15)' },
|
||||
giro: { accent: '#f472b6', dim: 'rgba(244,114,182,0.15)' },
|
||||
tour: { accent: '#facc15', dim: 'rgba(250,204,21,0.15)' },
|
||||
vuelta: { accent: '#ef4444', dim: 'rgba(239,68,68,0.15)' },
|
||||
};
|
||||
const RACES = [
|
||||
{ key: 'giro', start: [4, 8], end: [5, 1] },
|
||||
{ key: 'tour', start: [5, 27], end: [6, 19] },
|
||||
{ key: 'vuelta', start: [7, 15], end: [8, 6] },
|
||||
];
|
||||
function applyPalette() {
|
||||
const now = new Date(), y = now.getFullYear();
|
||||
const key = RACES.find(r =>
|
||||
now >= new Date(y, r.start[0], r.start[1]) &&
|
||||
now < new Date(y, r.end[0], r.end[1] + 1)
|
||||
)?.key ?? 'default';
|
||||
const p = PALETTES[key];
|
||||
document.documentElement.style.setProperty('--accent', p.accent);
|
||||
document.documentElement.style.setProperty('--accent-dim', p.dim);
|
||||
}
|
||||
|
||||
let authed = $state(false);
|
||||
let checking = $state(true);
|
||||
|
||||
onMount(async () => {
|
||||
applyPalette();
|
||||
try {
|
||||
const r = await fetch(`${ACTIVITY_URL}/api/me`, { credentials: 'include' });
|
||||
if (r.ok) {
|
||||
|
||||
Reference in New Issue
Block a user