diff --git a/src/components/Modal/BaseModal.tsx b/src/components/Modal/BaseModal.tsx index ab670e241267c..e14bcbdc13dfe 100644 --- a/src/components/Modal/BaseModal.tsx +++ b/src/components/Modal/BaseModal.tsx @@ -306,7 +306,7 @@ function BaseModal( shouldPreventScroll={shouldPreventScrollOnFocus} > {children} diff --git a/src/components/Search/SearchRouter/SearchRouterModal.tsx b/src/components/Search/SearchRouter/SearchRouterModal.tsx index 29b0da9155bb0..5fd452afd685f 100644 --- a/src/components/Search/SearchRouter/SearchRouterModal.tsx +++ b/src/components/Search/SearchRouter/SearchRouterModal.tsx @@ -3,7 +3,6 @@ import FocusTrapForModal from '@components/FocusTrap/FocusTrapForModal'; import KeyboardAvoidingView from '@components/KeyboardAvoidingView'; import Modal from '@components/Modal'; import useResponsiveLayout from '@hooks/useResponsiveLayout'; -import useSafeAreaInsets from '@hooks/useSafeAreaInsets'; import useThemeStyles from '@hooks/useThemeStyles'; import useViewportOffsetTop from '@hooks/useViewportOffsetTop'; import useWindowDimensions from '@hooks/useWindowDimensions'; @@ -20,7 +19,6 @@ function SearchRouterModal() { const {windowHeight} = useWindowDimensions(); const {isSearchRouterDisplayed, closeSearchRouter} = useSearchRouterContext(); const viewportOffsetTop = useViewportOffsetTop(); - const safeAreaInsets = useSafeAreaInsets(); // On mWeb Safari, the input caret stuck for a moment while the modal is animating. So, we hide the caret until the animation is done. const [shouldHideInputCaret, setShouldHideInputCaret] = useState(isMobileWebSafari); @@ -31,7 +29,7 @@ function SearchRouterModal() { = ({the borderTopLeftRadius: variables.componentBorderRadiusLarge, borderTopRightRadius: variables.componentBorderRadiusLarge, paddingTop: variables.componentBorderRadiusLarge, + paddingBottom: variables.componentBorderRadiusLarge, justifyContent: 'center', overflow: 'hidden', boxShadow: theme.shadow, diff --git a/src/styles/utils/index.ts b/src/styles/utils/index.ts index 99dc406ac9021..68f2c8991bad8 100644 --- a/src/styles/utils/index.ts +++ b/src/styles/utils/index.ts @@ -610,7 +610,7 @@ function getModalPaddingStyles({ marginTop: getCombinedSpacing(modalContainerStyle.marginTop, safeAreaPaddingTop, shouldAddTopSafeAreaMargin), marginBottom: getCombinedSpacing(modalContainerStyle.marginBottom, safeAreaPaddingBottomWithFallback, shouldAddBottomSafeAreaMargin), paddingTop: getCombinedSpacing(modalContainerStyle.paddingTop, safeAreaPaddingTop, shouldAddTopSafeAreaPadding), - paddingBottom: getCombinedSpacing(modalContainerStyle.paddingBottom, safeAreaPaddingBottomWithFallback, shouldAddBottomSafeAreaPadding), + paddingBottom: getCombinedSpacing(modalContainerStyle.paddingBottom, safeAreaPaddingBottom, shouldAddBottomSafeAreaPadding), paddingLeft: safeAreaPaddingLeft ?? 0, paddingRight: safeAreaPaddingRight ?? 0, };