Update Mode1Svelte title and add mode indicator

- Changed title to Mode1Svelte throughout frontend - Added mode indicator in bottom left with pulsing green dot - All tests passing and dashboard working
2026-01-22 12:36:56 +00:00
parent 5a4a3c51e9
commit c0d32d7658
1 changed files with 43 additions and 2 deletions
@@ -3,7 +3,7 @@
 <head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
-  <title>Mode1 - Auth Module Test</title>
+  <title>Mode1Svelte - Auth Module Test</title>
  <style>
    * {
      margin: 0;
@@ -150,6 +150,41 @@
      text-align: right;
    }

+    .mode-indicator {
+      position: fixed;
+      bottom: 1rem;
+      left: 1rem;
+      background: #1e293b;
+      border: 1px solid #334155;
+      border-radius: 6px;
+      padding: 0.75rem 1rem;
+      font-size: 0.875rem;
+      color: #94a3b8;
+      display: flex;
+      align-items: center;
+      gap: 0.5rem;
+      z-index: 1000;
+    }
+
+    .mode-indicator .mode-name {
+      font-weight: 600;
+      color: #f1f5f9;
+    }
+
+    .mode-indicator .mode-dot {
+      width: 8px;
+      height: 8px;
+      border-radius: 50%;
+      background: #22c55e;
+      animation: pulse 2s infinite;
+    }
+
+    @keyframes pulse {
+      0%, 100% { opacity: 1; }
+      50% { opacity: 0.5; }
+    }
+    }
+
    @media (max-width: 768px) {
      .grid {
        grid-template-columns: 1fr;
@@ -163,7 +198,7 @@
 </head>
 <body>
  <div class="container">
-    <h1>🔐 Auth Module Test Suite (Mode1)</h1>
+    <h1>🔐 Auth Module Test Suite (Mode1Svelte)</h1>

    <div class="grid">
      <!-- Frontend Auth Section -->
@@ -541,5 +576,11 @@
      }
    }
  </script>
+
+  <!-- Mode Indicator -->
+  <div class="mode-indicator">
+    <div class="mode-dot"></div>
+    <span class="mode-name">Mode1Svelte</span>
+  </div>
 </body>
 </html>