React + Vite frontend with a local-JSON-backed API (Vite middleware) for tracking portfolio holdings, contributions/withdrawals, recurring contribution plans, and a forecast chart comparing the portfolio's real value against a same-contributions S&P 500 benchmark. Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
32 lines
783 B
TypeScript
32 lines
783 B
TypeScript
// Reference categorical palette from the dataviz skill — fixed hue order, never cycled.
|
|
export const CATEGORICAL_LIGHT = [
|
|
"#2a78d6", // 1 blue
|
|
"#eb6834", // 2 orange
|
|
"#1baf7a", // 3 aqua
|
|
"#eda100", // 4 yellow
|
|
"#e87ba4", // 5 magenta
|
|
"#008300", // 6 green
|
|
"#4a3aa7", // 7 violet
|
|
"#e34948", // 8 red
|
|
];
|
|
|
|
export const CATEGORICAL_DARK = [
|
|
"#3987e5",
|
|
"#d95926",
|
|
"#199e70",
|
|
"#c98500",
|
|
"#d55181",
|
|
"#008300",
|
|
"#9085e9",
|
|
"#e66767",
|
|
];
|
|
|
|
export function categoricalColor(index: number, dark: boolean): string {
|
|
const ramp = dark ? CATEGORICAL_DARK : CATEGORICAL_LIGHT;
|
|
return ramp[index % ramp.length];
|
|
}
|
|
|
|
export function prefersDark(): boolean {
|
|
return typeof window !== "undefined" && window.matchMedia?.("(prefers-color-scheme: dark)").matches;
|
|
}
|