Titlu pagina, antet brand si /login afiseaza acum 'ROA AUTOPASS'. Include redesignul sectiunii Problem+Calculator combinata din landing. Teste de antet/nav aliniate la noul nume. Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
60 lines
2.6 KiB
HTML
60 lines
2.6 KiB
HTML
{% extends "base.html" %}
|
|
{% block title %}Autentificare — ROA AUTOPASS{% endblock %}
|
|
{% block content %}
|
|
{# US-010 (PRD 5.16): /login — layout 2 coloane branduit.
|
|
Stanga: logo + tagline + puncte de incredere.
|
|
Dreapta: formular de autentificare (neschimbat: CSRF, POST /login, link signup).
|
|
Pe mobil (<640px): se stivuiesc, partea dreapta (formular) iese prima. #}
|
|
<div class="login-2col" style="max-width:860px; margin:32px auto;">
|
|
{# Antet minimal deja randat in base.html (fara RAR dot, fara burger, fara account_name) #}
|
|
<div class="login-shell">
|
|
{# === Formular autentificare === #}
|
|
<div class="login-form-col">
|
|
<h3 style="font-size:var(--fs-xl); margin:0 0 4px;">Autentificare</h3>
|
|
<p style="font-size:var(--fs-sm); color:var(--muted); margin:0 0 22px;">
|
|
Intra in contul service-ului tau.
|
|
</p>
|
|
|
|
{% if error %}
|
|
<div class="banner" style="margin-bottom:14px; padding:8px 12px;">{{ error }}</div>
|
|
{% endif %}
|
|
|
|
<form method="post" action="/login">
|
|
<input type="hidden" name="csrf_token" value="{{ csrf_token }}">
|
|
<div class="camp-slim">
|
|
<label for="lf-email">Email</label>
|
|
<input id="lf-email" type="email" name="email" required autocomplete="email">
|
|
</div>
|
|
<div class="camp-slim" style="margin-bottom:14px;">
|
|
<label for="lf-parola">Parola</label>
|
|
<input id="lf-parola" type="password" name="parola" required autocomplete="current-password">
|
|
</div>
|
|
<button type="submit" class="btn-primary-full">Intra in cont</button>
|
|
</form>
|
|
|
|
<p class="login-foot">
|
|
Cont nou? <a href="/signup" style="color:var(--accent);">Inregistreaza service-ul</a>
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<style>
|
|
/* US-010 PRD 5.16: layout /login profesional 2 coloane. */
|
|
.login-shell {
|
|
display:grid; grid-template-columns:1fr;
|
|
border:1px solid var(--line); border-radius:16px; overflow:hidden;
|
|
background:var(--card); max-width:460px; margin:0 auto;
|
|
}
|
|
.login-form-col { padding:40px 38px; display:flex; flex-direction:column; justify-content:center; }
|
|
.btn-primary-full { width:100%; min-height:46px; font-family:var(--font-ui); font-size:var(--fs-md);
|
|
font-weight:600; background:var(--accent); color:#fff; border:none;
|
|
border-radius:8px; cursor:pointer; margin-top:4px; }
|
|
.btn-primary-full:hover { filter:brightness(1.08); }
|
|
.login-foot { text-align:center; font-size:var(--fs-sm); color:var(--muted); margin-top:18px; }
|
|
@media (max-width:640px) {
|
|
.login-form-col { padding:28px 22px; }
|
|
}
|
|
</style>
|
|
{% endblock %}
|