color ratio fix

[maraah1]

fixes #[issue number]
#4277

PR Type

Bugfix

Describe the current behavior?

Describe the new behavior?

PR Checklist

• Test: run npm run test and ensure that all tests pass
• Target main branch (or an appropriate release branch if appropriate for a bug fix)
• Ensure that your contribution follows standard accessibility guidelines. Use tools like https://webhint.io/ to validate your changes.

Additional Information

[microsoft-github-policy-service]

Thanks maraah1 for opening a Pull Request! The reviewers will test the PR and highlight if there is any conflict or changes required. If the PR is approved we will proceed to merge the pull request 🙌

[Jaylyn-Barbee]

Here's the updated look.

@maraah1, I imagine all buttons that had the old look will need to be updated whether or not they were mentioned in the original issue, ie:

Lets go ahead and update any other buttons we can find and have @zateutsch review to make sure he's cool with the changes.

[Jaylyn-Barbee]

LGTM

[zateutsch]

@maraah1 @Jaylyn-Barbee Is there a quick way to check color contrast ratio? I can go through and fix the colors for the whole site, and also double check that everything still looks nice together.

[Jaylyn-Barbee]

@zateutsch if you run the fast pass from the accessibility insights Edge extension, there is a tab that has a few color contrast call outs