summaryrefslogtreecommitdiff
path: root/app/screens/welcome/welcome-screen.tsx
diff options
context:
space:
mode:
Diffstat (limited to 'app/screens/welcome/welcome-screen.tsx')
-rw-r--r--app/screens/welcome/welcome-screen.tsx140
1 files changed, 0 insertions, 140 deletions
diff --git a/app/screens/welcome/welcome-screen.tsx b/app/screens/welcome/welcome-screen.tsx
deleted file mode 100644
index 7ba3a59..0000000
--- a/app/screens/welcome/welcome-screen.tsx
+++ /dev/null
@@ -1,140 +0,0 @@
-import React from 'react'
-import {
- View,
- ViewStyle,
- TextStyle,
- ImageStyle,
- SafeAreaView,
-} from 'react-native'
-import { useNavigation } from '@react-navigation/native'
-import { observer } from 'mobx-react-lite'
-import {
- Button,
- Header,
- Screen,
- Text,
- Wallpaper,
- AutoImage as Image,
-} from '../../components'
-import { color, spacing, typography } from '../../theme'
-const bowserLogo = require('./bowser.png')
-
-const FULL: ViewStyle = { flex: 1 }
-const CONTAINER: ViewStyle = {
- backgroundColor: color.transparent,
- paddingHorizontal: spacing[4],
-}
-const TEXT: TextStyle = {
- color: color.palette.white,
- fontFamily: typography.primary,
-}
-const BOLD: TextStyle = { fontWeight: 'bold' }
-const HEADER: TextStyle = {
- paddingTop: spacing[3],
- paddingBottom: spacing[4] + spacing[1],
- paddingHorizontal: 0,
-}
-const HEADER_TITLE: TextStyle = {
- ...TEXT,
- ...BOLD,
- fontSize: 12,
- lineHeight: 15,
- textAlign: 'center',
- letterSpacing: 1.5,
-}
-const TITLE_WRAPPER: TextStyle = {
- ...TEXT,
- textAlign: 'center',
-}
-const TITLE: TextStyle = {
- ...TEXT,
- ...BOLD,
- fontSize: 28,
- lineHeight: 38,
- textAlign: 'center',
-}
-const ALMOST: TextStyle = {
- ...TEXT,
- ...BOLD,
- fontSize: 26,
- fontStyle: 'italic',
-}
-const BOWSER: ImageStyle = {
- alignSelf: 'center',
- marginVertical: spacing[5],
- maxWidth: '100%',
- width: 343,
- height: 230,
-}
-const CONTENT: TextStyle = {
- ...TEXT,
- color: '#BAB6C8',
- fontSize: 15,
- lineHeight: 22,
- marginBottom: spacing[5],
-}
-const CONTINUE: ViewStyle = {
- paddingVertical: spacing[4],
- paddingHorizontal: spacing[4],
- backgroundColor: color.palette.deepPurple,
-}
-const CONTINUE_TEXT: TextStyle = {
- ...TEXT,
- ...BOLD,
- fontSize: 13,
- letterSpacing: 2,
-}
-const FOOTER: ViewStyle = { backgroundColor: '#20162D' }
-const FOOTER_CONTENT: ViewStyle = {
- paddingVertical: spacing[4],
- paddingHorizontal: spacing[4],
-}
-
-export const WelcomeScreen = observer(function WelcomeScreen() {
- const navigation = useNavigation()
- const nextScreen = () => navigation.navigate('demo')
-
- return (
- <View testID="WelcomeScreen" style={FULL}>
- <Wallpaper />
- <Screen
- style={CONTAINER}
- preset="scroll"
- backgroundColor={color.transparent}
- >
- <Header
- headerTx="welcomeScreen.poweredBy"
- style={HEADER}
- titleStyle={HEADER_TITLE}
- />
- <Text style={TITLE_WRAPPER}>
- <Text style={TITLE} text="Your new app, " />
- <Text style={ALMOST} text="almost" />
- <Text style={TITLE} text="!" />
- </Text>
- <Text style={TITLE} preset="header" tx="welcomeScreen.readyForLaunch" />
- <Image source={bowserLogo} style={BOWSER} />
- <Text style={CONTENT}>
- This probably isn't what your app is going to look like. Unless your
- designer handed you this screen and, in that case, congrats! You're
- ready to ship.
- </Text>
- <Text style={CONTENT}>
- For everyone else, this is where you'll see a live preview of your
- fully functioning app using Ignite.
- </Text>
- </Screen>
- <SafeAreaView style={FOOTER}>
- <View style={FOOTER_CONTENT}>
- <Button
- testID="next-screen-button"
- style={CONTINUE}
- textStyle={CONTINUE_TEXT}
- tx="welcomeScreen.continue"
- onPress={nextScreen}
- />
- </View>
- </SafeAreaView>
- </View>
- )
-})