Fix mispalced label tag in icon links component (#1300)

* Remove misplaced label tag in icon-links component * Update test for icon links
pydata · Apr 17, 2023 · cc8a529 · cc8a529
1 parent cbebfc9
commit cc8a529
Show file tree

Hide file tree

Showing 2 changed files with 11 additions and 11 deletions.
diff --git a/src/pydata_sphinx_theme/theme/pydata_sphinx_theme/components/icon-links.html b/src/pydata_sphinx_theme/theme/pydata_sphinx_theme/components/icon-links.html
@@ -12,8 +12,8 @@
           {% set attributeString = attributeString | join(" ") -%}
           <a {{ attributeString }}>
             {%- if type == "fontawesome" -%}
-            <span><i class="{{ icon }} fa-lg"></i></span>
-            <label class="sr-only">{{ name }}</label>
+            <span><i class="{{ icon }} fa-lg" aria-hidden="true"></i></span>
+            <span class="sr-only">{{ name }}</span>
             {%- elif type == "local" -%}
             <img src="{{ pathto(icon, 1) }}" class="icon-link-image" alt="{{ name }}"/>
             {%- elif type == "url" -%}

diff --git a/tests/test_build/navbar_icon_links.html b/tests/test_build/navbar_icon_links.html
@@ -2,23 +2,23 @@
  <li class="nav-item">
   <a class="nav-link" data-bs-placement="bottom" data-bs-toggle="tooltip" href="https://site1.org" rel="noopener" target="_blank" title="FONTAWESOME">
    <span>
-    <i class="FACLASS fa-lg">
+    <i aria-hidden="true" class="FACLASS fa-lg">
     </i>
    </span>
-   <label class="sr-only">
+   <span class="sr-only">
     FONTAWESOME
-   </label>
+   </span>
   </a>
  </li>
  <li class="nav-item">
   <a class="nav-link" data-bs-placement="bottom" data-bs-toggle="tooltip" href="https://site2.org" rel="noopener" target="_blank" title="FONTAWESOME DEFAULT">
    <span>
-    <i class="FADEFAULTCLASS fa-lg">
+    <i aria-hidden="true" class="FADEFAULTCLASS fa-lg">
     </i>
    </span>
-   <label class="sr-only">
+   <span class="sr-only">
     FONTAWESOME DEFAULT
-   </label>
+   </span>
   </a>
  </li>
  <li class="nav-item">
@@ -41,12 +41,12 @@
  <li class="nav-item">
   <a class="overridden classes" data-bs-placement="bottom" data-bs-toggle="tooltip" foo="bar" href="https://override.com" rel="noopener" target="_blank" title="FONTAWESOME">
    <span>
-    <i class="FACLASS fa-lg">
+    <i aria-hidden="true" class="FACLASS fa-lg">
     </i>
    </span>
-   <label class="sr-only">
+   <span class="sr-only">
     FONTAWESOME
-   </label>
+   </span>
   </a>
  </li>
 </ul>