From 1a4ae5b49b83ade2505047118bcd0b293e0772cd Mon Sep 17 00:00:00 2001
From: hsiegeln <37154749+hsiegeln@users.noreply.github.com>
Date: Sat, 25 Apr 2026 20:03:04 +0200
Subject: [PATCH] fix: style signed-out page to match sign-in UI

Use same layout as SignInPage: bg-base background, 400px card,
Cameleer logo with text header, matching font sizes and spacing.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
---
 ui/src/auth/LoginPage.tsx | 49 ++++++++++++++++++++++++---------------
 1 file changed, 30 insertions(+), 19 deletions(-)

diff --git a/ui/src/auth/LoginPage.tsx b/ui/src/auth/LoginPage.tsx
index ae19012..3ca6e12 100644
--- a/ui/src/auth/LoginPage.tsx
+++ b/ui/src/auth/LoginPage.tsx
@@ -33,26 +33,37 @@ export function LoginPage() {
 
   if (signedOut && !isAuthenticated) {
     return (
-      <div style={{ display: 'flex', alignItems: 'center', justifyContent: 'center', minHeight: '100vh' }}>
-        <div style={{ maxWidth: 360, textAlign: 'center' }}>
-          <Card>
-            <div style={{ display: 'flex', flexDirection: 'column', alignItems: 'center', gap: 16 }}>
-              <img src={cameleerLogo} alt="" width="48" height="48" />
-              <h2 style={{ margin: 0, fontSize: '1.25rem', fontWeight: 600 }}>Signed out</h2>
-              <p style={{ margin: 0, color: 'var(--text-secondary)', fontSize: '0.875rem' }}>
-                You have been signed out successfully.
-              </p>
-              <Button
-                variant="primary"
-                onClick={() => {
-                  window.location.href = window.location.origin + '/platform/login';
-                }}
-              >
-                Sign in again
-              </Button>
+      <div style={{
+        display: 'flex', alignItems: 'center', justifyContent: 'center',
+        minHeight: '100vh', background: 'var(--bg-base)',
+      }}>
+        <Card className="signed-out-card">
+          <div style={{
+            display: 'flex', flexDirection: 'column', alignItems: 'center',
+            width: '100%', fontFamily: 'var(--font-body)',
+          }}>
+            <div style={{
+              display: 'flex', alignItems: 'center', gap: 10,
+              marginBottom: 8, fontSize: 24, fontWeight: 700, color: 'var(--text-primary)',
+            }}>
+              <img src={cameleerLogo} alt="" width="36" height="36" />
+              Cameleer
             </div>
-          </Card>
-        </div>
+            <p style={{ fontSize: 13, color: 'var(--text-muted)', margin: '0 0 24px' }}>
+              You have been signed out successfully.
+            </p>
+            <Button
+              variant="primary"
+              onClick={() => {
+                window.location.href = window.location.origin + '/platform/login';
+              }}
+              style={{ width: '100%' }}
+            >
+              Sign in again
+            </Button>
+          </div>
+        </Card>
+        <style>{`.signed-out-card { width: 100%; max-width: 400px; padding: 32px; }`}</style>
       </div>
     );
   }