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

Dashboard: Works > Navigation tab links report low contrast errors #6892

Closed
1 task
eporter23 opened this issue Aug 16, 2024 · 3 comments · Fixed by #6934 or #6958
Closed
1 task

Dashboard: Works > Navigation tab links report low contrast errors #6892

eporter23 opened this issue Aug 16, 2024 · 3 comments · Fixed by #6934 or #6958
Assignees

Comments

@eporter23
Copy link
Contributor

eporter23 commented Aug 16, 2024

Descriptive summary

As part of ongoing testing in the Hyrax Maintenance Working Group, routine testing from the Accessibility worksheet reports alerts in WAVE related to the All Works and My Works tabs when using the Dashboard. These errors are reported when no styling or customization has been added.

Steps to reproduce the behavior in User Interface (UI)

  1. Ensure that you have the WAVE plugin for Chrome installed
  2. Navigate to Dashboard > Works
  3. Run the page view through WAVE
  4. Note alerts related to low contrast errors for the "All Works" and "My Works" tabs

Actual behavior (include screenshots if available)

Hyrax 5.0.1 (main) using Sirenia docker image.

Acceptance Criteria/Expected Behavior

  • Dashboard views should not return accessibility alerts or warnings

Rationale (for feature request only)

Provide the rationale or user story that describes "why" this issue should be addressed. Especially if this is a new feature or significant change to the existing implementation.

Related work

This ticket relates to other tickets for global navigation elements in which low contrast errors are reported between the link text and the background color.

@rjkati
Copy link

rjkati commented Aug 16, 2024

The contrast error in WAVE is tied to the h1 header. Other contrast errors were cleared by changing the button and link colors (see PR 6847
dashboard_wave

Strangely, the SiteImprove browser extension doesn't flag the h1 header for color contrast.

@jlhardes
Copy link
Contributor

The PR says the change is passing SiteImprove but SiteImprove never flagged this as a problem. Wave is flagging something as a color contrast issue and it seems to be the h1 header with the class="sr-only" for Nurax (maybe it is a hidden header?). I am seeing the Wave report with a color contrast problem still and when you turn off styles in Wave, that h1 header is showing with a very low contrast font on the background. It looks like dev.nurax has the PR changes in place and Wave is still showing this color contrast problem.

@christhepianist
Copy link

Tested and confirmed that this is no longer an issue.

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

Successfully merging a pull request may close this issue.

5 participants