From 4e64eb1af5e3472566dfa6b0ba083d640f5efed2 Mon Sep 17 00:00:00 2001
From: Corinne Durrmeyer <corinne@inseo.fr>
Date: Tue, 15 Oct 2024 17:12:53 +0200
Subject: [PATCH] Hide pesudo-element content from assistive technologies

---
 app/assets/stylesheets/buttons.scss                           | 4 +---
 .../batch_operation_component.html.haml                       | 1 +
 .../dropdown/menu_component/menu_component.html.haml          | 1 +
 app/views/layouts/_header.haml                                | 2 +-
 public/500.html                                               | 2 +-
 public/502.html                                               | 2 +-
 public/503.html                                               | 2 +-
 public/504.html                                               | 2 +-
 8 files changed, 8 insertions(+), 8 deletions(-)

diff --git a/app/assets/stylesheets/buttons.scss b/app/assets/stylesheets/buttons.scss
index be434a232..1c60811ad 100644
--- a/app/assets/stylesheets/buttons.scss
+++ b/app/assets/stylesheets/buttons.scss
@@ -151,10 +151,8 @@
   .dropdown-button {
     white-space: nowrap;
 
-    &::after {
+    [aria-hidden="true"].fr-ml-2v::after {
       content: "▾";
-      margin-left: $default-spacer;
-      font-weight: bold;
     }
 
     &.icon-only {
diff --git a/app/components/dossiers/batch_operation_component/batch_operation_component.html.haml b/app/components/dossiers/batch_operation_component/batch_operation_component.html.haml
index f75cbc6da..c8357feca 100644
--- a/app/components/dossiers/batch_operation_component/batch_operation_component.html.haml
+++ b/app/components/dossiers/batch_operation_component/batch_operation_component.html.haml
@@ -13,6 +13,7 @@
         -# Dropdown button title
         %button#batch_operation_others.fr-btn.fr-btn--sm.fr-btn--secondary.fr-ml-1w.dropdown-button{ disabled: true, data: { menu_button_target: 'button', batch_operation_target: 'dropdown' } }
           = t('.operations.other')
+          %span.fr-ml-2v{ 'aria-hidden': 'true' }
 
         #state-menu.dropdown-content.fade-in-down{ data: { menu_button_target: 'menu' }, "aria-labelledby" => "batch_operation_others" }
           %ul.dropdown-items
diff --git a/app/components/dropdown/menu_component/menu_component.html.haml b/app/components/dropdown/menu_component/menu_component.html.haml
index d580c563b..7b6f16b4f 100644
--- a/app/components/dropdown/menu_component/menu_component.html.haml
+++ b/app/components/dropdown/menu_component/menu_component.html.haml
@@ -1,6 +1,7 @@
 = content_tag(@wrapper, wrapper_options) do
   %button{ class: button_class_names, id: button_id, disabled: disabled?, data: data, "aria-expanded": "false", 'aria-haspopup': 'true', 'aria-controls': menu_id }
     = button_inner_html
+    %span.fr-ml-2v{ 'aria-hidden': 'true' }
 
   %div{ data: { menu_button_target: 'menu' }, id: menu_id, 'aria-labelledby': button_id, role: menu_role, 'tabindex': -1, class: menu_class_names }
     = menu_header_html
diff --git a/app/views/layouts/_header.haml b/app/views/layouts/_header.haml
index fda1d2b0c..d65475e72 100644
--- a/app/views/layouts/_header.haml
+++ b/app/views/layouts/_header.haml
@@ -53,7 +53,7 @@
                     = render partial: 'shared/help/help_dropdown_instructeur'
                   - else
                     -# NB: on mobile in order to have links correctly aligned, we need a left icon #
-                    = link_to t('help'), t("links.common.faq.url"), class: 'fr-btn dropdown-button'
+                    = link_to t('help'), t("links.common.faq.url"), class: 'fr-btn'
 
 
 
diff --git a/public/500.html b/public/500.html
index 2bb269345..0f25f7b6e 100644
--- a/public/500.html
+++ b/public/500.html
@@ -2109,7 +2109,7 @@
                   <li>
                     <!-- / NB: on mobile in order to have links correctly aligned, we need a left icon -->
                     <a
-                      class="fr-btn dropdown-button"
+                      class="fr-btn"
                       href="/faq"
                       >Aide</a
                     >
diff --git a/public/502.html b/public/502.html
index c26dea27f..1462bcfca 100644
--- a/public/502.html
+++ b/public/502.html
@@ -2108,7 +2108,7 @@
                   <li>
                     <!-- / NB: on mobile in order to have links correctly aligned, we need a left icon -->
                     <a
-                      class="fr-btn dropdown-button"
+                      class="fr-btn"
                       href="/faq"
                       >Aide</a
                     >
diff --git a/public/503.html b/public/503.html
index 896d3bd4c..592e9380c 100644
--- a/public/503.html
+++ b/public/503.html
@@ -2108,7 +2108,7 @@
                   <li>
                     <!-- / NB: on mobile in order to have links correctly aligned, we need a left icon -->
                     <a
-                      class="fr-btn dropdown-button"
+                      class="fr-btn"
                       href="/faq"
                       >Aide</a
                     >
diff --git a/public/504.html b/public/504.html
index f2265dc7a..196f24022 100644
--- a/public/504.html
+++ b/public/504.html
@@ -2108,7 +2108,7 @@
                   <li>
                     <!-- / NB: on mobile in order to have links correctly aligned, we need a left icon -->
                     <a
-                      class="fr-btn dropdown-button"
+                      class="fr-btn"
                       href="/faq"
                       >Aide</a
                     >