gitignore created

.gitignore

@@ -0,0 +1,40 @@
+# Dependencies
+node_modules/
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+
+# Environment variables
+.env
+.env.local
+.env.development.local
+.env.test.local
+.env.production.local
+
+# Logs
+logs
+*.log
+
+# OS files
+.DS_Store
+Thumbs.db
+*.swp
+*.swo
+*~
+
+# IDE files
+.vscode/
+.idea/
+*.sublime-project
+*.sublime-workspace
+
+# Build outputs
+dist/
+build/
+*.tsbuildinfo
+
+# Temporary files
+tmp/
+temp/
+*.tmp
+

public/index.html

@@ -90,8 +90,20 @@
         .chart-title {
             font-size: 18px;
             font-weight: bold;
-            margin-bottom: 20px;
+            margin-bottom: 15px;
             text-align: center;
+            color: #333;
+        }
+        .chart-summary {
+            background: #f8f9fa;
+            padding: 15px 20px;
+            border-radius: 8px;
+            margin-bottom: 20px;
+            font-size: 14px;
+            line-height: 1.6;
+            color: #555;
+            border-left: 4px solid #007bff;
+            text-align: left;
         }
         .loading {
             text-align: center;

public/js/index.js

@@ -46,10 +46,18 @@ function renderCharts(visualizations) {
     visualizations.forEach((viz, index) => {
         const chartDiv = document.createElement('div');
         chartDiv.className = 'chart-container';
-        chartDiv.innerHTML = `
+        
-            <div class="chart-title">${viz.title}</div>
+        // Build HTML with title and summary
-            <canvas id="chart${index}"></canvas>
+        let chartHTML = `<div class="chart-title">${viz.title}</div>`;
-        `;
+        
+        // Add summary if available
+        if (viz.summary) {
+            chartHTML += `<div class="chart-summary">${viz.summary}</div>`;
+        }
+        
+        chartHTML += `<canvas id="chart${index}"></canvas>`;
+        chartDiv.innerHTML = chartHTML;
+        
         container.appendChild(chartDiv);
         
         const canvas = document.getElementById(`chart${index}`);