Refactor WebSocket connection handlers: streamline logs and switch to warnings for closure events

Signed-off-by: YoungSoo Shin <shinys000114@gmail.com>

page/index.html

@@ -53,7 +53,10 @@
                 <span id="power-display" class="text-primary">--.-- W</span>
             </div>
         </div>
-        <h1 class="text-primary text-center order-md-2 mx-auto">ODROID Power Mate</h1>
+        <div class="text-center order-md-2 mx-auto">
+            <h1 class="text-primary mb-0">ODROID Power Mate</h1>
+            <small class="text-muted" id="version-info"></small>
+        </div>
         <div class="d-flex align-items-center justify-content-end order-md-3 header-controls" style="flex: 1;">
             <div class="form-check form-switch">
                 <input class="form-check-input" type="checkbox" role="switch" id="theme-toggle">
@@ -159,12 +162,9 @@
     </div>
 </main>
 
-<footer class="bg-body-tertiary text-center p-3 position-relative">
+<footer class="bg-body-tertiary text-center p-3">
     <a href="https://www.hardkernel.com/" target="_blank" class="link-secondary text-decoration-none">Hardkernel</a> |
     <a href="https://wiki.odroid.com/start" target="_blank" class="link-secondary text-decoration-none">Wiki</a>
-    <div class="position-absolute end-0 top-50 translate-middle-y pe-3">
-        <small class="text-muted" id="version-info"></small>
-    </div>
 </footer>
 
 <!-- Settings Modal -->

page/src/main.js

@@ -55,16 +55,12 @@ const confirmPasswordInput = document.getElementById('confirm-password');
 
 function onWsOpen() {
     updateWebsocketStatus(true);
-    if (term) {
-        term.write('\x1b[32mConnected to WebSocket Server\x1b[0m\r\n');
-    }
+    console.log('Connected to WebSocket Server');
 }
 
 function onWsClose() {
     updateWebsocketStatus(false);
-    if (term) {
-        term.write('\r\n\x1b[31mConnection closed. Reconnecting...\x1b[0m\r\n');
-    }
+    console.warn('Connection closed. Reconnecting...');
     setTimeout(connect, 2000);
 }