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

Color Contrast in cookie settings box is not sufficient #2668

Closed
reetagithub opened this issue Nov 29, 2023 · 7 comments
Closed

Color Contrast in cookie settings box is not sufficient #2668

reetagithub opened this issue Nov 29, 2023 · 7 comments

Comments

@reetagithub
Copy link
Contributor

Describe the bug
In the "We collect and process your personal information..." box, there is green text on the black background. The contrast between these two is not sufficient: accessibility requirements say it should be 4.5:1, but it is only 3.27:1.

To Reproduce
Use WAVE on the page, or fill https://webaim.org/resources/contrastchecker/

@reetagithub reetagithub added bug needs triage New issue needs triage and/or scheduling labels Nov 29, 2023
@github-project-automation github-project-automation bot moved this to 🆕 Triage in DSpace Backlog Nov 29, 2023
@tdonohue tdonohue added accessibility help wanted Needs a volunteer to claim to move forward and removed needs triage New issue needs triage and/or scheduling labels Nov 29, 2023
@tdonohue tdonohue changed the title Contrast in cookie settings box is not sufficient Color Contrast in cookie settings box is not sufficient Nov 29, 2023
@tdonohue tdonohue added the good first issue This is a smaller ticket/bug that may be easier for new contributors label Dec 6, 2023
@tdonohue
Copy link
Member

PR #3039 has partially fixed this issue (for 7.6.2 and 8.0). That PR updates the styles of the initial Klaro popup window to have proper color contrast. Here's the new look:
initialpopup

However, if you click on "Customize" in that popup, you'll see a larger list of all possible settings. This larger popup still has color contrast issues (a lot of dark gray text on a black background) as shown in this screenshot:
FullSettings

@Andrea-Guevara
Copy link
Contributor

@tdonohue Hi, I'd like to take this activity. I understood that the problem was only the gray color of some texts. Is that right?

@tdonohue
Copy link
Member

tdonohue commented Jun 18, 2024

@Andrea-Guevara : I'm not exactly sure if the gray color is the only issue. I was mentioning it as an example. The primary problem is that this page in the popup fails when analyzed by an accessibility scanner (e.g. WAVE or the "axe DevTools" plugin in Chrome).

FullSettings

So, to fix this ticket would require that all pages within the Klaro popup to succeed accessibility scanning.

To reproduce:

  • Visit https://sandbox.dspace.org in an Incognito browser
  • Klaro cookie popup should appear. Click on "Customize" to bring up the screen above
  • Expand all sections on that screen.
  • Run an accessibility scanner (either WAVE or "axe DevTools). Both will report 5-10 color contrast issues. Those are what need to be fixed.

I'll assign this to you @Andrea-Guevara . But, if you change your mind, let me know and we can find a different volunteer.

@tdonohue tdonohue moved this from 📋 To Do to 🏗 In Progress in DSpace 8.x and 7.6.x Maintenance Jun 18, 2024
@tdonohue tdonohue removed help wanted Needs a volunteer to claim to move forward good first issue This is a smaller ticket/bug that may be easier for new contributors labels Jun 18, 2024
@Andrea-Guevara
Copy link
Contributor

Andrea-Guevara commented Jun 19, 2024

Hello @tdonohue, good afternoon.

I did some tests and managed to reduce the accessibility problems of the cookis configuration box.

However, I had to use "!important" in some parts of the code for the css changes to take effect. Is this a problem?

I look forward to your feedback.
issue-2668

Andrea-Guevara pushed a commit to Neki-IT/dspace-angular that referenced this issue Jun 21, 2024
@Andrea-Guevara
Copy link
Contributor

Good afternoon @tdonohue! I've made a PR so you can see the code.
#3140

I look forward to your feedback

Andrea-Guevara added a commit to Andrea-Guevara/dspace-angular that referenced this issue Sep 13, 2024
@Andrea-Guevara
Copy link
Contributor

Good afternoon @tdonohue! I made a new PR updated to DSpace version 8 and the pull request has now gone to the dspace-8_x branch.

Is that right?
If not, let me know! I'll be waiting.

PR updated: #3328

@tdonohue tdonohue added this to the 8.1 milestone Nov 8, 2024
@tdonohue
Copy link
Member

tdonohue commented Nov 8, 2024

Closing, fixed by #3328 and #3627

@tdonohue tdonohue closed this as completed Nov 8, 2024
@github-project-automation github-project-automation bot moved this from 🏗 In Progress to ✅ Done in DSpace 8.x and 7.6.x Maintenance Nov 8, 2024
tdonohue pushed a commit to tdonohue/dspace-angular that referenced this issue Nov 8, 2024
@tdonohue tdonohue modified the milestones: 8.1, 7.6.3 Nov 8, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment