bs toogle data attribute modification, screen readers fixes

Oksydan · Oct 5, 2023 · 1e35682 · 1e35682
1 parent de19801
commit 1e35682
Show file tree

Hide file tree

Showing 29 changed files with 40 additions and 40 deletions.
diff --git a/modules/ps_brandlist/views/templates/_partials/brand_form.tpl b/modules/ps_brandlist/views/templates/_partials/brand_form.tpl
@@ -27,7 +27,7 @@
   <button
     class="btn-unstyle select-title"
     rel="nofollow"
-    data-toggle="dropdown"
+    data-bs-toggle="dropdown"
     aria-haspopup="true"
     aria-expanded="false">
     {l s='All brands' d='Shop.Theme.Catalog'}

diff --git a/modules/ps_categorytree/views/templates/hook/ps_categorytree.tpl b/modules/ps_categorytree/views/templates/hook/ps_categorytree.tpl
@@ -34,7 +34,7 @@
               <a href="{$node.link}" class="stretched-link text-reset list-group-item-action-dropdown-link">
                 {$node.name}
               </a>
-              <a href="#exCollapsingNavbar{$node.id}" class="icon-collapse list-group-item-collapse text-reset" data-toggle="collapse">
+              <a href="#exCollapsingNavbar{$node.id}" class="icon-collapse list-group-item-collapse text-reset" data-bs-toggle="collapse">
                 <i class="material-icons d-block">&#xE313;</i>
               </a>
             </div>

diff --git a/modules/ps_contactinfo/ps_contactinfo.tpl b/modules/ps_contactinfo/ps_contactinfo.tpl
@@ -27,7 +27,7 @@
 
   <div class="d-flex align-items-center mb-3 justify-content-between position-relative">
     <span class="h4 mb-0">{l s='Store information' d='Shop.Theme.Global'}</span>
-    <a href="#footer_contact_list" class="icon-collapse stretched-link text-reset d-block d-md-none" data-toggle="collapse">
+    <a href="#footer_contact_list" class="icon-collapse stretched-link text-reset d-block d-md-none" data-bs-toggle="collapse">
       <i class="material-icons d-block"></i>
     </a>
   </div>

diff --git a/modules/ps_customeraccountlinks/ps_customeraccountlinks.tpl b/modules/ps_customeraccountlinks/ps_customeraccountlinks.tpl
@@ -27,7 +27,7 @@
 
   <div class="d-flex align-items-center mb-3 justify-content-between position-relative">
     <span class="h4 mb-0">{l s='Your account' d='Shop.Theme.Customeraccount'}</span>
-    <a href="#footer_account_list" class="icon-collapse stretched-link text-reset d-block d-md-none" data-toggle="collapse">
+    <a href="#footer_account_list" class="icon-collapse stretched-link text-reset d-block d-md-none" data-bs-toggle="collapse">
       <i class="material-icons d-block"></i>
     </a>
   </div>

diff --git a/modules/ps_emailalerts/views/templates/hook/product.tpl b/modules/ps_emailalerts/views/templates/hook/product.tpl
@@ -23,7 +23,7 @@
 * International Registered Trademark & Property of PrestaShop SA
 *}
 
-<a href="#" rel="nofollow" data-toggle="modal" data-target="#email-alert-modal" class="btn btn-primary js-mailalert-modal-btn">
+<a href="#" rel="nofollow" data-bs-toggle="modal" data-target="#email-alert-modal" class="btn btn-primary js-mailalert-modal-btn">
     {l s='Notify me when available' d='Modules.Emailalerts.Shop'}
 </a>
 

diff --git a/modules/ps_facetedsearch/views/templates/front/catalog/facets.tpl b/modules/ps_facetedsearch/views/templates/front/catalog/facets.tpl
@@ -54,7 +54,7 @@
             <div class="search-filters__header d-flex justify-content-between align-items-center mb-0 h5 position-relative">
               <span class="search-filters__title mb-0">{$facet.label}</span>
               {if $facet.widgetType != 'slider'}
-                <a href="#facet_{$_expand_id}" class="icon-collapse stretched-link text-reset d-block" data-toggle="collapse"
+                <a href="#facet_{$_expand_id}" class="icon-collapse stretched-link text-reset d-block" data-bs-toggle="collapse"
                   {if !$_collapse} aria-expanded="true" {/if}>
                   <span class="material-icons">&#xE313;</span>
                 </a>

diff --git a/modules/ps_legalcompliance/views/templates/hook/hookDisplayFooter.tpl b/modules/ps_legalcompliance/views/templates/hook/hookDisplayFooter.tpl
@@ -25,7 +25,7 @@
 
 <div class="col-md-2 links wrapper">
   <h3 class="hidden-sm-down">{l s='Information' d='Modules.Legalcompliance.Shop'}</h3>
-  <div class="title clearfix hidden-md-up" data-target="#footer_eu_about_us_list" data-toggle="collapse">
+  <div class="title clearfix hidden-md-up" data-target="#footer_eu_about_us_list" data-bs-toggle="collapse">
     <span class="h3">{l s='Information' d='Modules.Legalcompliance.Shop'}</span>
     <span class="float-end">
       <span class="navbar-toggler collapse-icons">

diff --git a/modules/ps_linklist/views/templates/hook/linkblock-column.tpl b/modules/ps_linklist/views/templates/hook/linkblock-column.tpl
@@ -3,7 +3,7 @@
     {assign var=_expand_id value=10|mt_rand:100000}
     <div class="d-flex align-items-center mb-3 justify-content-between position-relative">
       <span class="h4 mb-0">{$linkBlock.title}</span>
-      <a href="#footer_sub_menu_{$_expand_id}" class="icon-collapse stretched-link text-reset d-block d-md-none" data-toggle="collapse">
+      <a href="#footer_sub_menu_{$_expand_id}" class="icon-collapse stretched-link text-reset d-block d-md-none" data-bs-toggle="collapse">
         <i class="material-icons d-block"></i>
       </a>
     </div>

diff --git a/modules/ps_linklist/views/templates/hook/linkblock.tpl b/modules/ps_linklist/views/templates/hook/linkblock.tpl
@@ -28,7 +28,7 @@
       {assign var=_expand_id value=10|mt_rand:100000}
       <div class="d-flex align-items-center mb-3 justify-content-between position-relative">
         <span class="h4 mb-0">{$linkBlock.title}</span>
-        <a href="#footer_sub_menu_{$_expand_id}" class="icon-collapse stretched-link text-reset d-block d-md-none" data-toggle="collapse">
+        <a href="#footer_sub_menu_{$_expand_id}" class="icon-collapse stretched-link text-reset d-block d-md-none" data-bs-toggle="collapse">
           <i class="material-icons d-block"></i>
         </a>
       </div>

diff --git a/modules/ps_mainmenu/ps_mainmenu.tpl b/modules/ps_mainmenu/ps_mainmenu.tpl
@@ -25,7 +25,7 @@
             {* Cannot use page identifier as we can have the same page several times *}
             {assign var=_expand_id value=10|mt_rand:100000}
             <span class="d-block d-md-none">
-                <span data-target="#top_sub_menu_{$_expand_id}" data-toggle="collapse"
+                <span data-target="#top_sub_menu_{$_expand_id}" data-bs-toggle="collapse"
                       class="d-block navbar-toggler icon-collapse">
                   <i class="material-icons">&#xE313;</i>
                 </span>

diff --git a/modules/ps_sharebuttons/views/templates/hook/ps_sharebuttons.tpl b/modules/ps_sharebuttons/views/templates/hook/ps_sharebuttons.tpl
@@ -37,7 +37,7 @@
               rel="noopener noreferrer"
               class="btn btn-light p-2 rounded-circle btn-lg">
               <span class="icon icon-{$social_share_link.class} d-block"></span>
-              <div class="sr-only">
+              <div class="visually-hidden">
                 {$social_share_link.label}
               </div>
             </a>

diff --git a/modules/ps_socialfollow/ps_socialfollow.tpl b/modules/ps_socialfollow/ps_socialfollow.tpl
@@ -30,7 +30,7 @@
         <li class="col flex-grow-0 flex-shrink-0 mb-2">
           <a href="{$social_link.url}" rel="noopener noreferrer" title="{$social_link.label}" target="_blank" class="btn btn-light p-2 rounded-circle btn-lg">
             <span class="icon icon-{$social_link.class} d-block"></span>
-            <div class="sr-only">
+            <div class="visually-hidden">
               {$social_link.label}
             </div>
           </a>

diff --git a/modules/ps_supplierlist/views/templates/_partials/supplier_form.tpl b/modules/ps_supplierlist/views/templates/_partials/supplier_form.tpl
@@ -27,7 +27,7 @@
   <button
     class="btn-unstyle select-title"
     rel="nofollow"
