Skip to content
This repository was archived by the owner on Nov 4, 2025. It is now read-only.

Critical issues#310

Open
Detroit-the-Dev wants to merge 5 commits intotsdataclinic:developfrom
Detroit-the-Dev:critical_issues
Open

Critical issues#310
Detroit-the-Dev wants to merge 5 commits intotsdataclinic:developfrom
Detroit-the-Dev:critical_issues

Conversation

@Detroit-the-Dev
Copy link
Contributor

Summary

For people with visual impairments or colorblindness, the text in the 'Specific portal' button was difficult to read. To accommodate all users the background color of the button was changed to a more high contrast color that's in conformance with the WCAG standards.

Screenshots or Videos (if applicable)

Include screenshots or video recordings to show off your change (if applicable).

Before Button Background Change
After Button Background Change

Related Issues

Fixes Issue #309

Test Plan

Please describe the exact steps you followed to test your change. Be as clear as possible so a reviewer can follow the same steps. List what UI interactions are needed, or if there are automated tests then list what should be run. For example:

  1. Go to: https://scout.tsdataclinic.com/explore/NYC
  2. Viewed the 'Specific portal' button but found the text to be low contrast to the background.
  3. Went to https://webaim.org/resources/contrastchecker to check color conformance.
  4. Verified that the contrast ratio failed for accessibility.
  5. Changed button background color to a more high contrast option.

Checklist Before Requesting a Review

  • I have performed a self-review of my code
  • My code follows the Style Guidelines and Best Practices outlined in the project wiki
  • I have commented my code, particularly in hard-to-understand areas
  • I have made changes to the documentation, if applicable
  • My change generates no new warnings or failed tests
  • If it is a core feature, I have added thorough tests
  • I have implemented analytics, if applicable

Copy link

@jpsyx jpsyx left a comment

Choose a reason for hiding this comment

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

A few minor fixes before we can merge :)

<DatasetLink className="title" dataset={dataset}>
<h2>{formattedName}</h2>
<DatasetLink className="data-link-title title" dataset={dataset}>
<h2>{formattedName}</h2>asdf
Copy link

Choose a reason for hiding this comment

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

Don't forget to remove the "asdf" on this line

Comment on lines +4 to +9
.data-link-title{
color:red;
&:focus-visible{
color:aqua;
}
}
Copy link

Choose a reason for hiding this comment

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

Don't forget the necessary spaces here after the : and before the curly braces, so we can stick to the convention in the rest of the file


return (
<div className="home-page">
hello
Copy link

Choose a reason for hiding this comment

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

Let's remove this "hello"! :)

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

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants