fix + ajout consigne d'étude

Author: RomainPennec

Diff for: api/src/devcomp/infrastructure/datasources/learning-content/modules/bien-ecrire-son-adresse-mail.json

@@ -28,7 +28,7 @@
       "grainId": "edd7fec3-a649-425b-b8e3-65b13c6c47ea"
     },
     {
-      "content": "<p>Pour finir, à vous de jouer : vous allez devoir trouver l'adresse mail de Naomi.</p>",
+      "content": "<p>Pour finir, à vous de jouer : vous allez devoir trouver l'adresse mail de Naomi.<span aria-hidden=\"true\">💫</span></p>",
       "grainId": "b7ea7630-824a-4a49-83d1-abb9b8d0d120"
     }
   ],
@@ -56,6 +56,14 @@
       "type": "lesson",
       "title": "Explications : les parties d’une adresse mail",
       "components": [
+        {
+          "type": "element",
+          "element": {
+            "id": "acf16c79-b788-4ebe-b7a1-4138eef3db2f",
+            "type": "text",
+            "content": "<p>Après les explications suivantes, vous devrez répondre à des questions sur l'adresse mail : ordre des parties, caractères autorisés, etc.</p>"
+          }
+        },
         {
           "type": "stepper",
           "steps": [
@@ -87,7 +95,7 @@
                 {
                   "id": "c1f3c8c7-6d5c-4c6c-9c4d-1a3d8f7e9f5d",
                   "type": "text",
-                  "content": "<h3 class=\"screen-reader-only\">L'identifiant</h3><h4>Partie 1&nbsp;: l’identifiant. Cette partie est choisie par Mickaël.</h4><p>Tous les identifiants sont possibles, ou presque, même avec des majuscules&#8239;!</p><ul><li><span aria-hidden=\"true\">✅</span> Par exemple&nbsp;: <code>mika.aubert</code> ; <code>mika671</code> ou <code>G3oDu671</code></li><li><span aria-hidden=\"true\">❌</span> Mais certains caractères sont interdits ou à éviter&nbsp;: &amp; ; @ ; é ; â ; $ ; * ; € ; etc.</li></ul><p>Un conseil si vous envoyez des mails importants : utilisez une adresse mail avec un identifiant classique, par exemple <code>prenom.nom</code></p>."
+                  "content": "<h3 class=\"screen-reader-only\">L'identifiant</h3><h4>Partie 1&nbsp;: l’identifiant. Cette partie est choisie par Mickaël.</h4><p>Tous les identifiants sont possibles, ou presque, même avec des majuscules&#8239;!</p><ul><li><span aria-hidden=\"true\">✅</span> Par exemple&nbsp;: <code>mika.aubert</code> ; <code>mika671</code> ou <code>G3oDu671</code></li><li><span aria-hidden=\"true\">❌</span> Mais certains caractères sont interdits ou à éviter&nbsp;: &amp; ; @ ; é ; â ; $ ; * ; € ; etc.</li></ul><p><br>Un conseil si vous envoyez des mails importants : utilisez une adresse mail avec un identifiant classique, par exemple <code>prenom.nom</code>.</p>"
                 }
               ]
             },
@@ -103,7 +111,7 @@
                 {
                   "id": "ad8ad08a-3ff7-4228-8233-6cd5ce0f4812",
                   "type": "text",
-                  "content": "<h3 class=\"screen-reader-only\">L'arobase</h3><h4>Au centre, l’arobase sépare l’identifiant du fournisseur d’adresse mail.</h4><p><span aria-hidden=\"true\">🇬🇧</span> En anglais, ce symbole se lit <i lang=\"en\">“at”</i> et veut dire “chez”.</p><p><span aria-hidden=\"true\">💡</span> L'arobase est un symbole qui était utilisé avant l’informatique. En 1970, il a été choisi pour écrire les adresses mail car il était très peu utilisé et facile à repérer.</p>"
+                  "content": "<h3 class=\"screen-reader-only\">L'arobase</h3><h4>Au centre, l’arobase sépare l’identifiant du fournisseur d’adresse mail.</h4><p>En anglais, ce symbole se lit <i lang=\"en\">“at”</i> et veut dire “chez”.</p><p><br><span aria-hidden=\"true\">💡</span> L'arobase est un symbole qui était utilisé avant l’informatique. En 1970, il a été choisi pour écrire les adresses mail car il était très peu utilisé et facile à repérer.</p>"
                 }
               ]
             },
