Added styling and security to keyboards

1 files changed, 16 insertions, 2 deletions

diff --git a/App.tsx b/App.tsx
index 2ed7d496..037a1390 100644
--- a/App.tsx
+++ b/App.tsx
@@ -8,7 +8,7 @@
  * @format
  */
 
-import React from 'react';
+import React, { useRef } from 'react';
 import {
   SafeAreaView,
   StyleSheet,
@@ -36,6 +36,9 @@ import LinearGradient from 'react-native-linear-gradient';
 declare const global: {HermesInternal: null | {}};
 
 const App = () => {
+
+  const passwordInput = useRef();
+
   return (
     <>
       <View style={styles.container}>
@@ -48,11 +51,22 @@ const App = () => {
             style={styles.credentials}
             placeholder="Username"
             placeholderTextColor='#FFFFFF'
+            returnKeyType='next'
+            onSubmitEditing={() => {passwordInput.current.focus()}}
+            blurOnSubmit={false}
+            autoCompleteType='username'
+            textContentType='username'
+            keyboardType='ascii-capable'
           />
           <TextInput
+            ref={passwordInput}
             style={styles.credentials}
             placeholder="Password"
             placeholderTextColor='#FFFFFF'
+            secureTextEntry={true}
+            autoCompleteType='password'
+            textContentType='password'
+            returnKeyType='go'
           />
           <View style={styles.forgotPassword}>
             <Button
@@ -119,7 +133,7 @@ const styles = StyleSheet.create({
     fontSize: 15
   },
   getStarted: {
-    color: '#FFFFFF'
+    color: '#FFFFFF',
   },
   newUser: {
     top: 230,