Fix login page: allow /icons/ through auth middleware, match color scheme to AC logo

This commit is contained in:
Erik 2026-04-10 20:07:06 +02:00
parent 9f49038107
commit 8f681398ee
2 changed files with 35 additions and 37 deletions

View file

@ -1041,7 +1041,11 @@ class AuthMiddleware(BaseHTTPMiddleware):
return await call_next(request) return await call_next(request)
# Allow login page static assets # Allow login page static assets
if path == "/login.html" or path == "/login-style.css": if (
path == "/login.html"
or path == "/login-style.css"
or path.startswith("/icons/")
):
return await call_next(request) return await call_next(request)
# WebSocket upgrade for /ws/live — allow (browser WS, read-only) # WebSocket upgrade for /ws/live — allow (browser WS, read-only)

View file

@ -11,26 +11,23 @@
flex-direction: column; flex-direction: column;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
background: #0a0a0a; background: #000;
background-image:
radial-gradient(ellipse at 50% 35%, rgba(30, 20, 10, 0.9) 0%, transparent 60%),
linear-gradient(180deg, #0a0806 0%, #12100a 50%, #0a0806 100%);
font-family: "Palatino Linotype", "Book Antiqua", Palatino, serif; font-family: "Palatino Linotype", "Book Antiqua", Palatino, serif;
color: #d4c9a8; color: #b0aaa0;
} }
.logo-container { .logo-container {
margin-bottom: 28px; margin-bottom: 24px;
} }
.logo-container img { .logo-container img {
display: block; display: block;
width: 380px; width: 400px;
height: auto; height: auto;
} }
.quote-container { .quote-container {
height: 44px; height: 44px;
margin-bottom: 24px; margin-bottom: 22px;
text-align: center; text-align: center;
width: 500px; width: 500px;
display: flex; display: flex;
@ -38,9 +35,9 @@
justify-content: center; justify-content: center;
} }
.quote-text { .quote-text {
font-size: 0.8rem; font-size: 0.78rem;
font-style: italic; font-style: italic;
color: #8a7a5a; color: #706858;
line-height: 1.4; line-height: 1.4;
opacity: 0; opacity: 0;
transition: opacity 0.8s ease; transition: opacity 0.8s ease;
@ -48,30 +45,27 @@
.quote-text.visible { opacity: 1; } .quote-text.visible { opacity: 1; }
.quote-attribution { .quote-attribution {
display: block; display: block;
font-size: 0.6rem; font-size: 0.58rem;
font-style: normal; font-style: normal;
color: #5a4a34; color: #484034;
margin-top: 4px; margin-top: 4px;
letter-spacing: 1px; letter-spacing: 1px;
} }
.login-card { .login-card {
width: 440px; width: 440px;
background: linear-gradient(180deg, #1a1610 0%, #0e0c08 100%); background: #0c0c0c;
border: 1px solid #5a4a28; border: 1px solid #2a2520;
border-radius: 4px; border-radius: 4px;
padding: 24px 28px 20px; padding: 24px 28px 20px;
box-shadow: box-shadow: 0 8px 40px rgba(0, 0, 0, 0.6);
inset 0 1px 0 rgba(212, 175, 55, 0.08),
0 8px 32px rgba(0, 0, 0, 0.8),
0 0 60px rgba(138, 122, 68, 0.06);
} }
.login-title { .login-title {
text-align: center; text-align: center;
margin-bottom: 20px; margin-bottom: 20px;
font-size: 0.75rem; font-size: 0.75rem;
color: #8a7a5a; color: #706050;
text-transform: uppercase; text-transform: uppercase;
letter-spacing: 3px; letter-spacing: 3px;
} }
@ -87,7 +81,7 @@
.form-field label { .form-field label {
display: block; display: block;
font-size: 0.7rem; font-size: 0.7rem;
color: #7a6a4a; color: #585048;
margin-bottom: 5px; margin-bottom: 5px;
text-transform: uppercase; text-transform: uppercase;
letter-spacing: 1px; letter-spacing: 1px;
@ -97,19 +91,19 @@
padding: 9px 11px; padding: 9px 11px;
font-size: 0.9rem; font-size: 0.9rem;
font-family: inherit; font-family: inherit;
background: #080704; background: #060606;
color: #d4c9a8; color: #c0b8a8;
border: 1px solid #3a3018; border: 1px solid #2a2520;
border-radius: 3px; border-radius: 3px;
outline: none; outline: none;
transition: border-color 0.2s; transition: border-color 0.2s;
} }
.form-field input:focus { .form-field input:focus {
border-color: #d4af37; border-color: #8a7a50;
box-shadow: 0 0 6px rgba(212, 175, 55, 0.12); box-shadow: 0 0 6px rgba(138, 122, 80, 0.15);
} }
.form-field input::placeholder { .form-field input::placeholder {
color: #3a3220; color: #2a2520;
} }
.login-btn { .login-btn {
@ -118,9 +112,9 @@
font-family: inherit; font-family: inherit;
font-size: 0.85rem; font-size: 0.85rem;
font-weight: bold; font-weight: bold;
color: #1a1610; color: #0c0c0c;
background: linear-gradient(180deg, #d4af37 0%, #a08520 100%); background: linear-gradient(180deg, #9a8a60 0%, #706040 100%);
border: 1px solid #8a7a44; border: 1px solid #5a5038;
border-radius: 3px; border-radius: 3px;
cursor: pointer; cursor: pointer;
text-transform: uppercase; text-transform: uppercase;
@ -128,11 +122,11 @@
transition: background 0.2s, box-shadow 0.2s; transition: background 0.2s, box-shadow 0.2s;
} }
.login-btn:hover { .login-btn:hover {
background: linear-gradient(180deg, #e0c050 0%, #b89a30 100%); background: linear-gradient(180deg, #b0a070 0%, #8a7a50 100%);
box-shadow: 0 2px 8px rgba(212, 175, 55, 0.3); box-shadow: 0 2px 8px rgba(138, 122, 80, 0.25);
} }
.login-btn:active { .login-btn:active {
background: linear-gradient(180deg, #a08520 0%, #8a7a44 100%); background: linear-gradient(180deg, #706040 0%, #5a5038 100%);
} }
.login-error { .login-error {
@ -140,9 +134,9 @@
padding: 8px; padding: 8px;
text-align: center; text-align: center;
font-size: 0.8rem; font-size: 0.8rem;
color: #ff6b6b; color: #cc5555;
background: rgba(255, 50, 50, 0.08); background: rgba(200, 50, 50, 0.06);
border: 1px solid rgba(255, 50, 50, 0.2); border: 1px solid rgba(200, 50, 50, 0.15);
border-radius: 3px; border-radius: 3px;
display: none; display: none;
} }
@ -151,7 +145,7 @@
margin-top: 16px; margin-top: 16px;
text-align: center; text-align: center;
font-size: 0.6rem; font-size: 0.6rem;
color: #3a3220; color: #2a2520;
letter-spacing: 1px; letter-spacing: 1px;
} }
</style> </style>