EuiHeader Padding & EuiDescribedFormGroup Shrinking Bugs (#3369)

* rm extra padding; issues with map header size calc * rm unneeded display block rule * fix bug for EuiDescribedFormGroup not shrinking * update changelog * add links to changelog * Update CHANGELOG.md Co-Authored-By: Caroline Horn <549577+cchaos@users.noreply.github.com> * added maintainer comment * Moved CL line Co-authored-by: Caroline Horn <549577+cchaos@users.noreply.github.com>
elastic · Apr 22, 2020 · 797057a · 797057a
1 parent 8fa9243
commit 797057a
Show file tree

Hide file tree

Showing 4 changed files with 4 additions and 4 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -10,6 +10,7 @@ No public interface changes since `23.0.0`.
 - Extended `EuiDatePicker`'s `startDate` and `endDate` types to accept `null` values for better interoperability ([#3343](https://github.com/elastic/eui/pull/3343))
 - Added `EuiCommentList` component ([#3344](https://github.com/elastic/eui/pull/3344))
 - Added secondary color value input element to `EuiColorPicker` ([#3336](https://github.com/elastic/eui/pull/3336))
+- Removed additional padding applied to `$euiHeaderHeightCompensation` when `EuiHeader` is fixed ([#3369](https://github.com/elastic/eui/pull/3369))
 
 **Bug Fixes**
 
@@ -19,6 +20,7 @@ No public interface changes since `23.0.0`.
 - Fixed `EuiPopover` positioning from being overridden by `style` prop ([#3329](https://github.com/elastic/eui/pull/3329))
 - Fixed `EuiCodeBlock` not copying updated content ([#3351](https://github.com/elastic/eui/pull/3351))
 - Fixed alignment of popover of end date of `EuiDatePickerRange` ([#3359](https://github.com/elastic/eui/pull/3359))
+- Fixed `EuiDescribedFormGroup` issue that prevented it from shrinking down properly in smaller viewports ([#3369](https://github.com/elastic/eui/pull/3369))
 
 **Breaking changes**
 

diff --git a/src/components/form/described_form_group/_described_form_group.scss b/src/components/form/described_form_group/_described_form_group.scss
@@ -14,8 +14,7 @@
   }
 
   .euiDescribedFormGroup__fields {
-    width: $euiFormMaxWidth;
-    max-width: 100%;
+    min-width: 0; // Needed to support shrinking appropriately with viewport (prevents x-axis content overflow)
   }
 
   .euiDescribedFormGroup__fieldPadding {

diff --git a/src/components/form/file_picker/_file_picker.scss b/src/components/form/file_picker/_file_picker.scss
@@ -101,7 +101,6 @@
   @include euiFontSizeS;
   @include euiTextTruncate;
   line-height: $euiSize;
-  display: block;
 
   // make normal sized prompt look like placeholder
   .euiFilePicker:not(.euiFilePicker--large):not(.euiFilePicker-hasFiles) & {

diff --git a/src/components/header/_header.scss b/src/components/header/_header.scss
@@ -20,5 +20,5 @@
 }
 
 .euiBody--headerIsFixed {
-  padding-top: $euiHeaderHeightCompensation + $euiSizeS; // Extra padding to account for the shadow
+  padding-top: $euiHeaderHeightCompensation;
 }