aboutsummaryrefslogtreecommitdiff
diff options
context:
space:
mode:
authorJustin Shillingford <jgs272@cornell.edu>2020-06-26 11:03:09 -0400
committerJustin Shillingford <jgs272@cornell.edu>2020-06-29 14:25:38 -0400
commit6e0d91e5b7d70a5c9e75488f51e096aba61e2ec2 (patch)
tree12d278a591c280b38c4a2e7f57e85baf845ebe62
parent852efbaf2a31250456e1fa87f0abd7192d213d37 (diff)
Added new user text and button
Also updated logo to be high-res and styled start button
-rw-r--r--App.tsx138
-rw-r--r--src/assets/sign_in_logo.pngbin0 -> 28865 bytes
2 files changed, 138 insertions, 0 deletions
diff --git a/App.tsx b/App.tsx
new file mode 100644
index 00000000..2b9e8172
--- /dev/null
+++ b/App.tsx
@@ -0,0 +1,138 @@
+/**
+ * Sample React Native App
+ * https://github.com/facebook/react-native
+ *
+ * Generated with the TypeScript template
+ * https://github.com/react-native-community/react-native-template-typescript
+ *
+ * @format
+ */
+
+import React from 'react';
+import {
+ SafeAreaView,
+ StyleSheet,
+ ScrollView,
+ View,
+ Text,
+ StatusBar,
+ Image,
+ TextInput,
+ Button,
+ Alert,
+ TouchableOpacity,
+} from 'react-native';
+
+import {
+ Header,
+ LearnMoreLinks,
+ Colors,
+ DebugInstructions,
+ ReloadInstructions,
+} from 'react-native/Libraries/NewAppScreen';
+
+import LinearGradient from 'react-native-linear-gradient';
+
+declare const global: {HermesInternal: null | {}};
+
+const App = () => {
+ return (
+ <>
+ <View style={styles.container}>
+ <LinearGradient colors={['#8F00FF', '#6EE7E7']} style={styles.linearGradient} useAngle={true} angle={154.72} angleCenter={{x:0.5,y:0.5}}>
+ <Image
+ source={require('./src/assets/sign_in_logo.png')}
+ style={styles.logo}
+ />
+ <TextInput
+ style={styles.credentials}
+ placeholder="Username"
+ placeholderTextColor='#FFFFFF'
+ />
+ <TextInput
+ style={styles.credentials}
+ placeholder="Password"
+ placeholderTextColor='#FFFFFF'
+ />
+ <View style={styles.forgotPassword}>
+ <Button
+ onPress={() => Alert.alert("tagg! You're it!")}
+ title="Forgot password"
+ color='#FFFFFF'
+ accessibilityLabel="Forgot password button"
+ />
+ </View>
+ {/* <View style={styles.start}> */}
+ <TouchableOpacity style={styles.start}>
+ <Text style={styles.startText}>Let's Start!</Text>
+ </TouchableOpacity>
+ {/* <Button
+ onPress={() => Alert.alert("My favorite Girl Scout Cookies are taggalongs!")}
+ title="Let's Start!"
+ color='#FFFFFF'
+ accessibilityLabel="Let's start button"
+ /> */}
+ {/* </View> */}
+ <Text style={styles.newUser}>
+ New to tagg? <Text style={styles.getStarted} onPress={() => Alert.alert("I get the tagg flip it and tumble it.")}>Get started!</Text>
+ </Text>
+ </LinearGradient>
+ </View>
+ </>
+ );
+};
+
+const styles = StyleSheet.create({
+ container: {
+ flex: 1,
+ backgroundColor: 'transparent'
+ },
+ linearGradient: {
+ flex: 1,
+ alignItems: 'center',
+ },
+ logo: {
+ top: 165,
+ width: 215,
+ height: 149
+ },
+ credentials: {
+ top: 215,
+ borderColor: '#FFFDFD',
+ borderWidth: 2,
+ borderRadius: 20,
+ width: 248,
+ height: 40,
+ paddingLeft: 13,
+ marginVertical: 15,
+ fontSize: 15,
+ color: '#FFFFFF'
+ },
+ forgotPassword: {
+ top: 200,
+ left: -50
+ },
+ start: {
+ top: 220,
+ backgroundColor: '#FFFFFF',
+ width: 144,
+ height: 36,
+ justifyContent: 'center',
+ alignItems: 'center',
+ borderRadius: 20
+ },
+ startText: {
+ color: '#78A0EF',
+ fontWeight: 'bold',
+ fontSize: 15
+ },
+ getStarted: {
+ color: '#FFFFFF'
+ },
+ newUser: {
+ top: 230,
+ color: '#F4DDFF',
+ }
+});
+
+export default App;
diff --git a/src/assets/sign_in_logo.png b/src/assets/sign_in_logo.png
new file mode 100644
index 00000000..27e43268
--- /dev/null
+++ b/src/assets/sign_in_logo.png
Binary files differ