improve modal UX #2440

MTES-MCT · Apr 16, 2024 · 943bf0c · 943bf0c
1 parent 7ce75f7
commit 943bf0c
Show file tree

Hide file tree

Showing 3 changed files with 11 additions and 8 deletions.
diff --git a/src/Entity/Enum/DocumentType.php b/src/Entity/Enum/DocumentType.php
@@ -55,12 +55,12 @@ public static function getPhotosList(): array
     public static function getSituationList(): array
     {
         return [
-            self::PHOTO_SITUATION->name => self::PHOTO_SITUATION->label(),
-            self::AUTRE->name => self::AUTRE->label(),
             self::SITUATION_FOYER_BAIL->name => self::SITUATION_FOYER_BAIL->label(),
             self::SITUATION_FOYER_DPE->name => self::SITUATION_FOYER_DPE->label(),
             self::SITUATION_FOYER_ETAT_DES_LIEUX->name => self::SITUATION_FOYER_ETAT_DES_LIEUX->label(),
             self::SITUATION_DIAGNOSTIC_PLOMB_AMIANTE->name => self::SITUATION_DIAGNOSTIC_PLOMB_AMIANTE->label(),
+            self::PHOTO_SITUATION->name => self::PHOTO_SITUATION->label(),
+            self::AUTRE->name => self::AUTRE->label(),
         ];
     }
 

diff --git a/templates/_partials/_modal_upload_files.html.twig b/templates/_partials/_modal_upload_files.html.twig
@@ -29,7 +29,7 @@
                                 <div>
                                     Ajouter un ou plusieurs documents. Pour chaque document, veuillez renseigner son type.
                                 </div>
-                                <div class="fr-alert fr-alert--info fr-alert--sm">
+                                <div class="fr-alert fr-alert--info fr-alert--sm fr-mt-1w ">
                                     <p>Pour ajouter des documents de type Bail, DPE, Diagnostic et Etat des lieux, rendez-vous dans la partie "Déclaration usager".</p>
                                 </div>
                             </div>
@@ -40,8 +40,11 @@
                                 <div>
                                     Ajouter un ou plusieurs documents. Pour chaque document, veuillez renseigner son type.
                                 </div>
-                                <div class="fr-alert fr-alert--warning fr-alert--sm">
-                                    <p>Ces photos seront partagées à l'usager.</p>
+                                <div class="fr-alert fr-alert--info fr-alert--sm fr-mt-1w ">
+                                    <p>Pour ajouter des documents concernant la procédure ou le bailleur, rendez-vous dans la partie "Documents partenaires".</p>
+                                </div>
+                                <div class="fr-alert fr-alert--warning fr-alert--sm fr-mt-1w ">
+                                    <p>Ces documents seront partagés à l'usager.</p>
                                 </div>
                             </div>
                         </div>
@@ -52,7 +55,7 @@
                             <div>
                                 Ajouter une ou plusieurs photos au signalement. Pour chaque photo, veuillez sélectionner le désordre auquel elle est rattachée. 
                             </div>
-                            <div class="fr-alert fr-alert--warning fr-alert--sm">
+                            <div class="fr-alert fr-alert--warning fr-alert--sm fr-mt-1w ">
                                 <p>Ces photos seront partagées à l'usager.</p>
                             </div>
                         </div>

diff --git a/templates/back/signalement/view/visites/modals/visites-modal-upload-files.html.twig b/templates/back/signalement/view/visites/modals/visites-modal-upload-files.html.twig
@@ -29,15 +29,15 @@
                             <div>
                                 Ajouter une ou plusieurs photos au signalement. 
                             </div>
-                            <div class="fr-alert fr-alert--warning fr-alert--sm">
+                            <div class="fr-alert fr-alert--warning fr-alert--sm fr-mt-1w ">
                                 <p>Les photos seront partagées à l'usager.</p>
                             </div>
                         </div>
                         <div class="modal-upload-upload-container fr-mb-4w">
                             <div class="modal-upload-drop-section">
                                 <span class="fr-icon-upload-2-line fr-icon--lg fr-text-label--blue-france"></span>
                                 <div class="modal-upload-drop-section-label fr-mt-1w">
-                                    Faites glisser vos documents ici
+                                    Faites glisser vos photos ici
                                 </div>
                             </div>
                             <p class="fr-mb-1w">ou</p>