Pixel perfect styles - native and web

software-mansion-labs · Mar 4, 2024 · 80bafbc · 80bafbc
1 parent 1297a40
commit 80bafbc
Show file tree

Hide file tree

Showing 2 changed files with 3 additions and 9 deletions.
diff --git a/src/components/OnboardingWelcomeVideo.tsx b/src/components/OnboardingWelcomeVideo.tsx
@@ -132,12 +132,13 @@ function OnboardingWelcomeVideo() {
             isVisible={isModalVisible}
             type={shouldUseNarrowLayout ? CONST.MODAL.MODAL_TYPE.CENTERED_SMALL : CONST.MODAL.MODAL_TYPE.BOTTOM_DOCKED}
             onClose={closeModal}
+            innerContainerStyle={shouldUseNarrowLayout ? {} : {paddingTop: MODAL_PADDING, paddingBottom: MODAL_PADDING}}
         >
             <View
-                style={styles.WelcomeVideoNavigatorInnerView(shouldUseNarrowLayout)}
+                style={[shouldUseNarrowLayout ? {width: 500, height: 500} : {}, {maxHeight: '100%'}]}
                 onLayout={storeContainerDimensions}
             >
-                <View style={{padding: MODAL_PADDING}}>{getWelcomeVideo()}</View>
+                <View style={shouldUseNarrowLayout ? {padding: MODAL_PADDING} : {paddingHorizontal: MODAL_PADDING}}>{getWelcomeVideo()}</View>
                 <View style={[shouldUseNarrowLayout ? [styles.mt5, styles.mh8] : [styles.mt3, styles.mh5]]}>
                     <View style={[shouldUseNarrowLayout ? [styles.gap1, styles.mb8] : [styles.gap2, styles.mb10]]}>
                         <Text style={styles.textHeroSmall}>{translate('onboarding.welcomeVideo.title')}</Text>

diff --git a/src/styles/index.ts b/src/styles/index.ts
@@ -1536,13 +1536,6 @@ const styles = (theme: ThemeColors) =>
                 overflow: 'hidden',
             } satisfies ViewStyle),
 
-        WelcomeVideoNavigatorInnerView: (shouldUseNarrowLayout: boolean) =>
-            ({
-                width: shouldUseNarrowLayout ? 500 : '100%',
-                height: 500,
-                maxHeight: '100%',
-            } satisfies ViewStyle),
-
         onlyEmojisText: {
             fontSize: variables.fontSizeOnlyEmojis,
             lineHeight: variables.fontSizeOnlyEmojisHeight,