From 2895d78c6fec68a12f4e35f8edd5312bffe188ca Mon Sep 17 00:00:00 2001
From: Andres Galante <agalante@gmail.com>
Date: Fri, 17 Nov 2017 08:12:08 -0300
Subject: [PATCH 1/2] adds a hover state to the button element on the
 backrgound color utitility

---
 scss/mixins/_background-variant.scss | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/scss/mixins/_background-variant.scss b/scss/mixins/_background-variant.scss
index 7d1bc975c1f2..494439d2b45f 100644
--- a/scss/mixins/_background-variant.scss
+++ b/scss/mixins/_background-variant.scss
@@ -6,7 +6,8 @@
   #{$parent} {
     background-color: $color !important;
   }
-  a#{$parent} {
+  a#{$parent},
+  button#{$parent} {
     @include hover-focus {
       background-color: darken($color, 10%) !important;
     }

From 445150e3d19dc47eb33f2c3dabf47e5e21f2c3a9 Mon Sep 17 00:00:00 2001
From: Mark Otto <markdotto@gmail.com>
Date: Fri, 22 Dec 2017 18:43:13 -0800
Subject: [PATCH 2/2] Adjust z-index to fix hover/focus overlaps

---
 scss/_list-group.scss | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/scss/_list-group.scss b/scss/_list-group.scss
index d771364cb09a..9f145c1d30fc 100644
--- a/scss/_list-group.scss
+++ b/scss/_list-group.scss
@@ -59,6 +59,7 @@
   }
 
   @include hover-focus {
+    z-index: 1; // Place hover/active items above their siblings for proper border styling
     text-decoration: none;
   }
 
@@ -70,7 +71,7 @@
 
   // Include both here for `<a>`s and `<button>`s
   &.active {
-    z-index: 1; // Place active items above their siblings for proper border styling
+    z-index: 2; // Place active items above their siblings for proper border styling
     color: $list-group-active-color;
     background-color: $list-group-active-bg;
     border-color: $list-group-active-border-color;