@@ -119,7 +127,7 @@
                 {
                   "id": "1fd829f8-1799-4779-a28d-5d26fba31b8b",
                   "type": "text",
-                  "content": "<h3 class=\"screen-reader-only\">Le fournisseur d’adresse mail</h3><h4>Partie 2&nbsp;: le fournisseur d’adresse mail. Cette partie de l’adresse est donnée par le fournisseur.</h4><p><span aria-hidden=\"true\">✅</span> Voici des exemples de fournisseurs d’adresses mail&nbsp;: </p><ul><li>La Poste (laposte.net)</li><li>Google (gmail.com)</li><li>Yahoo (yahoo.com, yahoo.fr)</li><li>Microsoft (hotmail.com, live.fr)</li></ul><p>Quand vous écrivez une adresse mail, soyez attentifs à l'extension (<i>.fr</i>, <i>.com</i>, etc.). C'est important pour que le mail soit envoyé à la bonne adresse. <span aria-hidden=\"true\">🧐</span></p>"
+                  "content": "<h3 class=\"screen-reader-only\">Le fournisseur d’adresse mail</h3><h4>Partie 2&nbsp;: le fournisseur d’adresse mail. Cette partie de l’adresse est donnée par le fournisseur.</h4><p><span aria-hidden=\"true\">✅</span> Voici des exemples de fournisseurs d’adresses mail&nbsp;: </p><ul><li>La Poste (laposte.net)</li><li>Google (gmail.com)</li><li>Yahoo (yahoo.com, yahoo.fr)</li><li>Microsoft (hotmail.com, live.fr)</li></ul><p><br>Quand vous écrivez une adresse mail, soyez attentifs à l'extension (<i>.fr</i>, <i>.com</i>, etc.). C'est important pour que le mail soit envoyé à la bonne adresse. <span aria-hidden=\"true\">🧐</span></p>"
                 }
               ]
             }
@@ -359,7 +367,7 @@
           "element": {
             "id": "b0fcb950-b5b1-4384-886e-79fb852d5bb7",
             "type": "text",
-            "content": "<h3><span aria-hidden=\"true\">📌</span> Résumons avant de passer à la suite</h3><ul><li>C'est l'utilisateur qui choisi son identifiant d'adresse mail. Il peut utiliser des chiffres ou des majuscules.<br><span aria-hidden=\"true\">✅</span> Exemples&nbsp;: <code>mika.aubert</code> ; <code>M3g4Cool1415</code>, etc.</li><li>Il y a une @ (arobase) dans une adresse mail. Elle permet de séparer l’identifiant du fournisseur d’adresse mail.</li><li>Les adresses mails se terminent de différentes manières après l'@, selon le fournisseur d’adresse mail.<br><span aria-hidden=\"true\">✅</span> Exemples&nbsp;: laposte.net, free.fr, gmail.com, yahoo.com, etc.</li></ul>"
+            "content": "<h3><span aria-hidden=\"true\">📌</span> Résumons avant de passer à la suite</h3><ul><li>C'est l'utilisateur qui choisit son identifiant d'adresse mail. Il peut utiliser des chiffres ou des majuscules.<br><span aria-hidden=\"true\">✅</span> Exemples&nbsp;: <code>mika.aubert</code> ; <code>M3g4Cool1415</code>, etc.</li><li>Il y a une @ (arobase) dans une adresse mail. Elle permet de séparer l’identifiant du fournisseur d’adresse mail.</li><li>Les adresses mails se terminent de différentes manières après l'@, selon le fournisseur d’adresse mail.<br><span aria-hidden=\"true\">✅</span> Exemples&nbsp;: laposte.net, free.fr, gmail.com, yahoo.com, etc.</li></ul>"
           }
         }
       ]
@@ -394,7 +402,7 @@
               }
             ],
             "feedbacks": {
-              "valid": "<span class=\"feedback__state\">Correct.&nbsp;<span aria-hidden=\"true\">🎉</span></span><p>Tout est dans l'ordre&nbsp;: l'identifiant, l'arobase puis le fournisseur d'adresse mail</p>",
+              "valid": "<span class=\"feedback__state\">Bravo !&nbsp;<span aria-hidden=\"true\">💫</span></span><p>Tout est dans l'ordre&nbsp;: l'identifiant, l'arobase puis le fournisseur d'adresse mail</p>",
               "invalid": "<span class=\"feedback__state\">Incorrect.</span><p>Pour réussir la prochaine fois, utilisez les indices ci-dessous&nbsp;<span aria-hidden=\"true\">👇</span> </p>"
             }
           }