templates/security/beta_request.html.twig line 1

Open in your IDE?
  1. {% extends 'base.html.twig' %}
  3. {% block title %}Accès bêta — LE LORRAIN SELECT{% endblock %}
  5. {% block body %}
  6. {# L'en-tête du site est en position fixe : sans ce dégagement, la carte passe
  7.    dessous et le titre est tronqué. #}
  8. <section class="container beta-wrap">
  9.     <div class="card shadow-sm beta-card">
  11.         <h2 class="text-center mb-3">Accès bêta</h2>
  13.         {% if sent %}
  14.             <div class="alert alert-success text-center mb-2">
  15.                 Un email vient de vous être envoyé. Merci de cliquer sur le lien
  16.                 qu'il contient pour accéder à LE LORRAIN SELECT.
  17.             </div>
  18.             <p class="text-center small text-muted mb-3">
  19.                 Ce lien est valable 30 minutes et ne fonctionne qu'une seule fois.
  20.                 Il vous ouvrira ensuite l'accès pendant 24 heures.<br>
  21.                 Pensez à vérifier vos spams si vous ne le recevez pas sous quelques minutes.
  22.             </p>
  24.             {# Un seul bouton après l'envoi : retour à la page d'accès #}
  25.             <a href="{{ path('beta_request') }}" class="btn btn-outline-secondary w-100">
  26.                 ← Retour
  27.             </a>
  28.         {% else %}
  29.             <p class="text-muted small text-center mb-3">
  30.                 Saisissez votre adresse email pour recevoir votre lien de connexion.
  31.             </p>
  33.             {# `error` est passé par le contrôleur, et non via un flash : celui-ci
  34.                serait consommé par _flash.html.twig, inclus avant le bloc body. #}
  35.             {% if error %}
  36.                 <div class="alert alert-danger small beta-error">{{ error }}</div>
  37.             {% endif %}
  39.             <form method="post">
  40.                 <div class="mb-3">
  41.                     <label for="email" class="form-label small">Adresse email</label>
  42.                     <input type="email" name="email" id="email" class="form-control form-control-lg"
  43.                            placeholder="votre.email@exemple.com" required autofocus>
  44.                 </div>
  45.                 <button type="submit" class="btn btn-primary btn-lg w-100">Recevoir mon lien</button>
  46.             </form>
  48.             <div class="beta-sep"><span>ou</span></div>
  50.             <p class="text-muted small text-center mb-2">
  51.                 Vous n'avez pas encore d'accès&nbsp;?
  52.             </p>
  53.             <a href="{{ path('beta_access_request') }}" class="btn btn-outline-primary w-100">
  54.                 Demander un accès
  55.             </a>
  56.         {% endif %}
  58.     </div>
  59. </section>
  61. <style>
  62.     .beta-wrap {
  63.         display: flex;
  64.         justify-content: center;
  65.         align-items: flex-start;
  66.         min-height: 70vh;
  67.         /* Dégage la hauteur de l'en-tête fixe du site */
  68.         padding-top: 200px;
  69.         padding-bottom: 60px;
  70.     }
  72.     .beta-card {
  73.         max-width: 440px;
  74.         width: 100%;
  75.         border-radius: 1rem;
  76.         padding: 1.5rem !important;
  77.         background: #fff;
  78.     }
  80.     .beta-card .form-control {
  81.         border-radius: 0.35rem;
  82.         padding: 0.5rem 0.7rem;
  83.         font-size: 0.95rem;
  84.     }
  86.     .beta-card .btn {
  87.         border-radius: 0.35rem;
  88.         padding: 0.5rem 0.8rem;
  89.         font-size: 0.95rem;
  90.     }
  92.     /* Séparateur « ou » entre les deux parcours */
  93.     .beta-sep {
  94.         display: flex;
  95.         align-items: center;
  96.         gap: 10px;
  97.         margin: 18px 0 14px;
  98.         color: #adb5bd;
  99.         font-size: 0.8rem;
  100.     }
  102.     .beta-sep::before,
  103.     .beta-sep::after {
  104.         content: "";
  105.         flex: 1;
  106.         height: 1px;
  107.         background: #e5e5e5;
  108.     }
  110.     .beta-card .beta-error {
  111.         border-radius: 0.35rem;
  112.         padding: 0.7rem 0.9rem !important;
  113.         line-height: 1.45;
  114.     }
  116.     @media (max-width: 992px) {
  117.         .beta-wrap { padding-top: 130px; }
  118.     }
  119. </style>
  120. {% endblock %}