-- CODE language-jsx --
import React from 'react';
import Images from '../config/Images';
import {
Divider,
Icon,
ScreenContainer,
Touchable,
withTheme,
} from '@draftbit/ui';
import { Image, ScrollView, StyleSheet, Text, View } from 'react-native';
const REPLACE_SCREEN_NAME = props => {
const { theme } = props;
return (
<ScreenContainer scrollable={true} hasSafeArea={true}>
<ScrollView
contentContainerStyle={styles.scrollViewAg}
showsHorizontalScrollIndicator={false}
showsVerticalScrollIndicator={true}
bounces={true}
>
<View
pointerEvents=""auto""
accessible={true}
importantForAccessibility=""auto""
hitSlop={{}}
>
<View style={styles.viewUn}>
<Image
style={styles.imageY3}
resizeMode=""cover""
source={Images.ProfilePlaceholder}
/>
<Text
style={StyleSheet.flatten([
styles.textTw,
theme.typography.headline4,
{ color: theme.colors.strong },
])}
>
App Name
</Text>
<Text
style={StyleSheet.flatten([
styles.textMA,
theme.typography.subtitle1,
{ color: theme.colors.medium },
])}
>
App Description
</Text>
<Touchable style={styles.touchableMy}>
<View
style={styles.viewYr}
hitSlop={{}}
importantForAccessibility=""auto""
accessible={true}
pointerEvents=""auto""
>
<Icon
style={styles.iconP5}
name=""MaterialCommunityIcons/twitter""
size={20}
color={theme.colors.primary}
/>
<Text
style={StyleSheet.flatten([
theme.typography.subtitle2,
{ color: theme.colors.primary },
])}
textBreakStrategy=""highQuality""
allowFontScaling={true}
ellipsizeMode=""tail""
accessible={true}
>
@twitter
</Text>
</View>
</Touchable>
<Touchable style={styles.touchableL0}>
<View
style={styles.viewBb}
accessible={true}
importantForAccessibility=""auto""
hitSlop={{}}
pointerEvents=""auto""
>
<Icon
style={styles.iconNx}
name=""MaterialCommunityIcons/link-variant""
color={theme.colors.primary}
size={20}
/>
<Text
style={StyleSheet.flatten([
theme.typography.subtitle2,
{ color: theme.colors.primary },
])}
textBreakStrategy=""highQuality""
accessible={true}
allowFontScaling={true}
ellipsizeMode=""tail""
>
Website
</Text>
</View>
</Touchable>
</View>
<View
style={styles.viewHn}
accessible={true}
importantForAccessibility=""auto""
pointerEvents=""auto""
hitSlop={{}}
>
<Touchable>
<View
style={styles.viewVu}
pointerEvents=""auto""
importantForAccessibility=""auto""
hitSlop={{}}
accessible={true}
>
<View
style={styles.view1T}
accessible={true}
importantForAccessibility=""auto""
hitSlop={{}}
pointerEvents=""auto""
>
<View
style={styles.viewRr}
pointerEvents=""auto""
accessible={true}
hitSlop={{}}
importantForAccessibility=""auto""
>
<Icon
style={styles.iconHc}
size={34}
color={theme.colors.strong}
name=""MaterialCommunityIcons/alpha-t-box""
/>
</View>
<View
pointerEvents=""auto""
accessible={true}
importantForAccessibility=""auto""
hitSlop={{}}
>
<Text
style={StyleSheet.flatten([
theme.typography.headline6,
{ color: theme.colors.strong },
])}
allowFontScaling={true}
ellipsizeMode=""tail""
textBreakStrategy=""highQuality""
accessible={true}
>
Terms & Conditions
</Text>
</View>
</View>
<Icon
style={styles.iconQ7}
color={theme.colors.strong}
size={24}
name=""Ionicons/ios-arrow-forward""
/>
</View>
</Touchable>
<Divider
style={styles.dividerWH}
color={theme.colors.divider}
height={1}
/>
<Touchable>
<View
style={styles.viewMR}
hitSlop={{}}
importantForAccessibility=""auto""
accessible={true}
pointerEvents=""auto""
>
<View
style={styles.viewTo}
accessible={true}
hitSlop={{}}
pointerEvents=""auto""
importantForAccessibility=""auto""
>
<View
style={styles.viewBC}
accessible={true}
importantForAccessibility=""auto""
pointerEvents=""auto""
hitSlop={{}}
>
<Icon
style={styles.iconYd}
size={34}
color={theme.colors.strong}
name=""MaterialCommunityIcons/alpha-p-box""
/>
</View>
<View
importantForAccessibility=""auto""
pointerEvents=""auto""
hitSlop={{}}
accessible={true}
>
<Text
style={StyleSheet.flatten([
theme.typography.headline6,
{ color: theme.colors.strong },
])}
ellipsizeMode=""tail""
accessible={true}
textBreakStrategy=""highQuality""
allowFontScaling={true}
>
Privacy Policy
</Text>
</View>
</View>
<Icon
style={styles.icon0H}
color={theme.colors.strong}
name=""Ionicons/ios-arrow-forward""
size={24}
/>
</View>
</Touchable>
<Divider
style={styles.divider2I}
height={1}
color={theme.colors.divider}
/>
</View>
</View>
<View
style={styles.viewZD}
hitSlop={{}}
importantForAccessibility=""auto""
accessible={true}
pointerEvents=""auto""
>
<Text
style={StyleSheet.flatten([
theme.typography.caption,
{ color: theme.colors.medium },
])}
allowFontScaling={true}
ellipsizeMode=""tail""
textBreakStrategy=""highQuality""
accessible={true}
>
Version 1.01
</Text>
</View>
</ScrollView>
</ScreenContainer>
);
};
const styles = StyleSheet.create({
viewYr: {
flexDirection: 'row',
alignItems: 'center',
},
viewBb: {
alignItems: 'center',
flexDirection: 'row',
},
viewRr: {
width: 34,
height: 34,
marginRight: 14,
},
view1T: {
maxWidth: '80%',
width: '100%',
alignItems: 'center',
flexDirection: 'row',
},
viewVu: {
paddingTop: 12,
paddingBottom: 12,
marginBottom: 12,
flexDirection: 'row',
alignItems: 'center',
justifyContent: 'space-between',
width: '100%',
marginTop: 12,
},
viewBC: {
width: 34,
height: 34,
marginRight: 14,
},
viewTo: {
flexDirection: 'row',
maxWidth: '80%',
width: '100%',
alignItems: 'center',
},
viewMR: {
flexDirection: 'row',
alignItems: 'center',
justifyContent: 'space-between',
width: '100%',
marginTop: 12,
paddingTop: 12,
paddingBottom: 12,
marginBottom: 12,
},
scrollViewAg: {
justifyContent: 'space-between',
flexGrow: 1,
},
viewUn: {
paddingBottom: 14,
paddingTop: 64,
paddingLeft: 32,
paddingRight: 32,
alignItems: 'center',
},
imageY3: {
marginBottom: 24,
width: 120,
height: 120,
},
iconP5: {
width: 24,
alignSelf: 'flex-start',
height: 24,
marginRight: 8,
},
iconNx: {
marginRight: 8,
height: 24,
width: 24,
alignSelf: 'flex-start',
},
iconHc: {
width: 40,
height: 40,
},
iconYd: {
height: 40,
width: 40,
},
viewHn: {
paddingBottom: 14,
paddingTop: 14,
paddingRight: 32,
paddingLeft: 32,
},
viewZD: {
paddingTop: 14,
paddingBottom: 34,
paddingRight: 32,
paddingLeft: 32,
alignItems: 'center',
marginTop: 44,
},
textTw: {
textAlign: 'center',
marginBottom: 6,
},
iconQ7: {
width: 24,
height: 24,
},
dividerWH: {
height: 1,
},
icon0H: {
width: 24,
height: 24,
},
textMA: {
textAlign: 'left',
},
touchableMy: {
marginBottom: 6,
marginTop: 12,
flexWrap: 'wrap',
},
divider2I: {
height: 1,
},
touchableL0: {
flexWrap: 'wrap',
marginTop: 2,
marginBottom: 6,
},
});
export default withTheme(REPLACE_SCREEN_NAME);