From ff1ea23aa199b489859c15708477a55e55f530cb Mon Sep 17 00:00:00 2001
From: Aeeshaht <78420565+Aeeshadam@users.noreply.github.com>
Date: Tue, 14 Oct 2025 01:10:26 +0100
Subject: [PATCH] feat(curriculum): add interactive examples to aria hidden
lesson (#62739)
---
.../672a54bc58319c8fe6f78ad4.md | 16 +++++++++++++++-
1 file changed, 15 insertions(+), 1 deletion(-)
diff --git a/curriculum/challenges/english/blocks/lecture-introduction-to-aria/672a54bc58319c8fe6f78ad4.md b/curriculum/challenges/english/blocks/lecture-introduction-to-aria/672a54bc58319c8fe6f78ad4.md
index 4087c9ea9a3..7cc687cee5a 100644
--- a/curriculum/challenges/english/blocks/lecture-introduction-to-aria/672a54bc58319c8fe6f78ad4.md
+++ b/curriculum/challenges/english/blocks/lecture-introduction-to-aria/672a54bc58319c8fe6f78ad4.md
@@ -5,7 +5,7 @@ challengeType: 19
dashedName: what-is-the-aria-hidden-attribute
---
-# --description--
+# --interactive--
If you ever need to display content while at the same time hiding it from people who use assistive technology, like screen readers, you can use the `aria-hidden` attribute.
@@ -24,13 +24,27 @@ Here's an example where we hide an icon from the accessibility tree by adding th
We only keep the text exposed to assistive technologies to avoid any confusion that may arise from the redundancy of having both an icon and text for the same purpose.
+**NOTE**: This interactive example includes the Font Awesome CDN so you can see the gear icon displayed in the preview window.
+
+:::interactive_editor
+
```html
+
+
+
+
+
```
+:::
+
You do not need to use `aria-hidden` when:
- The HTML element already has a `hidden` attribute.