From cc36e486c3fe3b0e06089855739ff3f3841acd51 Mon Sep 17 00:00:00 2001
From: James <james@jongsma.me>
Date: Sat, 14 Feb 2026 02:54:32 -0500
Subject: [PATCH] Move sensors next to pulse-ox cam in left pane, vertical
 stack

---
 index.html | 21 +++++++++++++--------
 1 file changed, 13 insertions(+), 8 deletions(-)

diff --git a/index.html b/index.html
index f6a15e6..27a0f1e 100644
--- a/index.html
+++ b/index.html
@@ -14,7 +14,7 @@ body { background: #0a0a0a; color: #e0ddd5; font-family: 'Sora', sans-serif; ove
 #right { width: 42%; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 16px; gap: 12px; }
 
 /* Camera */
-#cam-wrap { width: 70%; border-radius: 8px; overflow: hidden; border: 1px solid #222; flex-shrink: 0; }
+#cam-wrap { flex: 1; border-radius: 8px; overflow: hidden; border: 1px solid #222; flex-shrink: 0; }
 #pulse-cam { width: 100%; display: block; background: #111; }
 
 /* Clock */
@@ -23,8 +23,11 @@ canvas#clock { width: 180px; height: 180px; }
 #digital-time { text-align: center; color: #c8b273; font-size: 21px; font-weight: 300; letter-spacing: 2px; margin-top: 6px; font-variant-numeric: tabular-nums; }
 #digital-date { text-align: center; color: #666; font-size: 13px; font-weight: 400; letter-spacing: 1px; margin-top: 2px; }
 
+/* Cam + sensors row */
+#cam-row { display: flex; align-items: center; gap: 14px; }
+
 /* Room sensors */
-#room-sensors { display: flex; gap: 20px; justify-content: center; width: 100%; max-width: 280px; padding: 8px 0; }
+#room-sensors { display: flex; flex-direction: column; gap: 8px; padding: 4px 0; }
 #room-sensors .sensor { text-align: center; }
 #room-sensors .sensor-val { font-size: 22px; font-weight: 300; color: #e0ddd5; font-variant-numeric: tabular-nums; }
 #room-sensors .sensor-label { font-size: 10px; color: #555; text-transform: uppercase; letter-spacing: 1px; font-weight: 600; }
@@ -80,17 +83,19 @@ canvas#clock { width: 180px; height: 180px; }
     <div id="alerts-header"><span class="dot"></span> STATUS</div>
     <div id="alert-list"></div>
   </div>
-  <div id="cam-wrap"><img id="pulse-cam" alt="Pulse-Ox"></div>
+  <div id="cam-row">
+    <div id="cam-wrap"><img id="pulse-cam" alt="Pulse-Ox"></div>
+    <div id="room-sensors" style="display:none">
+      <div class="sensor"><div class="sensor-val" id="s-temp">--</div><div class="sensor-label">Temp</div></div>
+      <div class="sensor"><div class="sensor-val" id="s-hum">--</div><div class="sensor-label">Humidity</div></div>
+      <div class="sensor"><div class="sensor-val" id="s-co2">--</div><div class="sensor-label">CO₂</div></div>
+    </div>
+  </div>
 </div>
 <div id="right">
   <div id="clock-wrap"><canvas id="clock" width="440" height="440"></canvas></div>
   <div id="digital-time"></div>
   <div id="digital-date"></div>
-  <div id="room-sensors" style="display:none">
-    <div class="sensor"><div class="sensor-val" id="s-temp">--</div><div class="sensor-label">Temp</div></div>
-    <div class="sensor"><div class="sensor-val" id="s-hum">--</div><div class="sensor-label">Humidity</div></div>
-    <div class="sensor"><div class="sensor-val" id="s-co2">--</div><div class="sensor-label">CO₂</div></div>
-  </div>
   <div id="calendar">
     <div id="cal-nav">
       <button id="cal-prev">‹</button>