-    data-toggle="dropdown"
+    data-bs-toggle="dropdown"
     aria-haspopup="true"
     aria-expanded="false">
     {l s='All suppliers' d='Shop.Theme.Catalog'}

diff --git a/templates/_partials/header.tpl b/templates/_partials/header.tpl
@@ -54,7 +54,7 @@
                                     class="header-top__link"
                                     rel="nofollow"
                                     href="#"
-                                    data-toggle="modal"
+                                    data-bs-toggle="modal"
                                     data-target="#mobile_top_menu_wrapper"
                             >
                                 <div class="header-top__icon-container">

diff --git a/templates/_partials/page-loader.tpl b/templates/_partials/page-loader.tpl
@@ -1,3 +1,3 @@
 <div class="page-loader">
-  <div class="spinner-border text-primary" role="status"><span class="sr-only">{l s='Loading...' d='Shop.Theme.Global'}</span></div>
+  <div class="spinner-border text-primary" role="status"><span class="visually-hidden">{l s='Loading...' d='Shop.Theme.Global'}</span></div>
 </div>
diff --git a/templates/_partials/pagination.tpl b/templates/_partials/pagination.tpl
@@ -46,10 +46,10 @@
               >
                 {if $page.type === 'previous'}
                   <span class="material-icons font-reset align-middle">keyboard_arrow_left</span>
-                  <span class="sr-only">{l s='Previous' d='Shop.Theme.Actions'}</span>
+                  <span class="visually-hidden">{l s='Previous' d='Shop.Theme.Actions'}</span>
                 {elseif $page.type === 'next'}
                   <span class="material-icons font-reset align-middle">keyboard_arrow_right</span>
-                  <span class="sr-only">{l s='Next' d='Shop.Theme.Actions'}</span>
+                  <span class="visually-hidden">{l s='Next' d='Shop.Theme.Actions'}</span>
                 {else}
                   {$page.page}
                 {/if}

diff --git a/templates/catalog/_partials/product-cover-thumbnails.tpl b/templates/catalog/_partials/product-cover-thumbnails.tpl
@@ -99,11 +99,11 @@
                 </div>
 
                 <div class="swiper-button-prev swiper-button-custom">
-                  <span class="sr-only">{l s='Previous' d='Shop.Theme.Actions'}</span>
+                  <span class="visually-hidden">{l s='Previous' d='Shop.Theme.Actions'}</span>
                   <span class="material-icons">keyboard_arrow_left</span>
                 </div>
                 <div class="swiper-button-next swiper-button-custom">
-                  <span class="sr-only">{l s='Next' d='Shop.Theme.Actions'}</span>
+                  <span class="visually-hidden">{l s='Next' d='Shop.Theme.Actions'}</span>
                   <span class="material-icons">keyboard_arrow_right</span>
                 </div>
               </div>
@@ -124,7 +124,7 @@
             {/images_block}
           {/if}
 
-          <a class="product-main-images__modal-trigger-layer btn btn-light shadow rounded-circle hidden-sm-down" data-toggle="modal" data-target="#product-modal">
+          <a class="product-main-images__modal-trigger-layer btn btn-light shadow rounded-circle hidden-sm-down" data-bs-toggle="modal" data-target="#product-modal">
             <span class="material-icons font-reset line-height-reset">zoom_in</span>
           </a>
 

diff --git a/templates/catalog/_partials/product-images-modal.tpl b/templates/catalog/_partials/product-images-modal.tpl
@@ -89,11 +89,11 @@
 
           {if $product.images|count > 1}
             <div class="swiper-button-prev swiper-button-custom">
-              <span class="sr-only">{l s='Previous' d='Shop.Theme.Actions'}</span>
+              <span class="visually-hidden">{l s='Previous' d='Shop.Theme.Actions'}</span>
               <span class="material-icons">keyboard_arrow_left</span>
             </div>
             <div class="swiper-button-next swiper-button-custom">
-              <span class="sr-only">{l s='Next' d='Shop.Theme.Actions'}</span>
+              <span class="visually-hidden">{l s='Next' d='Shop.Theme.Actions'}</span>
               <span class="material-icons">keyboard_arrow_right</span>
             </div>
           {/if}

diff --git a/templates/catalog/_partials/product-tabs.tpl b/templates/catalog/_partials/product-tabs.tpl
@@ -6,7 +6,7 @@
           <li class="nav-item">
             <a
               class="nav-link"
-              data-toggle="tab"
+              data-bs-toggle="tab"
               href="#description"
               role="tab"
               aria-controls="description"
@@ -16,7 +16,7 @@
         <li class="nav-item">
           <a
             class="nav-link"
-            data-toggle="tab"
+            data-bs-toggle="tab"
             href="#product-details"
             role="tab"
             aria-controls="product-details"
@@ -26,7 +26,7 @@
           <li class="nav-item">
             <a
               class="nav-link"
-              data-toggle="tab"
+              data-bs-toggle="tab"
               href="#attachments"
               role="tab"
               aria-controls="attachments">{l s='Attachments' d='Shop.Theme.Catalog'}</a>
@@ -36,7 +36,7 @@
           <li class="nav-item">
             <a
               class="nav-link"
-              data-toggle="tab"
+              data-bs-toggle="tab"
               href="#extra-{$extraKey}"
               role="tab"
               aria-controls="extra-{$extraKey}">{$extra.title}</a>

diff --git a/templates/catalog/_partials/product-variants.tpl b/templates/catalog/_partials/product-variants.tpl
@@ -54,7 +54,7 @@
                       {/if}
                     >
                     </span>
-                    <span class="sr-only">
+                    <span class="visually-hidden">
                       {$group_attribute.name}
                     </span>
                 </label>

diff --git a/templates/catalog/_partials/products-top.tpl b/templates/catalog/_partials/products-top.tpl
@@ -37,10 +37,10 @@
 
   <div class="col-sm-auto col-12 mt-2 d-md-none ms-auto">
     {if !empty($listing.rendered_facets)}
-      <button data-target="#mobile_filters" data-toggle="modal" class="btn btn-secondary d-sm-inline-block d-none">
+      <button data-target="#mobile_filters" data-bs-toggle="modal" class="btn btn-secondary d-sm-inline-block d-none">
         {l s='Filter' d='Shop.Theme.Actions'}
       </button>
-      <button data-target="#mobile_filters" data-toggle="modal" class="btn btn-secondary d-block text-center w-100 d-sm-none">
+      <button data-target="#mobile_filters" data-bs-toggle="modal" class="btn btn-secondary d-block text-center w-100 d-sm-none">
         {l s='Filter' d='Shop.Theme.Actions'}
       </button>
     {/if}

diff --git a/templates/checkout/_partials/cart-detailed-product-line.tpl b/templates/checkout/_partials/cart-detailed-product-line.tpl
@@ -71,7 +71,7 @@
         {block name='cart_detailed_product_line_customization'}
           <div class="mt-3">
             {foreach from=$product.customizations item="customization"}
-              <a href="#" data-toggle="modal"
+              <a href="#" data-bs-toggle="modal"
                 data-target="#product-customizations-modal-{$customization.id_customization}">{l s='Product customization' d='Shop.Theme.Catalog'}</a>
               <div class="modal fade customization-modal js-customization-modal" id="product-customizations-modal-{$customization.id_customization}"
                 tabindex="-1" role="dialog" aria-hidden="true">

diff --git a/templates/checkout/_partials/cart-detailed.tpl b/templates/checkout/_partials/cart-detailed.tpl
@@ -24,7 +24,7 @@
  *}
 {block name='cart_detailed_product'}
   <div class="cart-overview card-body js-cart position-relative" data-refresh-url="{url entity='cart' params=['ajax' => true, 'action' => 'refresh']}">
-  <div class="cart-loader"><div class="spinner-border text-primary" role="status"><span class="sr-only">{l s='Loading...' d='Shop.Theme.Global'}</span></div></div>
+  <div class="cart-loader"><div class="spinner-border text-primary" role="status"><span class="visually-hidden">{l s='Loading...' d='Shop.Theme.Global'}</span></div></div>
     {if $cart.products}
       <div class="cart-items">
         {foreach from=$cart.products item=product}

diff --git a/templates/checkout/_partials/steps/personal-information.tpl b/templates/checkout/_partials/steps/personal-information.tpl
@@ -60,7 +60,7 @@
         <li class="nav-item">
           <a
             class="nav-link {if !$show_login_form}active{/if}"
-            data-toggle="tab"
+            data-bs-toggle="tab"
             href="#checkout-guest-form"
             role="tab"
             aria-controls="checkout-guest-form"
@@ -78,7 +78,7 @@
           <a
             class="nav-link {if $show_login_form}active{/if}"
             data-link-action="show-login-form"
