Fixed EuiComboBox padding on the right (#2135)

elastic · Jul 17, 2019 · c350f7f · c350f7f
1 parent d4ce2ab
commit c350f7f
Show file tree

Hide file tree

Showing 2 changed files with 15 additions and 8 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -1,6 +1,8 @@
 ## [`master`](https://github.com/elastic/eui/tree/master)
 
-No public interface changes since `12.4.0`.
+**Bug fixes**
+
+- Fixed `EuiComboBox`'s padding on the right ([#2135](https://github.com/elastic/eui/pull/2135))
 
 ## [`12.4.0`](https://github.com/elastic/eui/tree/v12.4.0)
 

diff --git a/src/components/combo_box/_combo_box.scss b/src/components/combo_box/_combo_box.scss
@@ -1,3 +1,5 @@
+@import '../form/form_control_layout/mixins';
+
 .euiComboBox {
   @include euiFormControlSize(auto, $includeAlternates: true);
   position: relative;
@@ -18,17 +20,16 @@
     @include euiFormControlWithIcon($isIconOptional: true);
     @include euiFormControlSize(auto, $includeAlternates: true);
     padding: $euiSizeXS $euiSizeS;
-    // sass-lint:disable-block mixins-before-declarations
-    @include euiFormControlLayoutPadding(1); /* 2 */
-
     display: flex; /* 1 */
 
-    &.euiComboBox__inputWrap-isClearable {
-      @include euiFormControlLayoutPadding(2); /* 2 */
-    }
+    // sass-lint:disable-block mixins-before-declarations
+    // to override the padding added above
+    @include euiFormControlLayoutPadding(1); /* 2 */
 
     &:not(.euiComboBox__inputWrap--noWrap) {
-      padding: $euiSizeXS;
+      padding-top: $euiSizeXS;
+      padding-bottom: $euiSizeXS;
+      padding-left: $euiSizeXS;
       height: auto;  /* 3 */
       flex-wrap: wrap; /* 1 */
       align-content: flex-start;
@@ -37,6 +38,10 @@
         cursor: text;
       }
     }
+
+    &.euiComboBox__inputWrap-isClearable {
+      @include euiFormControlLayoutPadding(2); /* 2 */
+    }
   }
 
   /**