aboutsummaryrefslogtreecommitdiff
path: root/src/screens/onboarding/WelcomeScreen.tsx
diff options
context:
space:
mode:
authorIvan Chen <ivan@tagg.id>2021-02-01 17:05:18 -0500
committerIvan Chen <ivan@tagg.id>2021-02-02 18:44:04 -0500
commitbd9ed0712bae14729d18f4d34b891bb82d4550ff (patch)
tree74acece7caadcc30a130e279c058cf7ee4baa63e /src/screens/onboarding/WelcomeScreen.tsx
parent00adcf1eddd51d954992dfd5a494ee5310d42d5b (diff)
initial work
Diffstat (limited to 'src/screens/onboarding/WelcomeScreen.tsx')
-rw-r--r--src/screens/onboarding/WelcomeScreen.tsx49
1 files changed, 19 insertions, 30 deletions
diff --git a/src/screens/onboarding/WelcomeScreen.tsx b/src/screens/onboarding/WelcomeScreen.tsx
index 7e18cb99..541ca512 100644
--- a/src/screens/onboarding/WelcomeScreen.tsx
+++ b/src/screens/onboarding/WelcomeScreen.tsx
@@ -1,10 +1,10 @@
+import {StackNavigationProp} from '@react-navigation/stack';
import * as React from 'react';
-import {StyleSheet, View, Text, Image, TouchableOpacity} from 'react-native';
-import {normalize, SCREEN_WIDTH} from '../../utils';
-import {Background} from '../../components';
+import {Image, StyleSheet, Text, View} from 'react-native';
+import {Background, TaggSquareButton} from '../../components';
import {OnboardingStackParams} from '../../routes';
-import {StackNavigationProp} from '@react-navigation/stack';
import {BackgroundGradientType} from '../../types';
+import {SCREEN_WIDTH} from '../../utils';
type WelcomeScreenNavigationProps = StackNavigationProp<
OnboardingStackParams,
@@ -29,16 +29,20 @@ const WelcomeScreen: React.FC<WelcomeScreenProps> = ({navigation}) => {
/>
<View>
- <Text style={styles.header}>Welcome to Tagg!</Text>
+ <Text style={styles.header}>Welcome to TAGG!</Text>
<Text style={styles.subtext}>
Tagg is the new social networking platform for you! It will help you
create your own personalized digital space where you can express who
you are, along with all the moments that comprehensively define you!
</Text>
</View>
- <TouchableOpacity onPress={handleNext} style={styles.nextButton}>
- <Text style={styles.nextButtonLabel}>Next</Text>
- </TouchableOpacity>
+ <TaggSquareButton
+ onPress={handleNext}
+ title={'Next'}
+ mode={'normal'}
+ color={'purple'}
+ style={styles.nextButton}
+ />
</Background>
);
};
@@ -53,44 +57,29 @@ const styles = StyleSheet.create({
flexDirection: 'column',
justifyContent: 'center',
alignItems: 'center',
- marginTop: '10%',
},
image: {
- width: SCREEN_WIDTH * 0.9,
- height: SCREEN_WIDTH * 0.9,
+ width: SCREEN_WIDTH,
+ height: SCREEN_WIDTH,
},
header: {
color: '#fff',
- fontSize: normalize(28),
- fontWeight: '700',
+ fontSize: 32,
+ fontWeight: '600',
textAlign: 'center',
marginBottom: '4%',
marginHorizontal: '10%',
},
subtext: {
color: '#fff',
- fontSize: normalize(17),
- fontWeight: '500',
+ fontSize: 16,
+ fontWeight: '600',
textAlign: 'center',
- marginBottom: '10%',
+ marginBottom: '15%',
marginHorizontal: '10%',
- lineHeight: normalize(25),
},
nextButton: {
- backgroundColor: '#8F01FF',
- justifyContent: 'center',
- alignItems: 'center',
- width: '70%',
- height: '10%',
- borderRadius: 5,
- borderWidth: 1,
- borderColor: '#8F01FF',
marginBottom: '15%',
},
- nextButtonLabel: {
- fontSize: normalize(20),
- fontWeight: '700',
- color: '#ddd',
- },
});
export default WelcomeScreen;