From a845a2a86c7837fbaaadfbf614fb6db06f79c20a Mon Sep 17 00:00:00 2001
From: Ryan Keairns <contactryank@gmail.com>
Date: Mon, 2 Dec 2019 09:59:11 -0600
Subject: [PATCH] adds background-color to compressed button group (#2568)

* adds background-color to compressed button group

* lighten input group border color
---
 CHANGELOG.md                                          | 1 +
 src/components/button/button_group/_button_group.scss | 1 +
 src/components/form/_variables.scss                   | 4 ++--
 3 files changed, 4 insertions(+), 2 deletions(-)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index cd69539d9fd..1b1d925484a 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -1,5 +1,6 @@
 ## [`master`](https://github.com/elastic/eui/tree/master)
 
+- Updated compressed styles for `EuiButtonGroup` to include a background color ([#2568](https://github.com/elastic/eui/pull/2568))
 - Added `heading` prop to `EuiCallOut` to allow for variance in the title tag ([#2357](https://github.com/elastic/eui/pull/2357))
 - Added `badge` prop and new styles `EuiHeaderAlert` ([#2506](https://github.com/elastic/eui/pull/2506))
 - Added new keyboard shortcuts for the data grid component: `Home` (same row, first column), `End` (same row, last column), `Ctrl+Home` (first row, first column), `Ctrl+End` (last row, last column), `Page Up` (next page) and `Page Down` (previous page) ([#2519](https://github.com/elastic/eui/pull/2519))
diff --git a/src/components/button/button_group/_button_group.scss b/src/components/button/button_group/_button_group.scss
index a19d9698ef3..36f96cff529 100644
--- a/src/components/button/button_group/_button_group.scss
+++ b/src/components/button/button_group/_button_group.scss
@@ -94,6 +94,7 @@
 .euiButtonGroup--compressed {
   border: 1px solid $euiFormBorderColor;
   border-radius: $euiFormControlCompressedBorderRadius;
+  background-color: $euiFormBackgroundColor;
 
   .euiButtonGroup__button {
     height: $euiFormControlCompressedHeight - 2px;
diff --git a/src/components/form/_variables.scss b/src/components/form/_variables.scss
index 9381b8cffc8..f71551ee16d 100644
--- a/src/components/form/_variables.scss
+++ b/src/components/form/_variables.scss
@@ -33,6 +33,6 @@ $euiFormCustomControlDisabledIconColor: shadeOrTint($euiColorMediumShade, 38%, 4
 $euiFormCustomControlBorderColor: shadeOrTint($euiColorLightestShade, 18%, 30%) !default;
 $euiFormControlDisabledColor: $euiColorMediumShade !default;
 $euiFormControlBoxShadow: 0 1px 1px -1px transparentize($euiShadowColor, .8), 0 3px 2px -2px transparentize($euiShadowColor, .8) !default;
-$euiFormInputGroupLabelBackground: tintOrShade($euiColorLightShade, 65%, 40%) !default;
-$euiFormInputGroupBorder: 1px solid shadeOrTint($euiFormInputGroupLabelBackground, 6%, 8%) !default;
+$euiFormInputGroupLabelBackground: tintOrShade($euiColorLightShade, 50%, 40%) !default;
+$euiFormInputGroupBorder: 1px solid shadeOrTint($euiFormInputGroupLabelBackground, 2%, 4%) !default;
 $euiSwitchOffColor: lightOrDarkTheme(transparentize($euiColorMediumShade, .8), transparentize($euiColorMediumShade, .3)) !default;