From 7c10068c76751ee0ae8aab8cf0b7bdfdf40912ae Mon Sep 17 00:00:00 2001
From: afholderman <afholderman@gmail.com>
Date: Fri, 24 Nov 2017 18:42:40 -0600
Subject: [PATCH] Darken outline hover color to match default button hover
 (#24150)

* Fix Issue #24144

Alter button-outline-variant mixin to darken hover and active background in same fashion as filled button.

* Fix Issue #24144

Filled button on hover should utilize the same color-yiq mixin so that theme buttons match

* default values, fix mixin
---
 scss/mixins/_buttons.scss | 16 ++++++++--------
 1 file changed, 8 insertions(+), 8 deletions(-)

diff --git a/scss/mixins/_buttons.scss b/scss/mixins/_buttons.scss
index de3c530bb5dc..c6e0e03a4c1c 100644
--- a/scss/mixins/_buttons.scss
+++ b/scss/mixins/_buttons.scss
@@ -51,16 +51,16 @@
   }
 }
 
-@mixin button-outline-variant($color, $color-hover: #fff) {
+@mixin button-outline-variant($color, $color-hover: #fff, $active-background: $color, $active-border: $color) {
   color: $color;
   background-color: transparent;
   background-image: none;
   border-color: $color;
 
-  @include hover {
-    color: $color-hover;
-    background-color: $color;
-    border-color: $color;
+  &:hover {
+    color: color-yiq($color);
+    background-color: $active-background;
+    border-color: $active-border;
   }
 
   &:focus,
@@ -77,9 +77,9 @@
   &:not([disabled]):not(.disabled):active,
   &:not([disabled]):not(.disabled).active,
   .show > &.dropdown-toggle {
-    color: $color-hover;
-    background-color: $color;
-    border-color: $color;
+    color: color-yiq($color-hover);
+    background-color: $active-background;
+    border-color: $active-border;
     // Avoid using mixin so we can pass custom focus shadow properly
     box-shadow: 0 0 0 $btn-focus-width rgba($color, .5);
   }