Auth-Modal an AegisSight Design angepasst

Navy-Hintergrund (#0A1832), Gold-Akzente (#C8A851), weisse Schrift
auf dunklem Grund. Ersetzt das generische blau-weisse Design.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
Dieser Commit ist enthalten in:
Claude Code
2026-04-03 15:23:03 +02:00
Ursprung f7f5be076d
Commit beaa0adde0

Datei anzeigen

@@ -245,8 +245,8 @@ const LoginModal = {
left: 0; left: 0;
width: 100%; width: 100%;
height: 100%; height: 100%;
background: rgba(0, 0, 0, 0.7); background: rgba(10, 24, 50, 0.85);
backdrop-filter: blur(10px); backdrop-filter: blur(12px);
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
@@ -254,13 +254,14 @@ const LoginModal = {
animation: fadeIn 0.3s ease; animation: fadeIn 0.3s ease;
} }
.modal-content { .modal-content {
background: #ffffff; background: #0A1832;
border-radius: 12px; border-radius: 12px;
padding: 2.5rem; padding: 2.5rem;
max-width: 400px; max-width: 400px;
width: 90%; width: 90%;
position: relative; position: relative;
box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3); border: 1px solid rgba(200, 168, 81, 0.3);
box-shadow: 0 20px 60px rgba(0, 0, 0, 0.5);
} }
.modal-header { .modal-header {
text-align: center; text-align: center;
@@ -269,7 +270,7 @@ const LoginModal = {
.modal-header .lock-icon { .modal-header .lock-icon {
width: 48px; width: 48px;
height: 48px; height: 48px;
color: #0066cc; color: #C8A851;
margin-bottom: 1rem; margin-bottom: 1rem;
} }
.modal-close { .modal-close {
@@ -278,7 +279,7 @@ const LoginModal = {
right: 1rem; right: 1rem;
background: none; background: none;
border: none; border: none;
color: #666; color: rgba(255, 255, 255, 0.4);
font-size: 2rem; font-size: 2rem;
cursor: pointer; cursor: pointer;
transition: all 0.3s ease; transition: all 0.3s ease;
@@ -290,17 +291,17 @@ const LoginModal = {
border-radius: 50%; border-radius: 50%;
} }
.modal-close:hover { .modal-close:hover {
background: #f0f0f0; background: rgba(255, 255, 255, 0.1);
color: #333; color: #fff;
} }
.modal-content h3 { .modal-content h3 {
color: #1a1a1a; color: #FFFFFF;
margin-bottom: 0.5rem; margin-bottom: 0.5rem;
font-size: 1.5rem; font-size: 1.5rem;
font-weight: 600; font-weight: 600;
} }
.modal-content p { .modal-content p {
color: #666; color: rgba(255, 255, 255, 0.6);
margin-bottom: 2rem; margin-bottom: 2rem;
text-align: center; text-align: center;
} }
@@ -309,33 +310,33 @@ const LoginModal = {
} }
.modal-content label { .modal-content label {
display: block; display: block;
color: #333; color: rgba(255, 255, 255, 0.8);
margin-bottom: 0.5rem; margin-bottom: 0.5rem;
font-weight: 500; font-weight: 500;
} }
.modal-content input { .modal-content input {
width: 100%; width: 100%;
padding: 0.875rem; padding: 0.875rem;
background: #f8f8f8; background: rgba(255, 255, 255, 0.05);
border: 2px solid #e0e0e0; border: 2px solid rgba(255, 255, 255, 0.15);
border-radius: 8px; border-radius: 8px;
color: #333; color: #FFFFFF;
font-size: 1rem; font-size: 1rem;
transition: all 0.3s ease; transition: all 0.3s ease;
} }
.modal-content input:focus { .modal-content input:focus {
outline: none; outline: none;
border-color: #0066cc; border-color: #C8A851;
background: #fff; background: rgba(255, 255, 255, 0.08);
} }
.modal-content input::placeholder { .modal-content input::placeholder {
color: #999; color: rgba(255, 255, 255, 0.3);
} }
.modal-content .primary-button { .modal-content .primary-button {
width: 100%; width: 100%;
padding: 0.875rem; padding: 0.875rem;
background: #0066cc; background: #C8A851;
color: white; color: #0A1832;
border: none; border: none;
border-radius: 8px; border-radius: 8px;
font-size: 1rem; font-size: 1rem;
@@ -344,18 +345,18 @@ const LoginModal = {
transition: all 0.3s ease; transition: all 0.3s ease;
} }
.modal-content .primary-button:hover { .modal-content .primary-button:hover {
background: #0052a3; background: #D4B96A;
transform: translateY(-1px); transform: translateY(-1px);
box-shadow: 0 4px 12px rgba(0, 102, 204, 0.3); box-shadow: 0 4px 12px rgba(200, 168, 81, 0.4);
} }
.auth-note { .auth-note {
text-align: center; text-align: center;
margin-top: 1.5rem; margin-top: 1.5rem;
font-size: 0.9rem; font-size: 0.9rem;
color: #666; color: rgba(255, 255, 255, 0.4);
} }
.auth-note a { .auth-note a {
color: #0066cc; color: #C8A851;
text-decoration: none; text-decoration: none;
} }
.auth-note a:hover { .auth-note a:hover {