Fix range buttons blocked by CSP script-src-attr policy

src/assets/monitoring-btc.html

@@ -85,9 +85,9 @@ <h1>lightning.space - BTC Monitoring</h1>
   <div class="section">
     <h2>BTC Balance History</h2>
     <div class="range-buttons">
-      <button class="active" onclick="loadChart('24h')">24h</button>
-      <button onclick="loadChart('7d')">7d</button>
-      <button onclick="loadChart('30d')">30d</button>
+      <button class="active" data-range="24h">24h</button>
+      <button data-range="7d">7d</button>
+      <button data-range="30d">30d</button>
     </div>
     <div class="chart-container">
       <canvas id="btcChart"></canvas>

src/assets/monitoring-btc.js

@@ -200,3 +200,10 @@ function renderChart(points) {
 
 loadData();
 loadChart('24h');
+
+var rangeButtons = document.querySelectorAll('.range-buttons button[data-range]');
+for (var i = 0; i < rangeButtons.length; i++) {
+  rangeButtons[i].addEventListener('click', function () {
+    loadChart(this.getAttribute('data-range'));
+  });
+}

src/assets/monitoring-usd.html

@@ -85,9 +85,9 @@ <h1>lightning.space - USD Monitoring</h1>
   <div class="section">
     <h2>USD Balance History</h2>
     <div class="range-buttons">
-      <button class="active" onclick="loadChart('24h')">24h</button>
-      <button onclick="loadChart('7d')">7d</button>
-      <button onclick="loadChart('30d')">30d</button>
+      <button class="active" data-range="24h">24h</button>
+      <button data-range="7d">7d</button>
+      <button data-range="30d">30d</button>
     </div>
     <div class="chart-container">
       <canvas id="usdChart"></canvas>

src/assets/monitoring-usd.js

@@ -162,3 +162,10 @@ function renderChart(points) {
 
 loadData();
 loadChart('24h');
+
+var rangeButtons = document.querySelectorAll('.range-buttons button[data-range]');
+for (var i = 0; i < rangeButtons.length; i++) {
+  rangeButtons[i].addEventListener('click', function () {
+    loadChart(this.getAttribute('data-range'));
+  });
+}