From 501aee5e944fd808684ff83cbc5a5949037fc757 Mon Sep 17 00:00:00 2001
From: Kevin Ruscoe <kevdotbadger@gmail.com>
Date: Tue, 6 Sep 2016 12:26:23 +0100
Subject: [PATCH] Update _buttons.scss

The hover/active color is defaulted to white. If the user adds a lightly coloured button (such as yellow), then the white text gets lost. This conditionally checks the color passed to return either white, or the $body-color. Fixes #20609
---
 scss/mixins/_buttons.scss | 24 ++++++++++++++++++++----
 1 file changed, 20 insertions(+), 4 deletions(-)

diff --git a/scss/mixins/_buttons.scss b/scss/mixins/_buttons.scss
index 5196ab65e196..60d435ed2be1 100644
--- a/scss/mixins/_buttons.scss
+++ b/scss/mixins/_buttons.scss
@@ -65,14 +65,22 @@
   border-color: $color;
 
   @include hover {
-    color: #fff;
+	  @if (lightness($color) > 50) {
+	        color: #fff;
+	      }@else{
+	        color: $body-color;
+	      }
     background-color: $color;
         border-color: $color;
   }
 
   &:focus,
   &.focus {
-    color: #fff;
+    @if (lightness($color) > 50) {
+      color: #fff;
+    }@else{
+      color: $body-color;
+    }
     background-color: $color;
         border-color: $color;
   }
@@ -80,14 +88,22 @@
   &:active,
   &.active,
   .open > &.dropdown-toggle {
-    color: #fff;
+    @if (lightness($color) > 50) {
+      color: #fff;
+    }@else{
+      color: $body-color;
+    }
     background-color: $color;
         border-color: $color;
 
     &:hover,
     &:focus,
     &.focus {
-      color: #fff;
+      @if (lightness($color) > 50) {
+        color: #fff;
+      }@else{
+        color: $body-color;
+      }
       background-color: darken($color, 17%);
           border-color: darken($color, 25%);
     }