diff --git a/src/web/templates/index.html b/src/web/templates/index.html
index 1d65583..a03f91a 100644
--- a/src/web/templates/index.html
+++ b/src/web/templates/index.html
@@ -302,8 +302,7 @@
             <div class="sidebar-panel">
                 <button class="btn-calibrate" id="btnCalibrate" onclick="doCalibrate()">Calibrate Court</button>
                 <div class="calibrate-status" id="calStatus">
-                    CAM 0: <span id="calStatus0">--</span><br>
-                    CAM 1: <span id="calStatus1">--</span>
+                    <span id="calStatusText">Not calibrated</span>
                 </div>
             </div>
         </div>
@@ -396,12 +395,18 @@ function updateCalibrationStatus() {
     fetch('/api/calibration/status')
         .then(function(r) { return r.json(); })
         .then(function(data) {
-            var s0 = document.getElementById('calStatus0');
-            var s1 = document.getElementById('calStatus1');
-            s0.textContent = data['0'] ? 'OK' : 'not calibrated';
-            s0.className = data['0'] ? 'ok' : '';
-            s1.textContent = data['1'] ? 'OK' : 'not calibrated';
-            s1.className = data['1'] ? 'ok' : '';
+            var el = document.getElementById('calStatusText');
+            var ok0 = data['0'], ok1 = data['1'];
+            if (ok0 && ok1) {
+                el.textContent = 'Calibrated';
+                el.className = 'ok';
+            } else if (ok0 || ok1) {
+                el.textContent = 'Partially calibrated';
+                el.className = 'ok';
+            } else {
+                el.textContent = 'Not calibrated';
+                el.className = '';
+            }
         });
 }
 // Check on load