feat(a11y): use list-style-type "" instead of list-style none (#42526)

In Safari, "list-style: none" removes the list semantic role, so lists are
no longer announced by screen readers. Using "list-style-type: \"\"" keeps the
same visual result while preserving the list role.

Ports twbs/bootstrap#41778 to v6, plus the new v6 list containers (stepper,
menu, docs search results). Summary marker removals (accordion header,
details summary) are intentionally left as "list-style: none".

diff --git a/scss/_breadcrumb.scss b/scss/_breadcrumb.scss
index 03f4240cf4484579810da34e4009d4da1f0be1c2..430999d6c9a27b210c7023a1e7cdefeba6f7efa7 100644 (file)
--- a/scss/_breadcrumb.scss
+++ b/scss/_breadcrumb.scss
@@ -39,7 +39,7 @@ $breadcrumb-tokens: defaults(
     align-items: center;
     padding: var(--breadcrumb-padding-y, 0) var(--breadcrumb-padding-x, 0);
     font-size: var(--breadcrumb-font-size);
-    list-style: none;
+    list-style-type: "";
     background-color: var(--breadcrumb-bg);
     @include border-radius(var(--breadcrumb-border-radius));
   }

diff --git a/scss/_list-group.scss b/scss/_list-group.scss
index 6ab8b1c542bbc61b09943bedd6c1466fb40ef125..6860abd7d5434a03b56b0e5999f5fc2b45d2b389 100644 (file)
--- a/scss/_list-group.scss
+++ b/scss/_list-group.scss
@@ -39,7 +39,7 @@ $list-group-tokens: defaults(
     display: flex;
     flex-direction: column;
 
-    // No need to set list-style: none; since .list-group-item is block level
+    // No need to set list-style-type: ""; since .list-group-item is block level
     padding-inline-start: 0; // reset padding because ul and ol
     margin-bottom: 0;
     @include border-radius(var(--list-group-border-radius));

diff --git a/scss/_menu.scss b/scss/_menu.scss
index abf53a2c27188f622fc904e25c810169e26c9a35..cddc5ab7de46d45f416ef5302ac66cf85efd13fc 100644 (file)
--- a/scss/_menu.scss
+++ b/scss/_menu.scss
@@ -71,7 +71,7 @@ $menu-tokens: defaults(
     font-size: var(--menu-font-size);
     color: var(--menu-color);
     text-align: start;
-    list-style: none;
+    list-style-type: "";
     background-color: var(--menu-bg);
     background-clip: padding-box;
     border: var(--menu-border-width, var(--border-width)) solid var(--menu-border-color, var(--border-color-translucent));

diff --git a/scss/_nav.scss b/scss/_nav.scss
index 7ea73d6f59bb7f99a58f5c1dda08726f3b825cd2..90ac39d021b843f81014a2fd1a53ca2b07e534cb 100644 (file)
--- a/scss/_nav.scss
+++ b/scss/_nav.scss
@@ -97,7 +97,7 @@ $nav-underline-tokens: defaults(
     gap: var(--nav-gap);
     padding-inline-start: 0;
     margin-bottom: 0;
-    list-style: none;
+    list-style-type: "";
   }
 
   .nav-item {

diff --git a/scss/_navbar.scss b/scss/_navbar.scss
index 441a08aa5a3c84cb0e21c5f4bb451b7a45dd4e9d..3dc4bebf56c77e9c06fc4ba8a1ab7d576d55f52b 100644 (file)
--- a/scss/_navbar.scss
+++ b/scss/_navbar.scss
@@ -153,7 +153,7 @@ $navbar-nav-tokens: defaults(
     gap: var(--nav-gap);
     padding-inline-start: 0;
     margin-bottom: 0;
-    list-style: none;
+    list-style-type: "";
 
     .nav-link {
       &.active,

diff --git a/scss/_stepper.scss b/scss/_stepper.scss
index 22602d0a83f3c768d9298c060ce6fe4094221919..26f322943e845b6cc41954f720f82d5a57862cd8 100644 (file)
--- a/scss/_stepper.scss
+++ b/scss/_stepper.scss
@@ -61,7 +61,7 @@ $stepper-tokens: defaults(
     grid-auto-flow: row;
     gap: var(--stepper-gap);
     padding-inline-start: 0;
-    list-style: none;
+    list-style-type: "";
     counter-reset: stepper;
   }
 

diff --git a/scss/mixins/_lists.scss b/scss/mixins/_lists.scss
index 27556e6f98c20863a0f23f660a20b6ea84b58323..acc3b53d61b50bbbf8d0781d91d46b7bd2177d9c 100644 (file)
--- a/scss/mixins/_lists.scss
+++ b/scss/mixins/_lists.scss
@@ -3,5 +3,5 @@
 // Unstyled keeps list items block level, just removes default browser padding and list-style
 @mixin list-unstyled {
   padding-inline-start: 0;
-  list-style: none;
+  list-style-type: "";
 }

diff --git a/site/src/scss/_search.scss b/site/src/scss/_search.scss
index a5d0d6cbeaa5ff37a8f312b031e0144698650bda..29557de6b53a8589135ddd305cb1a4a708d9fe83 100644 (file)
--- a/site/src/scss/_search.scss
+++ b/site/src/scss/_search.scss
@@ -193,7 +193,7 @@ bd-search-results {
 
   gap: var(--spacer-2);
   padding-block-start: var(--spacer-1);
-  list-style: none;
+  list-style-type: "";
 }
 
 .bd-search-result {