search

AlaskaAirlines / auro-accordion

Custom element that allows users to toggle the display for sections of content
https://auro.alaskaair.com/components/auro/accordion
Apache License 2.0
1 stars 1 forks source link

Inconsistent chevron color #116

Open blackfalcon opened 1 month ago

blackfalcon commented 1 month ago

Please verify the version of auro-accordion you have installed

@latest

Please describe the bug

  1. Go to https://auro.alaskaair.com/components/auro/accordion
  2. Look at chevrons for both DEFAULT and GROUPED examples
  3. See in DEFAULT that the chevron is lime
  4. See in GROUPED that the chevron is #222222

There are some other notable issues here.

  1. Why are there two different colors for either default or grouped configurations?
  2. The default version, the Sass rendered value is not in sync with the updated token value
  3. The fallback color of #222222 is no longer supported
  4. The fallback color of #0074c8 is no longer supported
Screenshot 2024-07-09 at 11 18 44 AM Screenshot 2024-07-09 at 11 22 24 AM

Reproducing the error on the docsite

This issue is reproducible on the Auro docsite

Expected behavior

The component should be using the correct UI colors.

What browsers do you see the problem on?

All

Additional context

The value used for this part of the UI was changed at the design token level, see this PR https://github.com/AlaskaAirlines/AuroDesignTokens/commit/e3b946cda3a96842d23e4cd141284435f0d28960#diff-bce8c69dbace16227a603c0840e862370d2fca7d9239d1215b9fd16eb0a53dffR78

Looking at the Figma file, I can see that the intended UI color is #222222, which isn't even a supported color any longer.

I would argue with the new colors that --ds-color-icon-emphasis-default would be used for both scenarios.

Exit criteria

This issue can be closed once the following are addressed:

  1. The Figma documentation should be reflective of the correct token to be used
  2. The code is updated to support the design correctly
  3. Fallback colors are updated appropriately