Spaces:
Sleeping
Sleeping
File size: 1,300 Bytes
e9e5ca3 | 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 | /**
* Chart.js theme configuration
* Applies default styling for charts across the application
*/
import { Chart as ChartJS } from 'chart.js';
type Theme = 'light' | 'dark';
export function applyChartJSTheme(theme: Theme = 'light') {
// Configure default Chart.js options
ChartJS.defaults.responsive = true;
ChartJS.defaults.maintainAspectRatio = false;
ChartJS.defaults.font.family = 'system-ui, -apple-system, sans-serif';
ChartJS.defaults.font.size = 12;
// Theme-aware colors
ChartJS.defaults.color = theme === 'dark' ? '#9ca3af' : '#6b7280'; // gray-400 : gray-500
ChartJS.defaults.borderColor = theme === 'dark' ? '#374151' : '#e5e7eb'; // gray-700 : gray-200
// Configure default plugin options
ChartJS.defaults.plugins.legend.display = true;
ChartJS.defaults.plugins.legend.position = 'top';
ChartJS.defaults.plugins.tooltip.enabled = true;
ChartJS.defaults.plugins.tooltip.backgroundColor =
theme === 'dark' ? 'rgba(31, 41, 55, 0.95)' : 'rgba(17, 24, 39, 0.9)';
ChartJS.defaults.plugins.tooltip.padding = 12;
ChartJS.defaults.plugins.tooltip.cornerRadius = 6;
ChartJS.defaults.plugins.tooltip.titleColor =
theme === 'dark' ? '#f3f4f6' : '#ffffff';
ChartJS.defaults.plugins.tooltip.bodyColor =
theme === 'dark' ? '#e5e7eb' : '#ffffff';
}
|