Feat(INJI-502): Adjusted the CSS of the search Icon & search bar

Signed-off-by: anil_majji <[email protected]>
mosip · Oct 30, 2023 · f72e495 · f72e495
1 parent 0ee1ed1
commit f72e495
Show file tree

Hide file tree

Showing 3 changed files with 23 additions and 13 deletions.
diff --git a/components/ui/themes/DefaultTheme.ts b/components/ui/themes/DefaultTheme.ts
@@ -1160,17 +1160,22 @@ export const DefaultTheme = {
     issuersSearchBar: {
       borderWidth: 1,
       borderColor: Colors.Gray50,
-      height: Dimensions.get('window').height * 0.06,
-      width: Dimensions.get('window').width * 0.85,
-      paddingLeft: 15,
+      height: Dimensions.get('window').height * 0.055,
+      width: Dimensions.get('window').width * 0.84,
+      paddingLeft: 12,
+      borderLeftWidth: 0,
       borderTopRightRadius: 9,
       borderBottomRightRadius: 9,
     },
     searchIcon: {
       justifyContent: 'center',
-      backgroundColor: Colors.Gray50,
-      height: Dimensions.get('window').height * 0.06,
+      paddingLeft: 15,
+      height: Dimensions.get('window').height * 0.055,
       width: Dimensions.get('window').width * 0.1,
+      borderColor: Colors.Gray50,
+      borderTopWidth: 1,
+      borderBottomWidth: 1,
+      borderLeftWidth: 1,
       borderTopLeftRadius: 9,
       borderBottomLeftRadius: 9,
     },

diff --git a/components/ui/themes/PurpleTheme.ts b/components/ui/themes/PurpleTheme.ts
@@ -1162,17 +1162,22 @@ export const PurpleTheme = {
     issuersSearchBar: {
       borderWidth: 1,
       borderColor: Colors.Gray50,
-      height: Dimensions.get('window').height * 0.06,
-      width: Dimensions.get('window').width * 0.85,
-      paddingLeft: 15,
+      height: Dimensions.get('window').height * 0.055,
+      width: Dimensions.get('window').width * 0.84,
+      paddingLeft: 12,
+      borderLeftWidth: 0,
       borderTopRightRadius: 9,
       borderBottomRightRadius: 9,
     },
     searchIcon: {
       justifyContent: 'center',
       backgroundColor: Colors.Gray50,
-      height: Dimensions.get('window').height * 0.06,
+      height: Dimensions.get('window').height * 0.055,
       width: Dimensions.get('window').width * 0.1,
+      borderColor: Colors.Gray50,
+      borderTopWidth: 1,
+      borderBottomWidth: 1,
+      borderLeftWidth: 1,
       borderTopLeftRadius: 9,
       borderBottomLeftRadius: 9,
     },

diff --git a/screens/Issuers/IssuersScreen.tsx b/screens/Issuers/IssuersScreen.tsx
@@ -161,8 +161,8 @@ export const IssuersScreen: React.FC<
             <Icon
               testID="search"
               name="search"
-              color={Theme.Colors.blackIcon}
-              size={29}
+              color={Theme.Colors.GrayIcon}
+              size={27}
               style={Theme.IssuersScreenStyles.searchIcon}
             />
             <TextInput
@@ -175,7 +175,7 @@ export const IssuersScreen: React.FC<
             />
           </Row>
 
-          <ScrollView style={Theme.IssuersScreenStyles.issuersContainer}>
+          <View style={Theme.IssuersScreenStyles.issuersContainer}>
             {controller.issuers.length > 0 && (
               <FlatList
                 data={filteredSearchData}
@@ -201,7 +201,7 @@ export const IssuersScreen: React.FC<
                 keyExtractor={item => item.id}
               />
             )}
-          </ScrollView>
+          </View>
         </Column>
       )}
     </React.Fragment>