AlaskaAirlines / auro-hyperlink

Custom hyperlink element to connect webpages or data items to one another
https://auro.alaskaair.com/components/auro/hyperlink
Apache License 2.0
2 stars 2 forks source link

Hyperlink incorrectly displaying on-dark UI #177

Closed blackfalcon closed 5 days ago

blackfalcon commented 1 year ago

Please verify the version of auro-hyperlink you have installed

3.3.3

Please describe the bug

Looking at the newly released AS.com header/footer, I noticed that we have issues with the :focus-visible state for auro-hyperlink when on a dark background. Please see the screen recording below.

Aug-25-2023 11-15-42

I understand that we allow for users to change the appearance of the hyperlink using the CSS part of link, but we have an inconsistency issue with the different states of the element.

The biggest issue is the use of the hyperlink in the card UIs. This bug clearly creates a useability issue.

Screen Shot 2023-08-25 at 11 18 41 AM

Reproducing the error

This issue cannot be reproduced on the Auro docsite

Expected behavior

The hyperlink element should represent itself correctly in situations of on-light and on-dark backgrounds. This includes all dates of the element, specifically :focus-visible.

What browsers are you seeing the problem on?

Firefox, Chrome, Safari, Microsoft Edge

Additional context

Exit criteria

This issue can be closed once the hyperlink element correctly addresses all UI states as described in the design specification document.

Patrick-Daly-AA commented 11 months ago

Our piece of investigation is to look and see if we're using the right colors. From there, it either goes to the Content team if it was modified for the footer, or to Design if we need to update the design to meet the needs of the footer.