[EuiFlyout][EuiCollapsibleNav] Fix broken slide in animation for left…

… flyouts (#6422) * [EuiFlyout][EuiCollapsibleNav] Fix broken slide in animation for left flyouts * changelog
elastic · Nov 21, 2022 · abb925a · abb925a
1 parent f9d5bc6
commit abb925a
Show file tree

Hide file tree

Showing 2 changed files with 6 additions and 2 deletions.
diff --git a/src/components/flyout/flyout.styles.ts b/src/components/flyout/flyout.styles.ts
@@ -38,7 +38,7 @@ export const euiFlyoutSlideInLeft = keyframes`
   75% {
     opacity: 1;
     transform: translateX(0%);
-}
+  }
 `;
 
 export const euiFlyoutCloseButtonStyles = (euiThemeContext: UseEuiTheme) => {
@@ -144,7 +144,8 @@ export const euiFlyoutStyles = (euiThemeContext: UseEuiTheme) => {
       clip-path: polygon(0 0, 150% 0, 150% 100%, 0 100%);
 
       ${euiCanAnimate} {
-        animation: ${euiFlyoutSlideInLeft};
+        animation: ${euiFlyoutSlideInLeft} ${euiTheme.animation.normal}
+          ${euiTheme.animation.resistance};
       }
     `,
 

diff --git a/upcoming_changelogs/6422.md b/upcoming_changelogs/6422.md
@@ -0,0 +1,3 @@
+**Bug fixes**
+
+- Fixed missing slide-in animation on `EuiCollapsibleNav`s and left-side `EuiFlyout`s
Original file line number	Diff line number	Diff line change
		@@ -0,0 +1,3 @@
		Bug fixes

		- Fixed missing slide-in animation on `EuiCollapsibleNav`s and left-side `EuiFlyout`s