2026-09-04 09:19:14 +02:00
|
|
|
/**
|
|
|
|
|
* Geeft een thema-object (T) terug op basis van darkMode.
|
|
|
|
|
* Wordt gebruikt door alle componenten om consistent kleuren te krijgen.
|
|
|
|
|
*/
|
|
|
|
|
export function useTheme(darkMode) {
|
2026-09-04 09:19:23 +02:00
|
|
|
const bg = darkMode ? "#241A39" : "#eef1f8";
|
|
|
|
|
const card = darkMode ? "rgba(22,23,27,0.30)" : "#ffffff";
|
2026-09-04 09:19:14 +02:00
|
|
|
return {
|
|
|
|
|
// Exacte Finex kleuren (dark) / licht alternatief
|
2026-09-04 09:19:23 +02:00
|
|
|
bg,
|
|
|
|
|
card,
|
|
|
|
|
// Ondoorzichtige achtergrond voor popups/modals: kaartkleur over de pagina-bg.
|
|
|
|
|
popupBg: `linear-gradient(${card}, ${card}), ${bg}`,
|
2026-09-04 09:19:14 +02:00
|
|
|
sidebar: darkMode ? "#16171B" : "#f8faff",
|
|
|
|
|
border: darkMode ? "rgba(139,92,246,0.15)" : "rgba(0,0,0,0.07)",
|
|
|
|
|
muted: darkMode ? "#8b8fa8" : "#94a3b8",
|
|
|
|
|
text: darkMode ? "#ffffff" : "#0f172a",
|
|
|
|
|
subtext: darkMode ? "#a0aec0" : "#64748b",
|
|
|
|
|
inputBg: darkMode ? "rgba(139,92,246,0.08)" : "#f1f5ff",
|
|
|
|
|
inputBorder:darkMode ? "rgba(139,92,246,0.2)" : "#e2e8f0",
|
|
|
|
|
contentBg: darkMode ? "#241A39" : "#eef1f8",
|
|
|
|
|
shadow: darkMode ? "0 4px 24px rgba(124,58,237,0.25)" : "0 4px 20px rgba(0,0,0,0.07)",
|
|
|
|
|
cardShadow: darkMode ? "0 4px 20px rgba(124,58,237,0.2)" : "0 2px 8px rgba(0,0,0,0.06)",
|
|
|
|
|
radius: "14px",
|
|
|
|
|
font: "'Poppins', system-ui, sans-serif",
|
|
|
|
|
};
|
|
|
|
|
}
|
