From a8be31b6ea25e6f1412ccef5499073da5cf82942 Mon Sep 17 00:00:00 2001
From: Huyen Nguyen <25715018+huyenltnguyen@users.noreply.github.com>
Date: Mon, 5 May 2025 19:30:20 +0700
Subject: [PATCH] fix(a11y): hide Fail icon from screen readers (#60157)

---
 client/src/assets/icons/fail.tsx                      | 1 +
 client/src/templates/Challenges/classic/lower-jaw.tsx | 2 +-
 2 files changed, 2 insertions(+), 1 deletion(-)

diff --git a/client/src/assets/icons/fail.tsx b/client/src/assets/icons/fail.tsx
index 0e23347b023..98fb3632e5c 100644
--- a/client/src/assets/icons/fail.tsx
+++ b/client/src/assets/icons/fail.tsx
@@ -10,6 +10,7 @@ function RedFail(): JSX.Element {
       viewBox='0 0 200 200'
       width='50'
       xmlns='http://www.w3.org/2000/svg'
+      aria-hidden='true'
     >
       <g>
         <title>{t('icons.fail')}</title>
diff --git a/client/src/templates/Challenges/classic/lower-jaw.tsx b/client/src/templates/Challenges/classic/lower-jaw.tsx
index 69c9590e83b..c7ba7e57036 100644
--- a/client/src/templates/Challenges/classic/lower-jaw.tsx
+++ b/client/src/templates/Challenges/classic/lower-jaw.tsx
@@ -140,7 +140,7 @@ const LowerJawTips = ({
         className='test-status fade-in'
         aria-hidden={showFeedback}
       >
-        <Fail aria-hidden='true' />
+        <Fail />
         <p>{learnEncouragementText}</p>
       </div>
       <div