fix: (CXSPA-7992) Store, MyPreferredStoreComponent 'In Stock' icon co…

…ntrast (#19617)
SAP · Nov 26, 2024 · 688476e · 688476e
1 parent c0a63ef
commit 688476e
Show file tree

Hide file tree

Showing 4 changed files with 11 additions and 0 deletions.
diff --git a/feature-libs/pickup-in-store/components/presentational/store/store.component.ts b/feature-libs/pickup-in-store/components/presentational/store/store.component.ts
@@ -32,6 +32,7 @@ export class StoreComponent implements OnInit {
   constructor() {
     useFeatureStyles('a11yVisibleFocusOverflows');
     useFeatureStyles('a11yViewHoursButtonIconContrast');
+    useFeatureStyles('a11yStoreInStockIconContrast');
   }
 
   ngOnInit(): void {

diff --git a/feature-libs/pickup-in-store/styles/_store.scss b/feature-libs/pickup-in-store/styles/_store.scss
@@ -55,6 +55,9 @@
   .cx-store-stock-icon {
     color: var(--cx-color-secondary);
     opacity: var(--cx-opacity, 0.5);
+    @include forFeature('a11yStoreInStockIconContrast') {
+      opacity: var(--cx-opacity, 1);
+    }
   }
 
   .cx-store-out-of-stock {

diff --git a/projects/core/src/features-config/feature-toggles/config/feature-toggles.ts b/projects/core/src/features-config/feature-toggles/config/feature-toggles.ts
@@ -649,6 +649,11 @@ export interface FeatureTogglesInterface {
    */
   a11yViewHoursButtonIconContrast?: boolean;
 
+  /**
+   * `StoreComponent` `In Stock` icon has an acceptable contrast ratio in a default theme
+   */
+  a11yStoreInStockIconContrast?: boolean;
+
   /**
    * `Checkout` add a landmarks to content representing steps
    */
@@ -921,6 +926,7 @@ export const defaultFeatureToggles: Required<FeatureTogglesInterface> = {
   a11yItemCounterFocus: false,
   a11yScrollToReviewByShowReview: false,
   a11yViewHoursButtonIconContrast: false,
+  a11yStoreInStockIconContrast: false,
   a11yCheckoutStepsLandmarks: false,
   a11yQTY2Quantity: false,
   a11yImproveButtonsInCardComponent: false,

diff --git a/projects/storefrontapp/src/app/spartacus/spartacus-features.module.ts b/projects/storefrontapp/src/app/spartacus/spartacus-features.module.ts
@@ -391,6 +391,7 @@ if (environment.cpq) {
         a11yItemCounterFocus: true,
         a11yScrollToReviewByShowReview: true,
         a11yViewHoursButtonIconContrast: true,
+        a11yStoreInStockIconContrast: true,
         a11yCheckoutStepsLandmarks: true,
         a11yQTY2Quantity: true,
         a11yImproveButtonsInCardComponent: true,