Fix dropdown styles

calblueprint · Oct 26, 2024 · ead578b · ead578b
1 parent 438cf50
commit ead578b
Show file tree

Hide file tree

Showing 4 changed files with 19 additions and 6 deletions.
diff --git a/src/components/Dropdown/Dropdown.tsx b/src/components/Dropdown/Dropdown.tsx
@@ -21,8 +21,8 @@ function Dropdown({ options, setValue, value }: DropdownProps) {
       <DropdownElement
         mode="default"
         style={styles.dropdown}
-        placeholderStyle={[styles.text]}
-        selectedTextStyle={styles.text}
+        placeholderStyle={styles.text}
+        selectedTextStyle={[styles.text, styles.black3]}
         inputSearchStyle={styles.text}
         itemTextStyle={[styles.text, styles.gray4]}
         containerStyle={styles.dropdownContainer}

diff --git a/src/components/Dropdown/styles.ts b/src/components/Dropdown/styles.ts
@@ -5,6 +5,9 @@ export default StyleSheet.create({
   gray4: {
     color: colors.gray4,
   },
+  gray3: {
+    color: colors.gray3,
+  },
   text: {
     color: colors.gray4,
     fontSize: 14,

diff --git a/src/screens/TreeInfoScreen/TreeInfoScreen.tsx b/src/screens/TreeInfoScreen/TreeInfoScreen.tsx
@@ -1,3 +1,4 @@
+import { useState } from 'react';
 import {
   ImageBackground,
   ScrollView,
@@ -40,6 +41,9 @@ export default function TreeInfoPage({ route }: TreeInfoPageProps) {
     treeOwnership: TreeOwnership.Planted,
   };
 
+  const [rowNumber, setRowNumber] = useState(treeInfo.rowNumber.toString());
+  const [bankNumber, setBankNumber] = useState(treeInfo.bankNumber.toString());
+
   return (
     <ScrollView style={styles.container}>
       <ImageBackground source={TreeBg} style={styles.imageBg}>
@@ -59,13 +63,15 @@ export default function TreeInfoPage({ route }: TreeInfoPageProps) {
               style={styles.textInput}
               placeholder="Row #"
               placeholderTextColor={colors.gray4}
-              value={treeInfo.rowNumber.toString()}
+              value={rowNumber}
+              onChangeText={setRowNumber}
             ></TextInput>
             <TextInput
               style={styles.textInput}
               placeholder="Location #"
               placeholderTextColor={colors.gray4}
-              value={treeInfo.bankNumber.toString()}
+              value={bankNumber}
+              onChangeText={setBankNumber}
             ></TextInput>
           </View>
         </View>

diff --git a/src/screens/TreeInfoScreen/styles.ts b/src/screens/TreeInfoScreen/styles.ts
@@ -21,11 +21,15 @@ export default StyleSheet.create({
     gap: 5,
   },
   idBadge: {
+    flex: 0,
+    justifyContent: 'flex-start',
     backgroundColor: colors.primary_green_2,
     borderRadius: 5,
+    marginRight: 'auto',
   },
   idText: {
     flex: 0,
+    textAlign: 'left',
     color: colors.white1,
     fontSize: 14,
     padding: 10,
@@ -44,7 +48,7 @@ export default StyleSheet.create({
   body: {
     gap: 25,
     marginHorizontal: 44,
-    marginTop: 40,
+    marginTop: 32,
     flex: 1,
   },
   label: {
@@ -62,7 +66,7 @@ export default StyleSheet.create({
   },
   textInput: {
     flex: 1,
-    color: colors.gray4,
+    color: colors.black3,
     borderWidth: 1,
     borderRadius: 5,
     borderColor: colors.gray4,