From 0e4d78471b2ed1ca5f88219e6928ff8533f69857 Mon Sep 17 00:00:00 2001 From: Matt Edholm Date: Fri, 15 May 2026 15:19:41 -0400 Subject: [PATCH] fix(design-v2): apply v2 styles to login template Twig login page was hardcoded with v1 cream/terracotta colors and had no [data-design=v2] overrides. Cookie + html attribute injection were working but had nothing to style off. Adding v2 overrides inline so the login page matches the v2 register the rest of the app uses. Default v2 palette on login uses ocean-dusk values (navy + cream text + yellow V brand) since user isn't logged in yet so we can't read their theme preference. Co-Authored-By: Claude Opus 4.7 (1M context) --- templates/security/login.html.twig | 41 ++++++++++++++++++++++++++++++ 1 file changed, 41 insertions(+) diff --git a/templates/security/login.html.twig b/templates/security/login.html.twig index 7aae541..6ed49e1 100644 --- a/templates/security/login.html.twig +++ b/templates/security/login.html.twig @@ -72,6 +72,47 @@ .register-link a { color: #c97c3a; text-decoration: none; font-weight: 600; } .logo-badge { display: block; width: 88px; height: 88px; margin: 0 auto 1.25rem; border-radius: 14px; overflow: hidden; border: 1px solid #e8d9c4; box-shadow: 0 2px 10px rgba(0,0,0,.06); } .logo-badge img { display: block; width: 100%; height: 100%; } + + /* ── v2 (atmospheric dusks) overrides ── */ + @import url('https://fonts.googleapis.com/css2?family=Marcellus&family=Cormorant+Garamond:ital@0;1&display=swap'); + [data-design="v2"] body { + background: radial-gradient(ellipse 90% 70% at 50% 30%, #142a40 0%, transparent 70%), #06121f; + color: #f4eed8; + } + [data-design="v2"] .card { + background: #0e2030; + border: 1px solid rgba(180,210,235,0.20); + box-shadow: 0 24px 48px -16px rgba(0,0,0,0.6); + } + [data-design="v2"] h1 { + font-family: 'Marcellus', Georgia, serif; + font-weight: 400; + color: #f4eed8; + } + [data-design="v2"] label { + color: #b8c8d8; + font-size: 0.7rem; + letter-spacing: 0.18em; + text-transform: uppercase; + } + [data-design="v2"] input[type="email"], + [data-design="v2"] input[type="password"] { + background: rgba(0,0,0,0.3); + border-color: rgba(180,210,235,0.20); + color: #f4eed8; + } + [data-design="v2"] input:focus { border-color: #f0d000; } + [data-design="v2"] .btn { + background: #4e9fc8; + color: #06121f; + } + [data-design="v2"] .field-error { color: #e08070; } + [data-design="v2"] .register-link { color: #b8c8d8; font-family: 'Cormorant Garamond', Georgia, serif; font-style: italic; } + [data-design="v2"] .register-link a { color: #f0d000; font-style: normal; } + [data-design="v2"] .logo-badge { + border-color: rgba(180,210,235,0.20); + box-shadow: 0 6px 18px -4px rgba(0,0,0,0.5); + }