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
This commit is contained in:
2026-01-22 12:36:56 +00:00
parent 5a4a3c51e9
commit c0d32d7658
+43 -2
View File
@@ -3,7 +3,7 @@
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Mode1 - Auth Module Test</title> <title>Mode1Svelte - Auth Module Test</title>
<style> <style>
* { * {
margin: 0; margin: 0;
@@ -150,6 +150,41 @@
text-align: right; 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) { @media (max-width: 768px) {
.grid { .grid {
grid-template-columns: 1fr; grid-template-columns: 1fr;
@@ -163,7 +198,7 @@
</head> </head>
<body> <body>
<div class="container"> <div class="container">
<h1>🔐 Auth Module Test Suite (Mode1)</h1> <h1>🔐 Auth Module Test Suite (Mode1Svelte)</h1>
<div class="grid"> <div class="grid">
<!-- Frontend Auth Section --> <!-- Frontend Auth Section -->
@@ -541,5 +576,11 @@
} }
} }
</script> </script>
<!-- Mode Indicator -->
<div class="mode-indicator">
<div class="mode-dot"></div>
<span class="mode-name">Mode1Svelte</span>
</div>
</body> </body>
</html> </html>