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

Add warnings to output for alpha levels in contrast check #223

Merged
merged 2 commits into from
Jul 5, 2018

Conversation

phillbaker
Copy link
Contributor

@phillbaker phillbaker commented Jul 4, 2018

This builds on #134 and the discussion there.

This is the initial PR, based on #134, to detect apha in either font text color or background color and issue a warning. It squashes all of the commits in #134 into one commit and adds a commit to focus the scope of the PR on just issuing warnings.

Three complications with calculating the "flattened" (non-alpha) representation of font color and background color discussed in #134 are:

  • determining what is actually behind the text - elements may be positioned with css such that it's very hard to determine what element is the background of some or all of the text
  • the css opacity element may introduce further aspects of transparency
  • transparent background can reveal images where contrast cannot be calculated

It looks like a couple of other fixes were originally included in #134 that I left in that we can pull out into separate PRs if they're desired:

This PR also adds an example to the test contrast html file.

screen shot 2018-07-04 at 7 52 55 pm

Three complications with calculating the "flattened" (non-alpha) representation of font color and background color are:
* determining what is actually behind the text - elements may be positioned with css such that it's very hard to determine what element is the background of some or all of the text
* the css opacity element may introduce further aspects of transparency
* transparent background can reveal images where contrast cannot be calculated
@ironikart ironikart self-assigned this Jul 5, 2018
@ironikart ironikart merged commit 5086fe6 into squizlabs:master Jul 5, 2018
@ironikart
Copy link
Contributor

Thanks for this PR @phillbaker. I've made a few modifications and tested it out, seems to work well with the exception of some quirks with the unit test (I think phantomJS related because they work fine in the browser).

@phillbaker phillbaker deleted the rgba-warnings branch July 5, 2018 13:50
@phillbaker
Copy link
Contributor Author

Thanks! Any chance of getting a release soon to include this?

@ironikart
Copy link
Contributor

I'll put it on the radar, but it won't be this week (The current build process is quite time consuming and I need to allocate a decent slice to it).

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.

3 participants