-            data-toggle="tab"
+            data-bs-toggle="tab"
             href="#checkout-login-form"
             role="tab"
             aria-controls="checkout-login-form"

diff --git a/templates/cms/stores.tpl b/templates/cms/stores.tpl
@@ -96,7 +96,7 @@
             {if $store.note || $store.phone || $store.fax || $store.email}
               <div class="col-12">
                 <div class="pt-3 mt-4 border-top text-center">
-                  <a data-toggle="collapse" class="icon-collapse d-inline-flex" href="#about-{$store.id}" aria-expanded="false" aria-controls="about-{$store.id}">
+                  <a data-bs-toggle="collapse" class="icon-collapse d-inline-flex" href="#about-{$store.id}" aria-expanded="false" aria-controls="about-{$store.id}">
                     {l s='About and Contact' d='Shop.Theme.Global'}
                     <span class="material-icons"></span>
                   </a>

diff --git a/templates/components/featured-products.tpl b/templates/components/featured-products.tpl
@@ -10,11 +10,11 @@
         {/block}
         <div class="featured-products__navigation d-flex flex-grow-0 flex-shrink-0 ms-auto">
           <div class="swiper-button-prev swiper-button-custom position-static">
-            <span class="sr-only">{l s='Previous' d='Shop.Theme.Actions'}</span>
+            <span class="visually-hidden">{l s='Previous' d='Shop.Theme.Actions'}</span>
             <span class="material-icons">keyboard_arrow_left</span>
           </div>
           <div class="swiper-button-next swiper-button-custom position-static">
-            <span class="sr-only">{l s='Next' d='Shop.Theme.Actions'}</span>
+            <span class="visually-hidden">{l s='Next' d='Shop.Theme.Actions'}</span>
             <span class="material-icons">keyboard_arrow_right</span>
           </div>
         </div>

diff --git a/templates/customer/_partials/order-detail-return.tpl b/templates/customer/_partials/order-detail-return.tpl
@@ -79,10 +79,10 @@
     </p>
 
     <div class="text-center">
-      <button class="btn btn-primary d-none d-md-inline-block" data-toggle="modal" data-target="#order-return-modal">
+      <button class="btn btn-primary d-none d-md-inline-block" data-bs-toggle="modal" data-target="#order-return-modal">
         {l s='Request a return' d='Shop.Theme.Customeraccount'}
       </button>
-      <button class="btn btn-primary text-center w-100 d-block d-md-none" data-toggle="modal" data-target="#order-return-modal">
+      <button class="btn btn-primary text-center w-100 d-block d-md-none" data-bs-toggle="modal" data-target="#order-return-modal">
         {l s='Request a return' d='Shop.Theme.Customeraccount'}
       </button>
     </div>

diff --git a/templates/customer/_partials/order-details-return-table.tpl b/templates/customer/_partials/order-details-return-table.tpl
@@ -107,7 +107,7 @@
         {if $product.customizations}
           {foreach from=$product.customizations item="customization"}
             <div class="customization">
-              <a href="#" data-toggle="modal" data-target="#product-customizations-modal-{$customization.id_customization}">{l s='Product customization' d='Shop.Theme.Catalog'}</a>
+              <a href="#" data-bs-toggle="modal" data-target="#product-customizations-modal-{$customization.id_customization}">{l s='Product customization' d='Shop.Theme.Catalog'}</a>
             </div>
             <div id="_desktop_product_customization_modal_wrapper_{$customization.id_customization}">
               <div class="modal fade customization-modal" id="product-customizations-modal-{$customization.id_customization}" tabindex="-1" role="dialog" aria-hidden="true">

diff --git a/templates/customer/order-return.tpl b/templates/customer/order-return.tpl
@@ -57,7 +57,7 @@
               {if $product.customizations}
                 {foreach from=$product.customizations item="customization"}
                   <div class="customization">
-                    <a href="#" data-toggle="modal" data-target="#product-customizations-modal-{$customization.id_customization}">{l s='Product customization' d='Shop.Theme.Catalog'}</a>
+                    <a href="#" data-bs-toggle="modal" data-target="#product-customizations-modal-{$customization.id_customization}">{l s='Product customization' d='Shop.Theme.Catalog'}</a>
                   </div>
                   <div class="modal fade customization-modal" id="product-customizations-modal-{$customization.id_customization}" tabindex="-1" role="dialog" aria-hidden="true">
                     <div class="modal-dialog" role="document">