diff --git a/packages/eui-theme-borealis/src/eui_theme_borealis_dark.json b/packages/eui-theme-borealis/src/eui_theme_borealis_dark.json index ed01cd7edb3..97af9da8fc1 100644 --- a/packages/eui-theme-borealis/src/eui_theme_borealis_dark.json +++ b/packages/eui-theme-borealis/src/eui_theme_borealis_dark.json @@ -15,7 +15,7 @@ "euiContrastRatioGraphic": 3, "euiContrastRatioDisabled": 2, "euiAnimSlightBounce": "cubic-bezier(0.34, 1.61, 0.7, 1)", - "euiAnimSlightResistance": "cubic-bezier(0.694, 0.0482, 0.335, 1)", + "euiAnimSlightResistance": "cubic-bezier(.32, .72, 0, 1)", "euiAnimSpeedExtraFast": "90ms", "euiAnimSpeedFast": "150ms", "euiAnimSpeedNormal": "250ms", diff --git a/packages/eui-theme-borealis/src/eui_theme_borealis_light.json b/packages/eui-theme-borealis/src/eui_theme_borealis_light.json index 941b63776a6..4fd156c96fd 100644 --- a/packages/eui-theme-borealis/src/eui_theme_borealis_light.json +++ b/packages/eui-theme-borealis/src/eui_theme_borealis_light.json @@ -15,7 +15,7 @@ "euiContrastRatioGraphic": 3, "euiContrastRatioDisabled": 2, "euiAnimSlightBounce": "cubic-bezier(0.34, 1.61, 0.7, 1)", - "euiAnimSlightResistance": "cubic-bezier(0.694, 0.0482, 0.335, 1)", + "euiAnimSlightResistance": "cubic-bezier(.32, .72, 0, 1)", "euiAnimSpeedExtraFast": "90ms", "euiAnimSpeedFast": "150ms", "euiAnimSpeedNormal": "250ms", diff --git a/packages/eui-theme-borealis/src/variables/_animation.ts b/packages/eui-theme-borealis/src/variables/_animation.ts index 84933441db3..5a92ebe4f15 100644 --- a/packages/eui-theme-borealis/src/variables/_animation.ts +++ b/packages/eui-theme-borealis/src/variables/_animation.ts @@ -22,7 +22,7 @@ export const animation_speed: _EuiThemeAnimationSpeeds = { export const animation_ease: _EuiThemeAnimationEasings = { bounce: 'cubic-bezier(.34, 1.61, .7, 1)', - resistance: 'cubic-bezier(.694, .0482, .335, 1)', + resistance: 'cubic-bezier(.32, .72, 0, 1)', }; export const animation: _EuiThemeAnimation = { diff --git a/packages/eui-theme-common/src/global_styling/variables/_animations.scss b/packages/eui-theme-common/src/global_styling/variables/_animations.scss index 93b9daf1641..85b5d0c155a 100644 --- a/packages/eui-theme-common/src/global_styling/variables/_animations.scss +++ b/packages/eui-theme-common/src/global_styling/variables/_animations.scss @@ -1,7 +1,7 @@ // Animations $euiAnimSlightBounce: cubic-bezier(.34, 1.61, .7, 1) !default; -$euiAnimSlightResistance: cubic-bezier(.694, .0482, .335, 1) !default; +$euiAnimSlightResistance: cubic-bezier(.32, .72, 0, 1) !default; $euiAnimSpeedExtraFast: 90ms !default; $euiAnimSpeedFast: 150ms !default; diff --git a/packages/eui/changelogs/upcoming/8919.md b/packages/eui/changelogs/upcoming/8919.md new file mode 100644 index 00000000000..0dc3a68ed3e --- /dev/null +++ b/packages/eui/changelogs/upcoming/8919.md @@ -0,0 +1 @@ +- Updated `EuiFlyout` keyframe stop and animation resistance token \ No newline at end of file diff --git a/packages/eui/src/components/flyout/flyout.styles.ts b/packages/eui/src/components/flyout/flyout.styles.ts index 962e9ad10b3..561ddffeac9 100644 --- a/packages/eui/src/components/flyout/flyout.styles.ts +++ b/packages/eui/src/components/flyout/flyout.styles.ts @@ -27,7 +27,7 @@ export const euiFlyoutSlideInRight = keyframes` opacity: 0; transform: translateX(100%); } - 75% { + 85% { opacity: 1; transform: translateX(0%); } @@ -38,7 +38,7 @@ export const euiFlyoutSlideInLeft = keyframes` opacity: 0; transform: translateX(-100%); } - 75% { + 85% { opacity: 1; transform: translateX(0%); } diff --git a/packages/eui/src/themes/json/eui_theme_borealis_dark.json b/packages/eui/src/themes/json/eui_theme_borealis_dark.json index ed01cd7edb3..97af9da8fc1 100644 --- a/packages/eui/src/themes/json/eui_theme_borealis_dark.json +++ b/packages/eui/src/themes/json/eui_theme_borealis_dark.json @@ -15,7 +15,7 @@ "euiContrastRatioGraphic": 3, "euiContrastRatioDisabled": 2, "euiAnimSlightBounce": "cubic-bezier(0.34, 1.61, 0.7, 1)", - "euiAnimSlightResistance": "cubic-bezier(0.694, 0.0482, 0.335, 1)", + "euiAnimSlightResistance": "cubic-bezier(.32, .72, 0, 1)", "euiAnimSpeedExtraFast": "90ms", "euiAnimSpeedFast": "150ms", "euiAnimSpeedNormal": "250ms", diff --git a/packages/eui/src/themes/json/eui_theme_borealis_light.json b/packages/eui/src/themes/json/eui_theme_borealis_light.json index 941b63776a6..4fd156c96fd 100644 --- a/packages/eui/src/themes/json/eui_theme_borealis_light.json +++ b/packages/eui/src/themes/json/eui_theme_borealis_light.json @@ -15,7 +15,7 @@ "euiContrastRatioGraphic": 3, "euiContrastRatioDisabled": 2, "euiAnimSlightBounce": "cubic-bezier(0.34, 1.61, 0.7, 1)", - "euiAnimSlightResistance": "cubic-bezier(0.694, 0.0482, 0.335, 1)", + "euiAnimSlightResistance": "cubic-bezier(.32, .72, 0, 1)", "euiAnimSpeedExtraFast": "90ms", "euiAnimSpeedFast": "150ms", "euiAnimSpeedNormal": "250ms",