From 04a16952c4ae579d84bb0e2e687ba52c66b3e464 Mon Sep 17 00:00:00 2001 From: Constance Chen Date: Tue, 19 Jul 2022 13:34:57 -0700 Subject: [PATCH] [Misc] Fix incorrect viewport unit being used for max-width --- src/components/image/image.styles.ts | 2 +- src/components/image/image_fullscreen_wrapper.styles.ts | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/src/components/image/image.styles.ts b/src/components/image/image.styles.ts index 20dd08bee12..8bff84141b8 100644 --- a/src/components/image/image.styles.ts +++ b/src/components/image/image.styles.ts @@ -26,7 +26,7 @@ export const euiImageStyles = (euiThemeContext: UseEuiTheme) => ({ isFullScreen: css` position: relative; ${logicalCSS('max-height', '80vh')}; - ${logicalCSS('max-width', '80vh')}; + ${logicalCSS('max-width', '80vw')}; `, hasShadow: css` ${euiShadow(euiThemeContext, 's')}; diff --git a/src/components/image/image_fullscreen_wrapper.styles.ts b/src/components/image/image_fullscreen_wrapper.styles.ts index 69fc9e6033e..9230791dbd1 100644 --- a/src/components/image/image_fullscreen_wrapper.styles.ts +++ b/src/components/image/image_fullscreen_wrapper.styles.ts @@ -23,7 +23,7 @@ export const euiImageFullscreenWrapperStyles = ( // Base euiImageFullscreenWrapper: css` ${logicalCSS('max-height', '80vh')}; - ${logicalCSS('max-width', '80vh')}; + ${logicalCSS('max-width', '80vw')}; ${logicalTextAlignCSS('center')}; // Aligns both caption and image line-height: 0; // Fixes cropping when image is resized by forcing its height to be determined by the image not line-height