From a88d58605a2aa864eb28da683c187824a580b7ec Mon Sep 17 00:00:00 2001 From: Martijn Cuppens Date: Thu, 14 Mar 2019 18:36:02 +0100 Subject: [PATCH] Remove hover states on background utilities (#28457) --- scss/mixins/_background-variant.scss | 14 -------------- scss/utilities/_background.scss | 4 +++- site/content/docs/4.3/utilities/colors.md | 2 +- 3 files changed, 4 insertions(+), 16 deletions(-) diff --git a/scss/mixins/_background-variant.scss b/scss/mixins/_background-variant.scss index 494439d2b4..55dcccd5d9 100644 --- a/scss/mixins/_background-variant.scss +++ b/scss/mixins/_background-variant.scss @@ -1,19 +1,5 @@ // stylelint-disable declaration-no-important -// Contextual backgrounds - -@mixin bg-variant($parent, $color) { - #{$parent} { - background-color: $color !important; - } - a#{$parent}, - button#{$parent} { - @include hover-focus { - background-color: darken($color, 10%) !important; - } - } -} - @mixin bg-gradient-variant($parent, $color) { #{$parent} { background: $color linear-gradient(180deg, mix($body-bg, $color, 15%), $color) repeat-x !important; diff --git a/scss/utilities/_background.scss b/scss/utilities/_background.scss index 1f18b2f3f3..f9fbb48b9d 100644 --- a/scss/utilities/_background.scss +++ b/scss/utilities/_background.scss @@ -1,7 +1,9 @@ // stylelint-disable declaration-no-important @each $color, $value in $theme-colors { - @include bg-variant(".bg-#{$color}", $value); + .bg-#{$color} { + background-color: $value !important; + } } @if $enable-gradients { diff --git a/site/content/docs/4.3/utilities/colors.md b/site/content/docs/4.3/utilities/colors.md index 0101a4dd57..13b204d41f 100644 --- a/site/content/docs/4.3/utilities/colors.md +++ b/site/content/docs/4.3/utilities/colors.md @@ -35,7 +35,7 @@ Contextual text classes also work well on anchors with the provided hover and fo ## Background color -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. +Similar to the contextual text color classes, easily set the background of an element to any contextual class. Background utilities **do not set `color`**, so in some cases you'll want to use `.text-*` utilities. {{< example >}} {{< colors.inline >}}