Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

YSP-785: A11y: New Haven Green + ONHA Mega Footer link contrast #456

Merged
merged 11 commits into from
Feb 10, 2025

Conversation

dblanken-yale
Copy link
Contributor

@dblanken-yale dblanken-yale commented Jan 21, 2025

YSP-785: A11y: New Haven Green + ONHA Mega Footer link contrast

Description of work

  • Fixes contrast issues for footer content links in multiple states
  • Fixes footer link group contrast issues in multiple themes

Testing Link(s)

Functional Review Steps

  • In Controls, change Footer Variation (dial) to mega
  • Verify the link groups pass contrast for unvisited, visited, hover, and visited hover states
  • Verify the middle content links pass contrast for unvisited, visited, hover, and visited hover states
  • Change Footer Theme (dial) from one to two and three and verify the same is true
  • Toward the top of the page, set Site: Global Theme (lever) to a new theme and verify it all again
  • Ensure all footer site themes in mega pass contrast in all link states for all global themes (What you hopefully did above)
  • Visit the multidev, log in, and click Theme settings to play with the footer settings there
  • Verify that on Drupal, all footer links pass contrast

Design Review

Accessibility Review

  • Verify the component meets Accessibility requirements

Copy link

netlify bot commented Jan 21, 2025

Deploy Preview for dev-component-library-twig ready!

Name Link
🔨 Latest commit 81c43f9
🔍 Latest deploy log https://app.netlify.com/sites/dev-component-library-twig/deploys/67aa51445f56050008026ed7
😎 Deploy Preview https://deploy-preview-456--dev-component-library-twig.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify site configuration.

Copy link

@miketullo95 miketullo95 left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

looks good!

Copy link
Contributor

@chaohlu chaohlu left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

looks good.

While the default placeholder is nice, we want to be able to track
link contrast issues in the footer.  This allows us to provide an
override on the Storybook side that would allow us to display this for
verification, while keeping existing functionality.
We want to see actual links inside of the footer, so this is a way for
us to do so to verify contrast issues.
This allows us to see what links would really look like in the component
library.
To make sure we pass contrast, we are forcing this to mimic the color of
the text it is with.
To pass contrast, mimic the content portion to have a consistent footer
that passes contrast tests.
@dblanken-yale dblanken-yale force-pushed the YSP-785-nhg-onha-mega-footer-link-contrast branch from 988480d to 81c43f9 Compare February 10, 2025 19:19
@dblanken-yale dblanken-yale merged commit bbf16eb into develop Feb 10, 2025
5 checks passed
@dblanken-yale dblanken-yale deleted the YSP-785-nhg-onha-mega-footer-link-contrast branch February 10, 2025 19:29
@vinmassaro vinmassaro mentioned this pull request Feb 11, 2025
Copy link

🎉 This PR is included in version 1.49.0 🎉

The release is available on:

Your semantic-release bot 📦🚀

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging this pull request may close these issues.

4 participants