diff --git a/scss/_variables.scss b/scss/_variables.scss index 6f07176ae9..d100058e55 100644 --- a/scss/_variables.scss +++ b/scss/_variables.scss @@ -401,6 +401,7 @@ $small-font-size: $font-size-sm !default; // Boosted mod → 14px $small-line-height: $line-height-sm !default; // Boosted mod → 16px $text-muted: $gray-700 !default; +$text-muted-dark: $gray-600 !default; // Boosted mod: ensure contrast on dark background $blockquote-small-color: $gray-700 !default; $blockquote-small-font-size: $small-font-size !default; diff --git a/scss/mixins/_background-variant.scss b/scss/mixins/_background-variant.scss index 3801828e0c..c6ecea3429 100644 --- a/scss/mixins/_background-variant.scss +++ b/scss/mixins/_background-variant.scss @@ -5,7 +5,7 @@ @mixin bg-variant($parent, $color, $ignore-warning: false) { $contrast: color-yiq($color); // Boosted mod: ensure contrast #{$parent} { - color: $contrast; // Boosted mod: ensure contrast + color: $contrast !important; // Boosted mod: ensure contrast background-color: $color !important; } a#{$parent}, diff --git a/scss/utilities/_text.scss b/scss/utilities/_text.scss index 4a8e77f162..e7b3d36652 100644 --- a/scss/utilities/_text.scss +++ b/scss/utilities/_text.scss @@ -45,10 +45,12 @@ // Contextual colors +// Boosted mod: ensure contrast .text-white { color: $white !important; background-color: $black !important; } +// end mod @each $color, $value in $theme-colors { // Boosted mod: disallow functionnal colors for text @@ -58,17 +60,34 @@ // end mod } -// Boosted mod +// Boosted mod: ensure contrast +.text-body { + color: $body-color !important; + background-color: $body-bg !important; +} + +.text-muted { + color: $text-muted !important; + background-color: $white !important; +} + .bg-dark, .table-dark, .navbar-dark { @include text-emphasis-variant(".text-primary", $orange-2, true); + + .text-body { + color: $body-bg !important; + background-color: $body-color !important; + } + + .text-muted { + color: $text-muted-dark !important; + background-color: $black !important; + } } // end mod -.text-body { color: $body-color !important; } -.text-muted { color: $text-muted !important; } - //.text-black-50 { color: rgba($black, .5) !important; } // Boosted mod //.text-white-50 { color: rgba($white, .5) !important; } // Boosted mod