button changes

emma-frontend/components/patientscreens/consent.js

@@ -97,7 +97,7 @@ export default function PatientConsentForm({ navigation, route }) {
       <Button title="Cancel" onPress={handleCancel} /> */}
 
       <View style={{ marginTop: 10 }}>
-        <Button title="Agree" onPress={handleAgree} />
+        <Button title="Agree" onPress={handleAgree} color="#703BE7" />
       </View>
       <View style={{ marginTop: 10, marginBottom: 10 }}>
         <Button title="Cancel" onPress={handleCancel} color="red" />

emma-frontend/components/patientscreens/registration/regEight.js

@@ -168,6 +168,7 @@ export default function PatientRegEight({ navigation, route }) {
   return (
     <View style={styles.container}>
       <Text>Highest Education Level:</Text>
+      <View style={styles.separator} />
       <RadioForm animation={true}>
         {educationLevelOptions.map((option, index) => (
           <RadioButton
@@ -180,9 +181,9 @@ export default function PatientRegEight({ navigation, route }) {
               index={index}
               isSelected={educationLevel === option.value}
               onPress={() => setEducationLevel(option.value)}
-              buttonInnerColor={"#2196f3"}
+              buttonInnerColor={"#703BE7"}
               buttonOuterColor={
-                educationLevel === option.value ? "#2196f3" : "#000"
+                educationLevel === option.value ? "#703BE7" : "#703BE7"
               }
               buttonSize={15}
               buttonOuterSize={25}
@@ -199,8 +200,9 @@ export default function PatientRegEight({ navigation, route }) {
           </RadioButton>
         ))}
       </RadioForm>
-
+      <View style={styles.separator} />
       <Text>Employed:</Text>
+      <View style={styles.separator} />
       <RadioForm animation={true}>
         {employedOptions.map((option, index) => (
           <RadioButton
@@ -213,9 +215,9 @@ export default function PatientRegEight({ navigation, route }) {
               index={index}
               isSelected={employedStatus === option.value}
               onPress={() => setEmployedStatus(option.value)}
-              buttonInnerColor={"#2196f3"}
+              buttonInnerColor={"#703BE7"}
               buttonOuterColor={
-                employedStatus === option.value ? "#2196f3" : "#000"
+                employedStatus === option.value ? "#703BE7" : "#703BE7"
               }
               buttonSize={15}
               buttonOuterSize={25}
@@ -232,8 +234,9 @@ export default function PatientRegEight({ navigation, route }) {
           </RadioButton>
         ))}
       </RadioForm>
-
-      <Button title="All Done" onPress={handleSave} />
+      <View style={styles.buttonContainer}>
+      <Button title="All Done" onPress={handleSave} color="#703BE7"/>
+      </View>
     </View>
   );
 }
@@ -243,4 +246,11 @@ const styles = StyleSheet.create({
     alignItems: "center",
     justifyContent: "center",
   },
+  buttonContainer: {
+    width: "80%",
+    marginTop: 10,
+  },
+  separator: {
+    height: 20,
+  },
 });

emma-frontend/components/patientscreens/registration/regFive.js

@@ -54,7 +54,8 @@ export default function PatientRegFive({ navigation, route }) {
         onPress={handleRelationshipStatusChange}
         formHorizontal={false}
         labelHorizontal={true}
-        buttonColor={"#2196f3"}
+        buttonColor={"#703BE7"}
+        selectedButtonColor={"#703BE7"}
       />
 
       <Text style={styles.label}>Number of Children:</Text>
@@ -64,8 +65,8 @@ export default function PatientRegFive({ navigation, route }) {
         onChangeText={handleNumberOfChildrenChange}
         keyboardType="numeric"
       />
-
-      <Button title="Next" onPress={handleNext} />
+      <View style={styles.buttonContainer}></View>
+      <Button title="Next" onPress={handleNext} color="#703BE7"/>
     </View>
   );
 }

emma-frontend/components/patientscreens/registration/regFour.js

@@ -50,12 +50,14 @@ export default function PatientRegFour({ navigation, route }) {
         onPress={handleParentStatusChange}
         formHorizontal={false}
         labelHorizontal={true}
-        buttonColor={"#2196f3"}
-        selectedButtonColor={"#2196f3"}
+        buttonColor={"#703BE7"}
+        selectedButtonColor={"#703BE7"}
         labelStyle={{ fontSize: 16, marginHorizontal: 10 }}
         style={{ marginVertical: 10 }}
       />
-      <Button title="Next" onPress={handleNext} />
+      <View style={styles.buttonContainer}>
+      <Button title="Next" onPress={handleNext} color="#703BE7"/>
+      </View>
     </View>
   );
 }
@@ -65,4 +67,8 @@ const styles = StyleSheet.create({
     alignItems: "center",
     justifyContent: "center",
   },
+  buttonContainer: {
+    width: "80%",
+    marginTop: 10,
+  },
 });

emma-frontend/components/patientscreens/registration/regFourOptional.js

@@ -28,7 +28,9 @@ export default function PatientRegFourOptional({ navigation, route }) {
         value={siblingCount.toString()}
         keyboardType="numeric"
       />
-      <Button title="Next" onPress={handleNext} />
+      <View style={styles.buttonContainer}>
+      <Button title="Next" onPress={handleNext} color="#703BE7"/>
+      </View>
     </View>
   );
 }
