Améliorations diverses sur l'accessibilité (#4530)

Usager : améliorations diverses sur l'accessibilité

app/assets/stylesheets/new_design/buttons.scss

@@ -130,6 +130,10 @@
   }
 }
 
+.state-button {
+  display: inline-block;
+}
+
 .dropdown {
   display: inline-block;
   position: relative;
@@ -213,10 +217,13 @@
       }
     }
 
-    &.selected,
-    &:hover:not(.inactive) {
-      background: $light-grey;
+    &:not(.inactive) {
       cursor: pointer;
+
+      &:hover,
+      &.selected {
+        background: $light-grey;
+      }
     }
 
     &.danger {

app/assets/stylesheets/new_design/new_header.scss

@@ -150,6 +150,8 @@ $header-mobile-breakpoint: 550px;
   }
 
   button {
+    @extend %outline;
+
     padding: 9px;
     border: none;
     background: none;

app/views/instructeurs/dossiers/_header_actions.html.haml

@@ -1,5 +1,5 @@
 %span.dropdown.print-menu-opener
-  %button.button.dropdown-button.icon-only
+  %button.button.dropdown-button.icon-only{ title: 'imprimer' }
     %span.icon.printer
   %ul.print-menu.dropdown-content
     %li
@@ -20,5 +20,5 @@
 
 = render partial: "instructeurs/procedures/dossier_actions", locals: { procedure: dossier.procedure, dossier: dossier, dossier_is_followed: current_instructeur&.follow?(dossier) }
 
-%span.state-button
+.state-button
   = render partial: "state_button", locals: { dossier: dossier }

app/views/instructeurs/dossiers/_state_button.html.haml

@@ -1,4 +1,4 @@
-%span.dropdown
+.dropdown
   -# Dropdown button title
   %button.button.primary.dropdown-button{ class: button_or_label_class(dossier) }
     = dossier_display_state dossier

app/views/invites/_dropdown.html.haml

@@ -1,4 +1,4 @@
-%span.dropdown.invite-user-action
+.dropdown.invite-user-action
   %button.button.dropdown-button
     %span.icon.person
     - if dossier.invites.count > 0

app/views/layouts/_account_dropdown.haml

@@ -1,4 +1,4 @@
-%span.dropdown.header-menu-opener
+.dropdown.header-menu-opener
   %button.button.dropdown-button.header-menu-button
     = image_tag "icons/account-circle.svg", title: "Mon compte"
   %ul.header-menu.dropdown-content
@@ -8,30 +8,30 @@
     - if administration_signed_in?
       %li
         = link_to manager_root_path, class: "menu-item menu-link" do
-          = image_tag "icons/super-admin.svg"
+          = image_tag "icons/super-admin.svg", alt: ''
           Passer en super-admin
     - if multiple_devise_profile_connect?
       - if user_signed_in? && nav_bar_profile != :user
         %li
           = link_to dossiers_path, class: "menu-item menu-link" do
-            = image_tag "icons/switch-profile.svg"
+            = image_tag "icons/switch-profile.svg", alt: ''
             Passer en usager
       - if instructeur_signed_in? && nav_bar_profile != :instructeur
         %li
           = link_to instructeur_procedures_path, class: "menu-item menu-link" do
-            = image_tag "icons/switch-profile.svg"
+            = image_tag "icons/switch-profile.svg", alt: ''
             Passer en instructeur
       - if administrateur_signed_in? && nav_bar_profile != :administrateur
         %li
           = link_to admin_procedures_path, class: "menu-item menu-link" do
-            = image_tag "icons/switch-profile.svg"
+            = image_tag "icons/switch-profile.svg", alt: ''
             Passer en administrateur
 
     %li
       = link_to profil_path, class: "menu-item menu-link" do
-        = image_tag "icons/switch-profile.svg"
+        = image_tag "icons/switch-profile.svg", alt: ''
         Voir mon profil
     %li
       = link_to destroy_user_session_path, method: :delete, class: "menu-item menu-link" do
-        = image_tag "icons/sign-out.svg"
+        = image_tag "icons/sign-out.svg", alt: ''
         Se déconnecter

app/views/layouts/_new_header.haml

@@ -38,7 +38,7 @@
             = form_tag instructeur_recherche_path, method: :get, class: "form" do
               = text_field_tag "q", "#{@search_terms if @search_terms.present?}", placeholder: "Rechercher un dossier"
               %button{ title: "Rechercher" }
-                = image_tag "icons/search-blue.svg"
+                = image_tag "icons/search-blue.svg", alt: ''
 
       - if nav_bar_profile == :user && user_signed_in? && current_user.dossiers.count > 2
         %li
@@ -46,7 +46,7 @@
             = form_tag recherche_dossiers_path, method: :post, class: "form" do
               = text_field_tag :dossier_id, "", placeholder: "Numéro de dossier"
               %button{ title: "Rechercher" }
-                = image_tag "icons/search-blue.svg"
+                = image_tag "icons/search-blue.svg", alt: ''
 
       - if instructeur_signed_in? || user_signed_in?
         %li
@@ -60,7 +60,6 @@
           = link_to "Connexion", new_user_session_path, class: "button secondary"
 
       %li
-        .header-help
         - if dossier.present? && nav_bar_profile == :user
           = render partial: 'shared/help/help_dropdown_dossier', locals: { dossier: dossier }
 

app/views/shared/dossiers/_champ_row.html.haml

@@ -16,7 +16,7 @@
         %th.libelle{ class: repetition ? 'padded' : '' }
           = "#{c.libelle} :"
         %td.rich-text
-          %span{ class: highlight_if_unseen_class(demande_seen_at, c.updated_at) }
+          %div{ class: highlight_if_unseen_class(demande_seen_at, c.updated_at) }
             - case c.type_champ
             - when TypeDeChamp.type_champs.fetch(:carte)
               = render partial: "shared/champs/carte/show", locals: { champ: c }

app/views/shared/dossiers/messages/_form.html.haml

@@ -7,7 +7,7 @@
     %div
       = f.file_field :piece_jointe, id: 'piece_jointe', direct_upload: true
       %label{ for: :piece_jointe }
-        .notice
+        %span.notice
           (taille max : 20 Mo)
 
     %div

app/views/shared/dossiers/messages/_message_icon.html.haml

@@ -1,7 +1,7 @@
 - if commentaire.sent_by_system?
-  = image_tag('icons/mail.svg', class: 'person-icon')
+  = image_tag('icons/mail.svg', class: 'person-icon', alt: '')
 - elsif commentaire.sent_by?(connected_user)
-  = image_tag('icons/account-circle.svg', class: 'person-icon')
+  = image_tag('icons/account-circle.svg', class: 'person-icon', alt: '')
 - else
-  = image_tag('icons/blue-person.svg', class: 'person-icon')
+  = image_tag('icons/blue-person.svg', class: 'person-icon', alt: '')
 

app/views/shared/help/_help_dropdown_dossier.html.haml

@@ -1,5 +1,5 @@
 .dropdown.help-dropdown
-  .button.primary.dropdown-button Aide
+  %button.button.primary.dropdown-button Aide
   .dropdown-content.fade-in-down
     %ul.dropdown-items
       - title = dossier.brouillon? ? "Besoin d’aide pour remplir votre dossier ?" : "Une question sur votre dossier ?"

app/views/shared/help/_help_dropdown_instructeur.html.haml

@@ -1,5 +1,5 @@
 .dropdown.help-dropdown
-  .button.primary.dropdown-button Aide
+  %button.button.primary.dropdown-button Aide
   .dropdown-content.fade-in-down
     %ul.dropdown-items
       = render partial: 'shared/help/dropdown_items/faq_item'

app/views/users/dossiers/_dossier_actions.html.haml

@@ -4,7 +4,7 @@
 - has_actions = has_delete_action || has_new_dossier_action
 
 - if has_actions
-  %span.dropdown.user-dossier-actions
+  .dropdown.user-dossier-actions
     %button.button.dropdown-button
       Actions
     .dropdown-content.fade-in-down

app/views/users/sessions/new.html.haml

@@ -13,7 +13,7 @@
 
     .auth-options
       %div
-        = f.check_box :remember_me, as: :boolean
+        = f.check_box :remember_me
         = f.label :remember_me, "Se souvenir de moi", class: 'remember-me'
 
       .text-right