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:
@@ -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 {
|
||||||
|
|||||||
In neuem Issue referenzieren
Einen Benutzer sperren