@@ -39,7 +41,7 @@ const styles = StyleSheet.create({
     justifyContent: "center",
   },
   inputContainer: {
-    marginTop: 20,
+    marginTop: 30,
   },
   input: {
     height: 40,
@@ -47,5 +49,10 @@ const styles = StyleSheet.create({
     borderColor: "gray",
     borderWidth: 1,
     paddingHorizontal: 10,
+    marginTop: 20,
+  },
+  buttonContainer: {
+    width: "80%",
+    marginTop: 20,
   },
 });

emma-frontend/components/patientscreens/registration/regSeven.js

@@ -53,8 +53,9 @@ export default function PatientRegSeven({ navigation, route }) {
         onChangeText={setNationality}
         maxLength={64}
       />
-
-      <Button title="Next" onPress={handleNext} />
+      <View style={styles.buttonContainer}>
+        <Button title="Next" onPress={handleNext} color="#703BE7" />
+      </View>
     </View>
   );
 }
@@ -69,5 +70,10 @@ const styles = StyleSheet.create({
     borderWidth: 1,
     borderColor: "gray",
     marginBottom: 10,
+    marginTop: 10,
+  },
+  buttonContainer: {
+    width: "80%",
+    marginTop: 10,
   },
 });

emma-frontend/components/patientscreens/registration/regSix.js

@@ -49,9 +49,12 @@ export default function PatientRegSix({ navigation, route }) {
         onPress={handleOptionSelect}
         formHorizontal={false}
         labelHorizontal={true}
-        buttonColor={"#2196f3"}
+        buttonColor={"#703BE7"}
+        selectedButtonColor={"#703BE7"}
       />
-      <Button title="Next" onPress={handleNext} />
+      <View style={styles.buttonContainer}>
+      <Button title="Next" onPress={handleNext} color="#703BE7"/>
+      </View>
     </View>
   );
 }
@@ -67,4 +70,8 @@ const styles = StyleSheet.create({
     fontSize: 18,
     marginBottom: 10,
   },
+  buttonContainer: {
+    width: "80%",
+    marginTop: 10,
+  },
 });

emma-frontend/components/patientscreens/registration/regThree.js

@@ -61,7 +61,9 @@ export default function PatientRegThree({ navigation, route }) {
   return (
     <View style={styles.container}>
       <Text>Date of Birth</Text>
-      <Button title="Pick a date" onPress={() => setShowDatePicker(true)} />
+      <View style={styles.buttonContainer}>
+      <Button title="Pick a date" onPress={() => setShowDatePicker(true)} color="#703BE7"/>
+      </View>
       {showDatePicker && (
         <DateTimePicker
           value={birthday}
@@ -78,12 +80,14 @@ export default function PatientRegThree({ navigation, route }) {
         onPress={(value) => setGender(value)}
         formHorizontal={true}
         labelHorizontal={false}
-        buttonColor={"#2196f3"}
-        selectedButtonColor={"#2196f3"}
+        buttonColor={"#703BE7"}
+        selectedButtonColor={"#703BE7"}
         labelStyle={{ fontSize: 16, marginHorizontal: 10 }}
         style={{ marginVertical: 10 }}
       />
-      <Button title="Next" onPress={handleNext} />
+      <View style={styles.buttonContainer}>
+      <Button title="Next" onPress={handleNext} color="#703BE7"/>
+      </View>
     </View>
   );
 }
@@ -129,4 +133,8 @@ const styles = StyleSheet.create({
   btnTextCancel: {
     color: "#666",
   },
+  buttonContainer: {
+    width: "80%",
+    marginTop: 10,
+  },
 });

emma-frontend/components/patientscreens/registration/regTwo.js

@@ -47,12 +47,14 @@ export default function PatientRegTwo() {
         onPress={(value) => setPronoun(value)}
         formHorizontal={true}
         labelHorizontal={false}
-        buttonColor={"#2196f3"}
-        selectedButtonColor={"#2196f3"}
+        buttonColor={"#703BE7"}
+        selectedButtonColor={"#703BE7"}
         labelStyle={{ fontSize: 16, marginHorizontal: 10 }}
         style={{ marginVertical: 10 }}
       />
-      <Button title="Next" onPress={handleNext} />
+      <View style={styles.buttonContainer}>
+      <Button title="Next" onPress={handleNext}  color="#703BE7" />
+      </View>
     </View>
   );
 }
@@ -77,4 +79,8 @@ const styles = StyleSheet.create({
     fontWeight: "bold",
     marginVertical: 10,
   },
+  buttonContainer: {
+    width: "80%",
+    marginTop: 10,
+  },
 });

emma-frontend/components/shared/sharedLogin.js

@@ -8,11 +8,13 @@ export default function SharedLogin({ navigation }) {
         <Button
           title="I am here to get help"
           onPress={() => navigation.navigate("PatientLogin")}
+          color="#703BE7"
         />
         <View style={styles.separator} />
         <Button
           title="I am here to help"
           onPress={() => navigation.navigate("PractitionerLogin")}
+          color="#703BE7"
         />
       </View>
     </View>
@@ -26,10 +28,10 @@ const styles = StyleSheet.create({
     justifyContent: "center",
   },
   buttonContainer: {
-    flexDirection: "row",
     marginVertical: 20,
   },
   separator: {
     width: 10,
+    height: 20,
   },
 });

emma-frontend/components/shared/sharedRegistration.js

@@ -11,6 +11,7 @@ export default function SharedRegisterScreen({ navigation }) {
             console.log("Patient registration");
             navigation.navigate("PatientConsentForm");
           }}
+          color="#703BE7"
         />
         <View style={styles.separator} />
         <Button
@@ -19,6 +20,7 @@ export default function SharedRegisterScreen({ navigation }) {
             console.log("PractitionerRegistration");
             navigation.navigate("PractitionerRegistration");
           }}
+          color="#703BE7"
         />
       </View>
     </View>
@@ -31,10 +33,10 @@ const styles = StyleSheet.create({
     justifyContent: "center",
   },
   buttonContainer: {
-    flexDirection: "row",
     marginVertical: 20,
   },
   separator: {
     width: 10,
+    height:20,
   },
 });