From 669e04a29e1c591f528fb738fde5d3eb9149d360 Mon Sep 17 00:00:00 2001 From: Lokesh RANA Date: Thu, 26 Mar 2020 11:44:52 +0000 Subject: [PATCH 1/4] navdrawer scrollable in mobile view --- src/components/nav_drawer/_nav_drawer.scss | 5 +++++ 1 file changed, 5 insertions(+) diff --git a/src/components/nav_drawer/_nav_drawer.scss b/src/components/nav_drawer/_nav_drawer.scss index ad9d03a0720..99f1f91ca01 100644 --- a/src/components/nav_drawer/_nav_drawer.scss +++ b/src/components/nav_drawer/_nav_drawer.scss @@ -94,6 +94,11 @@ } @include euiBreakpoint('xs', 's') { + .euiNavDrawer > .euiFlexGroup--responsive { + flex-wrap: nowrap; + overflow-x: hidden; + } + .euiNavDrawer { width: 0; From 6f4e62ef63dcfd025c46e55c155ee0809dfd9a0a Mon Sep 17 00:00:00 2001 From: Lokesh RANA Date: Thu, 26 Mar 2020 05:05:43 -0700 Subject: [PATCH 2/4] Updated CHANGELOG.md --- CHANGELOG.md | 1 + 1 file changed, 1 insertion(+) diff --git a/CHANGELOG.md b/CHANGELOG.md index e5e2f5b5ded..abe5161a4eb 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -20,6 +20,7 @@ **Bug Fixes** +- Fixed `EuiNavDrawer` not scrolling on mobile issue ([#3174](https://github.com/elastic/eui/pull/3174)) - Fixed bug in `EuiSuperDatePicker` not showing correct values in relative tab of end date ([#3132](https://github.com/elastic/eui/pull/3132)) - Fixed bug in `EuiSuperDatePicker` to show correct values of commonly used values in relative tab ([#3106](https://github.com/elastic/eui/pull/3106)) - Fixed race condition in `EuiIcon` when switching from dynamically fetched components ([#3118](https://github.com/elastic/eui/pull/3118)) From 7d63cd29e2db933d772cffde69360bd541958e97 Mon Sep 17 00:00:00 2001 From: Lokesh RANA Date: Fri, 27 Mar 2020 16:28:47 +0000 Subject: [PATCH 3/4] EuiNavDrawer mobile scroll issue fixed by EuiFlexgroup responsive prop instead of css selectors and respective snapshot updated --- .../nav_drawer/__snapshots__/nav_drawer.test.js.snap | 6 +++--- src/components/nav_drawer/_nav_drawer.scss | 5 ----- src/components/nav_drawer/nav_drawer.js | 2 +- 3 files changed, 4 insertions(+), 9 deletions(-) diff --git a/src/components/nav_drawer/__snapshots__/nav_drawer.test.js.snap b/src/components/nav_drawer/__snapshots__/nav_drawer.test.js.snap index b8b6c6384b4..da0e1e9447d 100644 --- a/src/components/nav_drawer/__snapshots__/nav_drawer.test.js.snap +++ b/src/components/nav_drawer/__snapshots__/nav_drawer.test.js.snap @@ -5,7 +5,7 @@ exports[`EuiNavDrawer is rendered 1`] = ` class="euiNavDrawer euiNavDrawer-isCollapsed euiNavDrawer-flyoutIsCollapsed" >
.euiFlexGroup--responsive { - flex-wrap: nowrap; - overflow-x: hidden; - } - .euiNavDrawer { width: 0; diff --git a/src/components/nav_drawer/nav_drawer.js b/src/components/nav_drawer/nav_drawer.js index 6c5401d6f92..a3b093a4303 100644 --- a/src/components/nav_drawer/nav_drawer.js +++ b/src/components/nav_drawer/nav_drawer.js @@ -347,7 +347,7 @@ export class EuiNavDrawer extends Component { onOutsideClick={() => this.closeBoth()} isDisabled={this.state.outsideClickDisabled}>