summaryrefslogtreecommitdiff
path: root/frontend/app/screens/login/signUp.js
diff options
context:
space:
mode:
authorAndrew <saintruler@gmail.com>2019-03-11 21:00:02 +0400
committerAndrew <saintruler@gmail.com>2019-03-11 21:00:02 +0400
commit7e7dd5244e8d26485ad7950a89c04c98c4fef83f (patch)
tree810730c4650392080fb87a78d3b527201e89fe4b /frontend/app/screens/login/signUp.js
Initial commit/
Diffstat (limited to 'frontend/app/screens/login/signUp.js')
-rw-r--r--frontend/app/screens/login/signUp.js110
1 files changed, 110 insertions, 0 deletions
diff --git a/frontend/app/screens/login/signUp.js b/frontend/app/screens/login/signUp.js
new file mode 100644
index 0000000..5c7965e
--- /dev/null
+++ b/frontend/app/screens/login/signUp.js
@@ -0,0 +1,110 @@
+import React from 'react';
+import {
+ View,
+ Image,
+ Keyboard,
+} from 'react-native';
+import {
+ RkButton,
+ RkText,
+ RkTextInput,
+ RkStyleSheet,
+ RkTheme,
+ RkAvoidKeyboard,
+} from 'react-native-ui-kitten';
+import { GradientButton } from '../../components/';
+import { scaleVertical } from '../../utils/scale';
+import NavigationType from '../../config/navigation/propTypes';
+
+export class SignUp extends React.Component {
+ static navigationOptions = {
+ header: null,
+ };
+ static propTypes = {
+ navigation: NavigationType.isRequired,
+ };
+
+ getThemeImageSource = (theme) => (
+ theme.name === 'light' ?
+ require('../../assets/images/logo.png') : require('../../assets/images/logoDark.png')
+ );
+
+ renderImage = () => (
+ <Image style={styles.image} source={this.getThemeImageSource(RkTheme.current)} />
+ );
+
+ onSignUpButtonPressed = () => {
+ this.props.navigation.goBack();
+ };
+
+ onSignInButtonPressed = () => {
+ this.props.navigation.navigate('Login1');
+ };
+
+ render = () => (
+ <RkAvoidKeyboard
+ style={styles.screen}
+ onStartShouldSetResponder={() => true}
+ onResponderRelease={() => Keyboard.dismiss()}>
+ <View style={{ alignItems: 'center' }}>
+ {this.renderImage()}
+ <RkText rkType='h1'>Registration</RkText>
+ </View>
+ <View style={styles.content}>
+ <View>
+ <RkTextInput rkType='rounded' placeholder='Name' />
+ <RkTextInput rkType='rounded' placeholder='Email' />
+ <RkTextInput rkType='rounded' placeholder='Password' secureTextEntry />
+ <RkTextInput rkType='rounded' placeholder='Confirm Password' secureTextEntry />
+ <GradientButton
+ style={styles.save}
+ rkType='large'
+ text='SIGN UP'
+ onPress={this.onSignUpButtonPressed}
+ />
+ </View>
+ <View style={styles.footer}>
+ <View style={styles.textRow}>
+ <RkText rkType='primary3'>Already have an account?</RkText>
+ <RkButton rkType='clear' onPress={this.onSignInButtonPressed}>
+ <RkText rkType='header6'>Sign in now</RkText>
+ </RkButton>
+ </View>
+ </View>
+ </View>
+ </RkAvoidKeyboard>
+ )
+}
+
+const styles = RkStyleSheet.create(theme => ({
+ screen: {
+ padding: 16,
+ flex: 1,
+ justifyContent: 'space-around',
+ backgroundColor: theme.colors.screen.base,
+ },
+ image: {
+ marginBottom: 10,
+ height: scaleVertical(77),
+ resizeMode: 'contain',
+ },
+ content: {
+ justifyContent: 'space-between',
+ },
+ save: {
+ marginVertical: 20,
+ },
+ buttons: {
+ flexDirection: 'row',
+ marginBottom: 24,
+ marginHorizontal: 24,
+ justifyContent: 'space-around',
+ },
+ footer: {
+ justifyContent: 'flex-end',
+ },
+ textRow: {
+ flexDirection: 'row',
+ justifyContent: 'center',
+ },
+}));