Skip to content

Commit 5d2f899

Browse files
committed
Fix Onboarding slides are overlapped by the notch on landscape
1 parent 7a0ee35 commit 5d2f899

1 file changed

Lines changed: 11 additions & 1 deletion

File tree

src/libs/Navigation/AppNavigator/Navigators/OnboardingModalNavigator.tsx

Lines changed: 11 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -8,6 +8,8 @@ import FocusTrapForScreens from '@components/FocusTrap/FocusTrapForScreen';
88
import useKeyboardShortcut from '@hooks/useKeyboardShortcut';
99
import useOnyx from '@hooks/useOnyx';
1010
import useResponsiveLayout from '@hooks/useResponsiveLayout';
11+
import useSafeAreaInsets from '@hooks/useSafeAreaInsets';
12+
import useStyleUtils from '@hooks/useStyleUtils';
1113
import useThemeStyles from '@hooks/useThemeStyles';
1214
import {isMobileSafari} from '@libs/Browser';
1315
import GoogleTagManager from '@libs/GoogleTagManager';
@@ -42,6 +44,9 @@ let signUpEventPublishedForAccountID: number | undefined;
4244

4345
function OnboardingModalNavigator() {
4446
const styles = useThemeStyles();
47+
const StyleUtils = useStyleUtils();
48+
const insets = useSafeAreaInsets();
49+
const safeAreaPadding = StyleUtils.getPlatformSafeAreaPadding(insets);
4550
const {onboardingIsMediumOrLargerScreenWidth} = useResponsiveLayout();
4651
const outerViewRef = React.useRef<View>(null);
4752
const [account, accountMetadata] = useOnyx(ONYXKEYS.ACCOUNT);
@@ -118,7 +123,12 @@ function OnboardingModalNavigator() {
118123
<FocusTrapForScreens>
119124
<View
120125
onClick={(e) => e.stopPropagation()}
121-
style={[styles.maxHeight100Percentage, styles.overflowHidden, styles.OnboardingNavigatorInnerView(onboardingIsMediumOrLargerScreenWidth)]}
126+
style={[
127+
styles.maxHeight100Percentage,
128+
styles.overflowHidden,
129+
styles.OnboardingNavigatorInnerView(onboardingIsMediumOrLargerScreenWidth),
130+
{paddingLeft: safeAreaPadding.paddingLeft, paddingRight: safeAreaPadding.paddingRight},
131+
]}
122132
>
123133
<Stack.Navigator
124134
screenOptions={defaultScreenOptions}

0 commit comments

Comments
 (0)