v5: Tweak some colors (#31276)

* Tweak green and cyan colors, bump min contrast ratio to 4.5

Co-authored-by: XhmikosR <xhmikosr@gmail.com>
This commit is contained in:
Mark Otto 2020-07-13 11:23:38 -07:00 committed by GitHub
parent b345746bb6
commit 6914efe8dd
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 11 additions and 4 deletions

View File

@ -38,9 +38,9 @@ $pink: #d63384 !default;
$red: #dc3545 !default;
$orange: #fd7e14 !default;
$yellow: #ffc107 !default;
$green: #28a745 !default;
$green: #198754 !default;
$teal: #20c997 !default;
$cyan: #17a2b8 !default;
$cyan: #0dcaf0 !default;
// scss-docs-start colors-map
$colors: (
@ -87,10 +87,10 @@ $theme-color-interval: 8% !default;
// The contrast ratio to reach against white, to determine if color changes from "light" to "dark". Acceptable values for WCAG 2.0 are 3, 4.5 and 7.
// See https://www.w3.org/TR/WCAG20/#visual-audio-contrast-contrast
$min-contrast-ratio: 3 !default;
$min-contrast-ratio: 4.5 !default;
// Customize the light and dark text colors for use in our color contrast function.
$color-contrast-dark: $gray-900 !default;
$color-contrast-dark: $black !default;
$color-contrast-light: $white !default;
// fusv-disable

View File

@ -14,6 +14,13 @@ toc: true
- Renamed `.sr-only` and `.sr-only-focusable` to `.visually-hidden` and `.visually-hidden-focusable`.
- Renamed `sr-only()` and `sr-only-focusable()` mixins to `visually-hidden()` and `visually-hidden-focusable()`.
### Colors
- Bumped color contrast ratio from 3:1 to 4.5:1.
- Set `$black` as color contrast color instead of `$gray-900`.
- Improved `$green` (and its theme alias `$success`) color to reach new minimum color contrast (moving from `#28a745` to `#198754`).
- Improved `$cyan` (and its theme alias `$info`) color to be more vibrant (moving from `#17a2b8` to `#0dcaf0`).
### Components
#### Buttons