[A11y] Correct role attribute for package lists (#9303)

* initial commit * removed 'alert' role from Search heading * removed header role too, unneccessary for h1 elements
NuGet · Nov 11, 2022 · 429d3a0 · 429d3a0
1 parent a9d6c61
commit 429d3a0
Show file tree

Hide file tree

Showing 5 changed files with 16 additions and 7 deletions.
diff --git a/src/Bootstrap/dist/css/bootstrap.css b/src/Bootstrap/dist/css/bootstrap.css
diff --git a/src/Bootstrap/less/list-group.less b/src/Bootstrap/less/list-group.less
@@ -128,3 +128,8 @@ button.list-group-item {
   margin-bottom: 0;
   line-height: 1.3;
 }
+
+ul.list-packages {
+  list-style-type: none;
+  padding-left: 0;
+}
diff --git a/src/NuGetGallery/Views/Shared/ListPackages.cshtml b/src/NuGetGallery/Views/Shared/ListPackages.cshtml
@@ -41,7 +41,7 @@
 <section role="main" class="container main-container page-list-packages">
     <div class="row clearfix no-margin">
         <div class="col-md-10 no-padding">
-            <h1 role="alert">
+            <h1 tabindex="0">
                 @if (String.IsNullOrEmpty(Model.SearchTerm))
                 {
                     if (Model.TotalCount == 1)
@@ -151,7 +151,7 @@
         </div>
     }
 
-    <div class="list-packages" role="list">
+    <ul class="list-packages">
         @{
             var itemIndex = Model.PageIndex * Model.PageSize;
             var eventName = Model.IsPreviewSearch ? "preview-search-selection" : "search-selection";
@@ -161,7 +161,7 @@
             @Html.Partial("_ListPackage", package, new ViewDataDictionary { { "itemIndex", itemIndex }, { "eventName", eventName } })
             itemIndex++;
         }
-    </div>
+    </ul>
 
     <div class="row">
         <div class="col-xs-12 clearfix">

diff --git a/src/NuGetGallery/Views/Shared/_ListPackage.cshtml b/src/NuGetGallery/Views/Shared/_ListPackage.cshtml
@@ -26,7 +26,7 @@
     }
 }
 
-<article class="package" role="listitem">
+<li class="package">
 
     <div class="row">
         <div class="col-sm-1 hidden-xs hidden-sm col-package-icon">
@@ -131,4 +131,4 @@
             </div>
         </div>
     </div>
-</article>
+</li>
diff --git a/src/NuGetGallery/Views/Users/Profiles.cshtml b/src/NuGetGallery/Views/Users/Profiles.cshtml
@@ -97,12 +97,12 @@
 
             <hr class="profile-title-divider" />
 
-            <div class="list-packages" role="list">
+            <ul class="list-packages">
                 @foreach (var package in Model.PagedPackages)
                 {
                     @Html.Partial("_ListPackage", package)
                 }
-            </div>
+            </ul>
 
             @ViewHelpers.PreviousNextPager(Model.Pager)
         </article>