diff --git a/docs/utilities/colors.md b/docs/utilities/colors.md index 62315e614c..216941f95a 100644 --- a/docs/utilities/colors.md +++ b/docs/utilities/colors.md @@ -13,9 +13,10 @@ Convey meaning through color with a handful of emphasis utility classes. These m

Maecenas sed diam eget risus varius blandit sit amet non magna.

Etiam porta sem malesuada magna mollis euismod.

Donec ullamcorper nulla non metus auctor fringilla.

+

Etiam porta sem malesuada ultricies vehicula.

{% endexample %} -Contextual text classes also work well on anchors with the provided hover and focus states. +Contextual text classes also work well on anchors with the provided hover and focus states. **Note that the `.text-white` class has no link styling.** {% example html %} Muted link @@ -26,15 +27,15 @@ Contextual text classes also work well on anchors with the provided hover and fo Danger link {% endexample %} -Similar to the contextual text color classes, easily set the background of an element to any contextual class. Anchor components will darken on hover, just like the text classes. +Similar to the contextual text color classes, easily set the background of an element to any contextual class. Anchor components will darken on hover, just like the text classes. Background utilities **do not set `color`**, so in some cases you'll want to use `.text-*` utilities. {% example html %} -
Nullam id dolor id nibh ultricies vehicula ut id elit.
-
Duis mollis, est non commodo luctus, nisi erat porttitor ligula.
-
Maecenas sed diam eget risus varius blandit sit amet non magna.
-
Etiam porta sem malesuada magna mollis euismod.
-
Donec ullamcorper nulla non metus auctor fringilla.
-
Cras mattis consectetur purus sit amet fermentum.
+
Nullam id dolor id nibh ultricies vehicula ut id elit.
+
Duis mollis, est non commodo luctus, nisi erat porttitor ligula.
+
Maecenas sed diam eget risus varius blandit sit amet non magna.
+
Etiam porta sem malesuada magna mollis euismod.
+
Donec ullamcorper nulla non metus auctor fringilla.
+
Cras mattis consectetur purus sit amet fermentum.
{% endexample %} {% callout info %} diff --git a/scss/mixins/_background-variant.scss b/scss/mixins/_background-variant.scss index ff21ad958f..54a734dcc8 100644 --- a/scss/mixins/_background-variant.scss +++ b/scss/mixins/_background-variant.scss @@ -2,7 +2,6 @@ @mixin bg-variant($parent, $color) { #{$parent} { - color: #fff !important; background-color: $color !important; } a#{$parent} { diff --git a/scss/utilities/_text.scss b/scss/utilities/_text.scss index 901f771442..a12f9a1788 100644 --- a/scss/utilities/_text.scss +++ b/scss/utilities/_text.scss @@ -32,6 +32,10 @@ // Contextual colors +.text-white { + color: #fff !important; +} + @include text-emphasis-variant('.text-muted', $text-muted); @include text-emphasis-variant('.text-primary', $brand-primary);