Structured connexion form

src/Controller/SecurityController.php

@@ -34,7 +34,7 @@ class SecurityController extends AbstractController {
         return $this->render(
             'security/sign-in.html.twig',
             [
-                'last_username' => $authenticationUtils->getLastUsername(),
+                'username' => $authenticationUtils->getLastUsername(),
             ]
         );
     }

templates/security/sign-in.html.twig

@@ -1,26 +1,31 @@
 {% trans_default_domain 'security' %}
 {% extends 'base.html.twig' %}
 
-{% block title %}{%  trans %}sign.in{% endtrans %}{% endblock %}
+{% block title %}{% trans %}sign.in{% endtrans %}{% endblock %}
 
 {% block body %}
-    <form method="post">
+    <h1>{% trans %}sign.in{% endtrans %}</h1>
-        <h1 class="h3 mb-3 font-weight-normal">{% trans %}sign.in{% endtrans %}</h1>
 
-        <label for="email">{% trans %}user.email{% endtrans %}</label>
+    <section>
-        <input type="email" value="{{ last_username }}" name="email" id="email" class="form-control" required autofocus>
+        <form method="POST">
+            <input type="hidden" name="_csrf_token" value="{{ csrf_token('authenticate') }}">
 
-        <label for="password">{% trans %}user.password{% endtrans %}</label>
+            <div>
-        <input type="password" name="password" id="password" class="form-control" required>
+                <label for="email">{% trans %}user.email{% endtrans %}</label>
+                <input type="email" value="{{ username }}" name="email" id="email" required autofocus>
+            </div>
 
-        <input type="hidden" name="_csrf_token" value="{{ csrf_token('authenticate') }}">
+            <div>
+                <label for="password">{% trans %}user.password{% endtrans %}</label>
+                <input type="password" name="password" id="password" required>
+            </div>
 
-        <div class="checkbox mb-3">
+            <div>
-            <label>
+                <label for="remember_me">{% trans %}sign.remember_me{% endtrans %}</label>
-                <input type="checkbox" name="_remember_me"> {% trans %}sign.remember_me{% endtrans %}
+                <input type="checkbox" name="_remember_me" id="remember_me">
-            </label>
+            </div>
-        </div>
 
-        <button class="btn btn-lg btn-primary" type="submit">{% trans %}sign.in{% endtrans %}</button>
+            <button class="btn btn-lg btn-primary" type="submit">{% trans %}sign.in{% endtrans %}</button>
-    </form>
+        </form>
+    </section>
 {% endblock %}