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

Follow BS #30168 (WCAG algo + update master) #323

Merged
merged 4 commits into from
Feb 14, 2020
Merged

Conversation

ffoodd
Copy link
Contributor

@ffoodd ffoodd commented Feb 14, 2020

Note: Please remember that both in Bootstrap & Boosted, in v4 or v5, the color-yiq() function is white-first, meaning if the color contrast ratio with white is sufficient, function returns white — and only returns black otherwise.

Test

I'm using a single SCSS file to check color-yiq() results.

// Configuration
@import "functions";
@import "variables";
@import "mixins";
@import "utilities";

@each $color, $value in $colors {
  .yiq-#{$color} {
    color: color-yiq($value);
  }
}

Results

Color v4-dev PR v5-dev Contrast finder
#0d6efd #000 #fff #fff #fff
#6610f2 #fff #fff #fff #fff
#6f42c1 #fff #fff #fff #fff
#d63384 #000 #fff #000 #fff
#dc3545 #000 #fff #000 #fff
#fd7e14 #fff #000 #000 #000
#ffc107 #000 #000 #000 #000
#28a745 #000 #000 #000 #000
#20c997 #000 #000 #000 #000
#17a2b8 #000 #000 #000 #000
#fff #000 #000 #000 #000
#6c757d #fff #fff #fff #fff
#343a40 #fff #fff #fff #fff

FYI Colour Contrast Analyzer gives the same result than Contrast-Finder.

@ffoodd ffoodd added this to the 5.0.0-alpha milestone Feb 14, 2020
@ffoodd ffoodd self-assigned this Feb 14, 2020
@ffoodd ffoodd changed the title Update WCAG algo Follow BS #30168 (WCAG algo + update master) Feb 14, 2020
Copy link
Member

@Lausselloic Lausselloic left a comment

Choose a reason for hiding this comment

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

good idea to manage values as static!

@ffoodd
Copy link
Contributor Author

ffoodd commented Feb 14, 2020

good idea to manage values as static!

Props to @ysds in Bootstrap's team, and in Material (already used this years ago…).

Copy link
Member

@Lausselloic Lausselloic left a comment

Choose a reason for hiding this comment

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

ok

@ffoodd ffoodd merged commit 29abbd8 into v5-dev Feb 14, 2020
@ffoodd ffoodd deleted the feature/update-wcag-algo branch February 14, 2020 15:06
@ffoodd ffoodd mentioned this pull request Feb 14, 2020
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.

2 participants