diff --git a/CHANGELOG.md b/CHANGELOG.md index 062875f357..a7f0c6ed16 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,6 +1,7 @@ # Changelog ## Draft +- Add aria label with price to Product List Item. [#1878](https://github.com/bigcommerce/cornerstone/pull/1878) - Fixed comparing Products on 'Account - Recently Viewed' page. [#1877](https://github.com/bigcommerce/cornerstone/pull/1877) - Remove layout shifts to improve CLS indicator from Lighthouse performance report. [#1869](https://github.com/bigcommerce/cornerstone/pull/1869) - Fix aria-labels for collapsibleFactory elements. [#1868](https://github.com/bigcommerce/cornerstone/pull/1868) diff --git a/templates/components/products/list-item.html b/templates/components/products/list-item.html index a06b9ff69b..686a61f57a 100644 --- a/templates/components/products/list-item.html +++ b/templates/components/products/list-item.html @@ -45,7 +45,14 @@
{{brand.name}}
{{/if}}{{{summary}}}
diff --git a/templates/components/products/product-aria-label.html b/templates/components/products/product-aria-label.html new file mode 100644 index 0000000000..1817f8734e --- /dev/null +++ b/templates/components/products/product-aria-label.html @@ -0,0 +1,23 @@ +{{#and price.price_range (if theme_settings.price_ranges '==' true)}} +{{#and price.price_range.min.with_tax price.price_range.max.with_tax}} +{{lang 'category.shop_by_price_range_aria' from=price.price_range.min.with_tax.formatted to=price.price_range.max.with_tax.formatted}} +{{else}} +{{lang 'category.shop_by_price_range_aria' from=price.price_range.min.without_tax.formatted to=price.price_range.max.without_tax.formatted}} +{{/and}} +{{else}} +{{#if price.with_tax}} +{{#if price.non_sale_price_with_tax}} +{{theme_settings.pdp-non-sale-price-label}}{{price.non_sale_price_with_tax.formatted}}, +{{theme_settings.pdp-sale-price-label}}{{price.with_tax.formatted}} +{{else}} +{{price.with_tax.formatted}} +{{/if}} +{{else}} +{{#if price.non_sale_price_without_tax}} +{{theme_settings.pdp-non-sale-price-label}}{{price.non_sale_price_without_tax.formatted}}, +{{theme_settings.pdp-sale-price-label}}{{price.without_tax.formatted}} +{{else}} +{{price.without_tax.formatted}} +{{/if}} +{{/if}} +{{/and}}