Display: simplify & troll

src/confidentialite.html

@@ -22,7 +22,7 @@
         <header class="wrapper">
           <picture>
             <source srcset="/MIN_Interieur_RVB_dark.svg" media="(prefers-color-scheme: dark)">
-              <img src="/MIN_Interieur_RVB.svg" alt="Ministère de l'intérieur. Liberté, égalité, fraternité." class="logo" role="presentation" aria-hidden="true">
+              <img src="/MIN_Interieur_RVB.png" alt="Ministère de l'intérieur. Liberté, égalité, fraternité." class="logo" role="presentation" aria-hidden="true">
           </picture>
             <div class="header-content">
                 <h1 class="flex flex-wrap">

src/form-data.json

@@ -110,38 +110,47 @@
       "items": [
         {
           "code": "travail",
-          "label": "Déplacements entre le domicile et le lieu d’exercice de l’activité professionnelle ou un établissement d’enseignement ou de formation, déplacements professionnels ne pouvant être différés <a class=\"footnote\" href=\"#footnote2\">[2]</a> , déplacements pour un concours ou un examen."
+          "short": "Travail",
+          "label": "Déplacements entre le domicile et le lieu d’exercice de l’activité professionnelle ou un établissement d’enseignement ou de formation, déplacements professionnels ne pouvant être différés [2], déplacements pour un concours ou un examen."
         },
         {
           "code": "achats",
-          "label": "Déplacements pour effectuer des achats de fournitures nécessaires à l'activité professionnelle, des achats de première nécessité <a class=\"footnote\" href=\"#footnote3\">[3]</a> dans des établissements dont les activités demeurent autorisées, le retrait de commande et les livraisons à domicile ;"
+          "short": "Courses",
+          "label": "Déplacements pour effectuer des achats de fournitures nécessaires à l'activité professionnelle, des achats de première nécessité [3] dans des établissements dont les activités demeurent autorisées, le retrait de commande et les livraisons à domicile ;"
         },
         {
           "code": "sante",
+          "short": "Santé",
           "label": "Consultations, examens et soins ne pouvant être assurés à distance et l’achat de médicaments ;"
         },
         {
           "code": "famille",
+          "short": "Porter assistance",
           "label": " Déplacements pour motif familial impérieux, pour l'assistance aux personnes vulnérables et précaires ou la garde d'enfants ;"
         },
         {
           "code": "handicap",
+          "short": "Handicap",
           "label": "Déplacement des personnes en situation de handicap et leur accompagnant ;"
         },
         {
           "code": "sport_animaux",
+          "short": "Promenade",
           "label": "Déplacements brefs, dans la limite d'une heure quotidienne et dans un rayon maximal d'un kilomètre autour du domicile, liés soit à l'activité physique individuelle des personnes, à l'exclusion de toute pratique sportive collective et de toute proximité avec d'autres personnes, soit à la promenade avec les seules personnes regroupées dans un même domicile, soit aux besoins des animaux de compagnie ;"
         },
         {
           "code": "convocation",
+          "short": "Convocation",
           "label": " Convocation judiciaire ou administrative et pour se rendre dans un service public ;"
         },
         {
           "code": "missions",
+          "short": "Mission d'intérêt général",
           "label": " Participation à des missions d'intérêt général sur demande de l'autorité administrative ;"
         },
         {
           "code": "enfants",
+          "short": "Chercher les enfants",
           "label": "Déplacement pour chercher les enfants à l’école et à l’occasion de leurs activités périscolaires ;"
         }
       ]

src/index.html

@@ -32,7 +32,7 @@
     <header role="banner" class="wrapper">
         <picture>
             <source srcset="/MIN_Interieur_RVB_dark.svg" media="(prefers-color-scheme: dark)">
-            <img src="/MIN_Interieur_RVB.svg" alt="Ministère de l'intérieur. Liberté, égalité, fraternité."
+            <img src="/MIN_Interieur_RVB.png" alt="Ministère de l'intérieur. Liberté, égalité, fraternité."
                 class="logo" role="presentation" aria-hidden="true">
         </picture>
 
@@ -42,13 +42,9 @@
                     COVID-19
                 </span>
                 <span class="covid-subtitle">
-                  Attestation de déplacement dérogatoire
+                  Attestation pour aller chercher le pain
                 </span>
             </h1>
-            <p class="text-desc">
-                En application du décret n°2020-1310 du 29 octobre 2020 prescrivant les mesures générales 
-                nécessaires pour faire face à l'épidémie de Covid19 dans le cadre de l'état d'urgence sanitaire 
-            </p>
 
         </div>
     </header>
@@ -85,7 +81,7 @@
             Le code source de ce service est consultable sur <a href="https://github.com/LAB-MI/attestation-deplacement-derogatoire-q4-2020" class="github-link">GitHub</a>.
         </p>
         <p class="label-mi">
-            Ministère de l'Intérieur - DNUM - SDIT
+            Ministère de l'Intérieur - DNUM - SDIT + tobast
         </p>
         <picture class="center">
           <source srcset="/logo_dnum_dark.svg" media="(prefers-color-scheme: dark)">

src/js/form.js

@@ -97,7 +97,8 @@ const createReasonField = (reasonData) => {
   }
   const inputReason = createElement('input', inputReasonAttrs)
 
-  const labelAttrs = { innerHTML: reasonData.label, className: 'form-checkbox-label', for: id }
+  const realLabel = '<span title="' + reasonData.label + '">' + reasonData.short + '</span>'
+  const labelAttrs = { innerHTML: realLabel, className: 'form-checkbox-label', for: id }
   const label = createElement('label', labelAttrs)
 
   appendToReason([inputReason, label])
@@ -123,7 +124,7 @@ const createReasonFieldset = (reasonsData) => {
   const textAlert = createElement('p', textAlertAttrs)
 
   const textSubscribeReasonAttrs = {
-    innerHTML: 'certifie que mon déplacement est lié au motif suivant (cocher la case) autorisé par le décret n°2020-1310 du 29 octobre 2020 prescrivant les mesures générales nécessaires pour faire face à l\'épidémie de Covid19 dans le cadre de l\'état d\'urgence sanitaire  <a class="footnote" href="#footnote1">[1]</a>&nbsp;:',
+    innerHTML: 'Je certifie que… toussa.',
   }
 
   const textSubscribeReason = createElement('p', textSubscribeReasonAttrs)